React入门级学习（二）

环境准备：

        两种方式：第一、可以直接在浏览器中编写代码，也可以在自己电脑上搭建本地开发环境。

     方式一：在浏览器中编写代码

        这是上手最快的一种方式了！

        在浏览器中打开初始模板，可以看到一个空的井字棋盘和React代码。

     方式二：搭建本地开发环境

                1.确保本地安装了Node.js环境，如果还没有Node环境，可以先安装配置，具体安装Node环境，可以参考我的博客文章《Node.Js安装与环境配置之windows》。这里就不讲解安装步骤了。

                2.按照CreateReactApp安装指南创建一个新的项目

npx create-react-app my-app

                3.删除掉新项目中 src/ 文件夹下的所有文件。

注意：

不要删除整个 src 文件夹，删除里面的源文件。我们会在接下来的步骤中使用示例代码替换默认源文件。

cd my-app
cd src

# 如果你使用 Mac 或 Linux:
rm -f *

# 如果你使用 Windows:
del *

# 然后回到项目文件夹
cd ..

                4.在 src/ 文件夹中创建一个名为 index.css 的文件，并拷贝这些 CSS 代码。

                5.在 src/ 文件夹下创建一个名为 index.js 的文件，并拷贝这些 JS 代码。

                6.拷贝以下三行代码到 src/ 文件夹下的 index.js 文件的顶部：

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';

     现在，在项目文件夹下执行 npm start 命令，然后在浏览器访问 http://localhost:3000。这样你就可以在浏览器中看见一个空的井字棋的棋盘了。

作者：筱白