Skip to content

lzhengms/js-stack-from-scratch

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

从零开始构建 JavaScript 技术栈

关于

这里是从零开始构建 JavaScript 技术栈的中文翻译版本。本教程适合刚入门的新人阅读。

fork 不支持 issue,有问题请直接到主分支的 issue 列表提问。关于中文翻译的问题可以在这里提问。

目前的章节已经翻译完成,欢迎提交 PULL REQUEST


Build Status Join the chat at https://gitter.im/js-stack-from-scratch/Lobby

Yarn React Gulp Redux ESLint Webpack Mocha Chai Flow

欢迎阅读我的 JavaScript 教程:从零开始构建 JavaScript 技术栈

这是一个简单直接的 JavaScript 技术栈构建指南。在此之前,你需要掌握基本的编程知识和一些 JavaScript 基础。本教程旨在将所有这些工具结合起来使用,并为每个工具提供最简单的示例。 你可以把它当作从零开始编写代码样板的示范。

如果你只是想做一个简单的网页,有一些简单的 JS 交互,那么 Browserify/Webpack + Babel + jQuery 就足够了。如果你希望做的是有一定的规模的 web app,那么本教程非常适合你阅读。

本教程不会涉及这些技术的具体细节,因为目的只是让你学会使用它们。如果你想深入了解,可以查阅它们的文档,或者找其他的教程。

教程中提到的大部分技术栈都会用到 React。如果你是一个初学者,想学习 React,create-react-app 是一个很好的选择,它可以帮你快速搭建起开发环境,所有的环境都配置好了。例如你刚加入一个使用 React 的团队,希望快速上手,我非常推荐你使用它。不过在本教程中,不会有任何预先配置好的东西,因为我希望你理解每一行配置背后真实发生了什么。

每个章节都有代码示例,可以使用命令 yarn && yarn startnpm install && npm start 来运行。建议按照每章的说明,一步一步从零开始写所有的代码。

每一章都包含前一章的代码,所以如果你只是想找一个代码样板或脚手架,直接看最后一章的示例代码即可。

注意:章节的顺序不一定是最有利于学习的顺序。 例如,测试和类型检查可以在引入 React 之前完成。 移动章节或编辑过去的章节比较困难,因为我同时需要将这些更改应用到后续加入的章节。 如果所有的内容都定下来了,我相信可以有更好的方式重新组织他们。

本教程的代码可以运行在 Linux,macOS 和 Windows 下。

目录

1 - Node, NPM, Yarn 和 package.json

2 - 包的安装与使用

3 - 使用 Babel 和 Gulp 配置 ES6 开发环境

4 - 使用 ES6 中的 class

5 - ES6 模块系统

6 - 代码检查工具 ESLint

7 - 前端打包工具 Webpack

8 - React

9 - Redux

10 - Immutable JS 和 Redux 的改进方法

11 - 使用 Mocha, Chai 和 Sinon 进行测试

12 - 使用 Flow 进行类型检查

即将加入以下内容

部署/开发环境,Express,React 路由管理,服务端渲染,样式,React 测试工具 Enzyme,Git Hooks。

翻译

Credits

Created by @verekiaverekia.com.

License: MIT

About

从零开始构建 JavaScript 技术栈 - 中文版

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%