emmet 是一个非常强大的 html 代码编写助力插件在项目开发的时候非常实用,需要手写几行的代码用 emmet 一行就搞定了。emmet 的具体用法就不做本文介绍,有兴趣的可以自己去 emmet 官网看看介绍。由于它仅在 .html 文件中可以使用,而 React 等前端框架都是在 .js 或 .jsx 文件内写 html 代码。所以有些时候就不奏效了。本文就是介绍如何做 .js/.jsx 文件中使用 emmet 编写 html 代码。

Continue reading

这几天看 Redux 的资料看的简直发疯,每次都看到睡着。今天下午睡了整整 4 个小时,在今晚安静的时候攻坚了一下 Redux。幸亏网上有很多靠谱的资料,不然我也不知道何时能搞清楚 Redux 的作用。下面罗列一下相关资料:

周边资料

创建 webpack+react+redux 的项目模板

react-redux-starter-kit: https://github.com/davezuko/react-redux-starter-kit

webpack-react-redux: https://github.com/jpsierens/webpack-react-redux

Continue reading

Web 前端发展速度真的很快,新知识也多的惊人,一个在职场工作的人如果不时刻刷新自己学习新知识的数量,恐怕几个月就落后了。

你以为学完 HTML5、CSS3、JavaScript 就能行走天下了?不,还有 ES6、SASS、LESS 以及各种前端框架 React、Angular。会了框架就万事大吉了?不,还有各种开发模式,MVC、Flux、Redux。想使用上这些技术,你得知道 NPM 是个什么的,以及如何利用类似 nvm 的工具来管理 NPM 的各种琐碎版本。最后你的项目想要多人协同开发、测试以及上线运营,你还要了解各种模块系统如 Webpack。暂且不说这里面还需要各种美工方面的工作,时不时你还要自己做一个 svg icon。

我搞清楚这些东西的概念就用了一个多月,还没有实现一个像样的项目。而现在各大培训机构要么是基础,要么是单独将某个知识点,基本上没有把这些知识串起来讲的机构或书籍,因为 Web 前端开发领域涉及内容太多了吗?我觉得不是!

处理文件路径信息是经常要用到的字符串处理的手段,应用场景非常的多,不论是 Linux 还是 Windows,在我没接触这一系列函数之前,都是使用一系列字符串处理函数来自己写。而在 Windows 环境下,系统给我们提供了一系列处理路径相关的 API,我们在需要使用的时候直接调用即可,不但可以避免自己使用字符串处理函数处理时可能造成的各种问题,还可以加快我们编程的速度。当然如果你还没有使用字符串处理函数自己处理过路径等信息,我强烈建议你先自己尝试学习一下。轮子可不重复制造,但你必须要清楚轮子的制作工艺,否则在出现故障时就不知道如何处理了。

Continue reading

React 的每一个组件都可以包含一些数据,这些数据一般情况下都是父组件传递进来的。这个过程就像我们给一个可变参数的函数传递参数一样,只不过组件内部接受到这些参数时,都是在 this.props 这个成员中。该功能一般用于组件之间传递数据使用。

Continue reading

安装 React 的学习环境

// 安装创建 react 项目的工具
npm install -g create-react-app

// 创建一个项目
➜  Project create-react-app jiajia-react
Creating a new React app in /Users/myCode/Project/jiajia-react.

Installing packages. This might take a couple minutes.
Installing react, react-dom, and react-scripts...

// 启动项目
cd jiajia-react
npm start

Continue reading