Skip to content
后台前端管理系统,基于react、typescript、antd、dva及一些特别优秀的开源库实现
TypeScript CSS JavaScript HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
client
server
.gitignore
README.md

README.md

react-antd-admin

Node Version React Version TypeScript Version Antd Version React-Antd-Admin Version

📖 介绍

基于工作中开发需要,设计了一个后台前端管理系统,节省从零开始搭建的时间,前端基于react(拥抱 hooks)、typescriptantddva及一些特别优秀的开源库实现,特别感谢。

使用nodemockjs模拟了一层数据服务,部署在now.sh平台上。

🏠 主页

在线预览

demo

demo

二维码

📁 目录

react-antd-admin
│
├── client                            * 前端目录
│   ├── config                        * 独立配置、发布时便于修改
│   ├── public                        * 静态资源文件,不被编译
│   ├── src
│   │   ├── assets                    * 资源文件(图标、图片、样式)
│   │   ├── components                * 公共组件
│   │   ├── scripts                   * 脚本(axios数据请求、常量、路由配置、工具函数)
│   │   ├── store                     * mock、redux数据流
│   │   ├── views                     * 视图展示页面
│   │   ├── index.tsx                 * 入口文件
│   │   └── serviceWorker.ts          * serviceWorker
│   ├── typings                       * 类型定义
│   ├── config-overrides.js           * 扩展webpack、create-react-app配置
│   ├── tsconfig.json                 * typescript配置
│  
└── server                            * 接口目录
    ├── public                        * 资源文件
    ├── routes                        * API路由
    ├── scripts                       * 脚本(常量、工具函数)
    ├── nodemon.json                  * nodemon配置
    ├── now.json                      * now配置
    └── app.js                        * API入口

特征

  • 页面
- 登录、注册
- 首页数据统计展示
- 信息中心(邮件功能的一部分效果)
- 订单统计,地图展示各省市订单量
- 会员管理(添加、删除、编辑、查询)
  • 组件
- 视频
- 拖拽
- 无限加载
- PDF预览
- 编辑器
    - 富文本
    - Markdown
  • 其它
- 骨架屏、响应式
- 多皮肤
- 弹窗拖拽
- 图表
- 页面鉴权(实际开发中建议动态读取菜单)
- 按需加载路由
- mock数据
- 封装API请求及一些高阶组件、异常处理

💻 使用

下载:git clone https://github.com/liuguanhua/react-antd-admin.git

进入:cd react-antd-admin

client端
    进入:cd client
    安装:yarn install
    开发:yarn start
    访问:http://localhost:8888

    生产:yarn build

server端
    进入:cd server
    安装:yarn install
    开发:yarn start
    访问:http://localhost:9999

👤 作者

🤝 支持

有什么好的想法、建议、问题和功能需求,欢迎 👋 提出。如果觉得这个项目不错或者对您有帮助,👏 赞一 个 ⭐️❤️

You can’t perform that action at this time.