最近在看react,所有都是基于组件化的开发很方便,很快速,相对于原生js的不断操作dom导致浏览器重排重绘耗性能,react采用了虚拟dom,监听dom的变化,对比之后在重绘页面,结合一些UI 组件工具快速建站,很实用。下面我会记录一个完整的项目从开始到结束的完整实现步骤,大家共勉!
第一:配置react环境,安装node,npm等
第二:基本的项目配置(初次执行以下命令)
npm init (经常用到的npm包我直接拷到package.json文件中,省去一个个安装的麻烦)
npm install (会将package.json里面的所以的依赖包全部一次性安装)
webpack (打包)
webpack-dev-server --inline --hot (运行项目,热加载)
npm install --save-dev react-responsive fetch (响应式,请求接口用到的)
第三:项目的目录结构
入口html文件是index文件,root.js是入口js文件,各种组件,样式分为pc和mobile
最后:开始项目开发
最近做了一个小demo,用react 和antd结合做的一个类似网易的新闻站点,可以登录,注册,查看新闻详情,评论,个人信息上传头像等,接口都是假数据
pc端和mobile端 一起的 响应式的页面。
用来练手感受下react的魅力。
项目地址:https://github.com/mxcz213/react-antd-demo