最近一直看到React 的项目,但是不知道怎么个回事。于是准备开始学习下。
首先是搭建环境。
React
开发依赖 Node.js
与它自带的包管理器 npm
,前往 nodejs.org
下载安装最新版 Node.js,其通常已包含npm
。安装完成后,可在终端用 node -v
与 npm -v
命令检查是否安装成功。
实际操作:
Windows环境,Windows键+R
,输入CMD
,回车,打开命令行窗口。
输入 node -v
与 npm -v
提示已经安装完成。
创建新 React 应用
推荐用Create React App
脚手架快速创建项目。在终端依次执行下面的命令:
npx create-react-app my-react-app
cd my-react-app
npm start
其中 my-react-app
为项目名,可按需修改,我用了myapp
。执行上述命令后,开发服务器启动,浏览器打开 http://localhost:3000
即可看到应用页面。
项目结构
进入项目文件夹,关键文件及文件夹有:
- public/index.html:应用主 HTML 文件,React 渲染的内容会插入至该文件指定位置。
- src/index.js:React 应用入口,通常在此引入根组件,并把其渲染至 index.html 内对应 DOM 节点上。
- src/App.js:定义了基本 App 组件,能对其编辑修改,预览基础的组件修改效果。