一天搞定React（1）——React安装与配置【已完结】

    Hello！大家好，今天带来的是React前端JS库的学习，课程来自黑马的往期课程，具体连接地址我也没有找到，大家可以广搜巡查一下，但是总体来说，这套课程教学质量非常高，每个知识点都有一个小案例，最后有一个总的美团外卖案例教学，大家可以看看我这篇文章，如果能够帮到你们，还请多多点赞o(￣▽￣)ｄ支持支持🌹，如果文章中有错误的或者是遗漏信息，可以在评论区指出或者是与我私信。我看到了消息，一定会及时更正过来∠(°ゝ°)。话不多说，直接开学💪⛽️！

     本篇教学已完结，具体可查看教程：
1. 一天搞定React（1）——React安装与配置
2. 一天搞定React（2）——JSX语法
3. 一天搞定React（3）——Hoots组件
4. 一天搞定React（4）——Redux
5. 一天搞定Recat（5）——ReactRouter（上）
6. 一天搞定React（5）——ReactRouter（下）

React是一个用来渲染用户界面（UI）的JavaScript库。

注意这里是一个库，而不是框架。这意味着它主要关注于视图层的构建，提供了一个高效的方式来构建组件化的 UI。所以React会比vue框架要更加的灵活

特色：React完全基于JavaScript，只要有JS基础，就可以上手React开发。

环境搭建

React官网地址：https://zh-hans.reactjs.org/

要搭建环境，需要我们的node版本>= 10.16 和 npm版本 >= 5.6

之后打开我们的项目输入以下👇命令创建项目环境：

npx create-react-app 项目名称

项目中看到success！就是安装成功了。

完成之后我们要进入项目，然后启动项目。

启动项目命令：

//这里有两个命令，任选一个就可以了
yarn start
npm start

项目启动成功🥳

目录介绍

• node_modules：项目的依赖文件
• public：保存入口文件index.html
• src：保存源码文件
• .gitignore：git配置文件
• package.json：项目配置文件
• yarn.lock：项目信息文件

清理项目

为了更好的学习，我们可以删去一些不必要的文件。

在src文件夹下，把所有的文件都删除掉只保留一个index.js入口文件即可，并且将入口文件代码更改如下：

import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
  <div>hello React!</div>,
  document.getElementById('root')
);

安装插件

安装Vscode插件，ES7 React/Redux/GraphQL/React-Native snippets