react入门 + Ant design的组件库

因为最近面试都被面临问到是否会react框架，在此之前基本都是使用vue框架，所以在此记录
这里是需要用到的是create-react-app脚手架。因此，我们需要先通过npm去下载create-react-app脚手架，它可以帮助我们快速的去搭建react项目。
一、安装create-react-app

npm install -g create-react-app //全局安装

二、创建项目

注意创建项目时没用npm而是npx ， my-app是项目名称
npx create-react-app my-app

三、启动项目

cd my-app 进入到你新创建的项目路径下
npm start 项目启动并在本地创建一个3000的端口号服务

引入Ant design的组件库:

下载组件 npm add antd或者yarn add antd

创建主页
在src中创建一个文件夹，名为views，在views文件夹下面创建一个index.js和一个index.css文件
js代码如下：

import {
    Layout, Menu, Breadcrumb, Icon } from 'antd';
import React, {
    Component } from 'react';
import 'antd/dist/antd.css';
import logo from '../logo.svg';
import './index.css'
const {
    Header, Content, Footer, Sider } = Layout;

class SiderDemo extends Component {
   
    state = {
   
        collapsed: false,
        mode: 'inline',
    };

    toggle = () => {
   
        this.setState({
   
            collapsed: !this.state.collapsed,
        });
    }

    render() {
   
        return (
            <Layout>
                <Sider
                    trigger={
   null}
                    collapsible
                    collapsed={
   this