关于react.js:天堂管理系统第一篇初始化

背景:
之前在网上看到有人写过一个天堂管理系统的照片. 于是心里就有一个想法想写个地狱管理系统. 碰巧也始终想写一个我的项目作为本人的储备我的项目.
始终都是在公司不停的帮人家写零碎, 很多常识也是须要的时候再学, 不碰就容易忘. 写这个零碎一是总结下本人学到的货色. 加深印象. 二是给本人找一个长期的事件做.
整个我的项目一步步的途程我都会写成一篇篇文章记录下来. 可能公布的工夫不稳固, 毕竟是不忙的时候才写. 然而我肯定会保持写完的. 前期整个我的项目的代码会传到 Github 上. 有趣味的可自行下载.GitHub 地狱管理系统我的项目地址

应用技术栈:

React + JS + Hook + mock + AntDesignPro + CSS

搭架子

万物善始善终, 第一步必定是搭架子了. 保障本人在 node 环境下, 新建一个我的项目文件夹.

1. 运行 npm install antd --save命令. 搭建一个 AntDesignPro 的空架子.
2. 运行 npm install 命令. 装置依赖
3. 窗口运行 http://localhost:8000 就可能看到页面了.

登陆页面.

登陆的用户名和明码都是在 mock 外面判断的. 写的假接口. 然而简略的判断还是能够的.

  'POST /api/login/account': (req, res) => {const { password, userName, type} = req.body;

    if (password === '666666' && userName === 'admin') {
      res.send({
        status: 'ok',
        type,
        currentAuthority: 'admin',
      });
      return;
    }

    res.send({
      status: 'error',
      type,
      currentAuthority: 'guest',
    });
  },

欢送页面

首次进来的页面. 临时先放的一张图片, 打算下次改为轮播图.

不常解决的中央记录一下:

1. 右上角的集体设置批改:

• 集体设置地位:
• 代码地位:

1. 底部版权设置:

• 底部版权地位:
• 代码地位:

1. 左上角我的项目名:

• 我的项目名地位:
• 代码地位:

1. 页面每次渲染加载 loading: