react 高效高质量搭建后台系统 系列

react 高效高质量搭建后台系统

前言

目标:用 react 高效高质量搭建后台系统

如何实现:搞定一个优秀的、通用的、有一定复杂度的react的后台系统。类似项目就可以依葫芦画瓢快速展开。

spug 能否当此重任?可以。首先它是一个优秀的开源 react 项目,此刻(20221215) Star 是8.2k,8月以前是7.2k,资料配套齐全,例如 spug 的文档项目采用的是 Facebook 的 docusaurus。其次它是一个较通用的后台系统(从其页面布局、交互、表单查询、表格展示、权限可以得知)。复杂度一般,有8个一级模块,还有 web终端。

Tip:有关 react 和 spug 笔者已经写过两个系列(react实战 系列七天接手react项目)的文章,本系列就是专注于react 高效高质量搭建后台系统。对于以前已经研究过的内容,笔者不在冗余介绍,只会给出简要及核心步骤,详细请看相关链接

目录

  1. 脚手架搭建
  2. 请求数据
  3. antd和样式
  4. 登录
  5. 系统布局
  6. 表格的封装
  7. 前端权限
  8. 结尾

大纲

spug

脚手架搭建

创建新项目

安装依赖包

antd 按需引入 css

代理

babel

请求数据

axios

mock

antd和样式

antd 多种主题风格

antd 国际化

样式

登录

路由和登录

spug 中登录模块的分析

myspug 登录模块的实现

spug 中系统布局的分析

spug 中系统布局的分析

myspug 系统布局的实现

表格的封装

spug 中 Table 封装的分析

myspug 中 Table 封装的实现

分页请求数据

前端权限

spug 中权限的分析

myspug 中权限的实现

尾篇

表单查询

表单验证

WebSocket

自动构建

完整项目

React 高效高质量搭建后台系统

posted @   彭加李  阅读(1248)  评论(2编辑  收藏  举报
相关博文:
阅读排行:
· 地球OL攻略 —— 某应届生求职总结
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· 提示词工程——AI应用必不可少的技术
· .NET周刊【3月第1期 2025-03-02】
点击右上角即可分享
微信分享提示