React全家桶+AntD 共享单车后台管理系统开发

第1章 课程导学
对课程整体进行介绍,并且说明学习的必要性。

1-1 课程导学
第2章 React基础知识
React基础知识以及生命周期的介绍,并使用React官方脚手架初始化基础项目,同时介绍了新一代打包工具Yarn。

2-1 React基础介绍
2-2 React脚手架使用
2-3 React生命周期介绍
第3章 主页面架构设计
详细介绍了初始项目的插件安装、主题定制以及主页面结构设计。

3-1 基础插件安装(1)
3-2 基础插件安装(2)
3-3 页面结构开发(1)
3-4 页面结构开发(2)
3-5 菜单组件开发(1)
3-6 菜单组件开发(2)
3-7 头部组件实现(1)
3-8 头部组件实现(2)
3-9 底部组件功能实现(1)
3-10 底部组件功能实现(2)
第4章 Router 4.0路由实战演练
主要介绍Router 4.0 路由的使用,从Demo讲解到实战演练,一应俱全。

4-1 React-Router 4.0路由基本介绍
4-2 -React-Router4.0 路由Demo演示(1)
4-3 -React-Router4.0 路由Demo演示(2)
4-4 React-Router4.0 Demo2演示
4-5 React-Router4.0在项目当中的运用
第5章 UI菜单各个组件使用
详细介绍了UI菜单下各个组件的使用,包括了Button、Modal、Loading、Notification、Message、Tab、Gallery、Carousel组件。

5-1 Button按钮使用讲解(1)
5-2 Button按钮使用讲解(2)
5-3 Modal组件使用讲解(1)
5-4 Modal组件使用讲解(2)
5-5 Loading组件使用
5-6 Notification组件使用
5-7 Message组件使用
5-8 Tabs组件使用(1)
5-9 Tabs组件使用(2)
5-10 制作Gallery图片画廊(1)
5-11 制作Gallery图片画廊(2)
5-12 Carousel组件使用
第6章 表单使用
常用表单组件的使用介绍,涵盖几乎所有常用表单组件。

6-1 登录表单讲解(上)
6-2 登录表单讲解(下)
6-3 注册表单讲解(上)
6-4 注册表单讲解(下)
第7章 基础表格、高级表格使用
基于AntD的表格使用介绍,从初级到高级,包含了大部分开发中常用的表格知识和技巧 。

7-1 基础表格讲解
7-2 项目工程化之表格动态渲染(1)
7-3 项目工程化之表格动态渲染(2)
7-4 项目工程化之表格动态渲染(3)
7-5 表格嵌套单选按钮讲解
7-6 表格嵌套多选按钮
7-7 表格分页
7-8 高级表格讲解(1)
7-9 高级表格讲解(2)
第8章 单车业务之城市管理模块
电单车业务菜单介绍,主要讲解了城市管理菜单的模块开发。

8-1 城市管理(上)
8-2 城市管理(下)
8-3 开通城市实现
第9章 单车业务之订单管理模块
主要讲解了单车订单模块的开发,同时讲解了如何制定通用页面结构,囊括了地图业务、单车基础业务知识。

9-1 订单列表(上)
9-2 订单列表(下)
9-3 通用页面结构设计
9-4 订单基础信息实现
9-5 地图功能实现(上)
9-6 地图功能实现(下)
第10章 项目工程化开发
主要介绍了项目工程化,通过对一系列模块的封装来提升开发效率。

10-1 项目工程化概念理解
10-2 模块化封装-BaseForm(1)
10-3 模块化封装-BaseForm(2)
10-4 请求列表封装
10-5 表格封装(1)
10-6 表格封装(2)
10-7 表格封装(3)
第11章 员工管理菜单模块开发
详细介绍了员工模块的功能开发,主要功能是针对员工的增删改查。

11-1 员工管理列表实现
11-2 创建员工功能实现
11-3 员工编辑、详情、删除功能实现
第12章 车辆地图模块开发
主要讲解了车辆地图服务,通过城市、时间等条件可筛选出符合条件的车辆地图分布。

第13章 图表模块开发
主要讲解了Echarts和React的结合使用,如何通过Echart开发出绚丽的图表功能,涵盖了柱形图、饼图和折线图以满足基本的业务需要。

第14章 权限设置模块开发
主要讲解了目前实战课程的权限管理模块,如何能够设置不同用户加载不同的菜单,实现权限的动态分配。

第15章 Redux集成开发
主要讲解了如何将Redux集成到项目中,并加以运用,如何教会大家来运用redux知识。

原文地址:http://blog.51cto.com/13888052/2150238

时间: 2024-10-03 10:26:20

React全家桶+AntD 共享单车后台管理系统开发的相关文章

【共享单车】—— React后台管理系统开发手记:AntD Form基础组件

前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. 一.使用Form组件开发登录页面 pages->form->login.js:对应路由/admin/form/login import React from 'react' import {Card, Form, Input, Button, message, Icon, Checkbox} f

【共享单车】—— React后台管理系统开发手记:AntD Table高级表格

前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. 一.头部固定 scroll属性:设置横向或纵向滚动,也可用于指定滚动区域的宽和高 <Card title="头部固定"> <Table bordered columns={columns} dataSource={this.state.dataSource} pagin

【共享单车】—— React后台管理系统开发手记:AntD Table基础表格

前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. 一.基础表格 Table组件基础Api bordered属性:是否展示外边框和列边框 columns属性:表格列的配置描述(即表头) dataSource属性:数据数组 pagination属性:分页器,设为 false 时不展示和进行分页 <Card title="基础表格"&g

【共享单车】—— React后台管理系统开发手记:项目准备

前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. 一.项目概述       React全家桶 React基础知识.生命周期 Router 4.0 语法讲解 Redux集成开发      AnD UI组件 最实用基础组件 AntD栅格系统 ETable组件封装 BaseForm组件封装 表格内嵌单选.复选封装      公共机制封装 Axios请求

【共享单车】—— React后台管理系统开发手记:主页面架构设计

前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. 一.页面结构定义 左侧导航栏,右侧页面结构 右侧显示内容分别分为上Header.中Content和下Footer部分 二.目录结构定义 src->admin.js:项目主结构代码(index.js中替换App.js挂载到根节点) src->common.js:项目公共结构代码(类似admin.j

【共享单车】—— React后台管理系统开发手记:城市管理和订单管理

前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. 一.城市管理 pages->city->index.js:对应路由/admin/city 顶部子组件一:选择表单 class FilterForm extends React.Component{ render(){ const { getFieldDecorator } = this.prop

【共享单车】—— React后台管理系统开发手记:UI菜单各个组件使用(Andt UI组件)

前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. 一.按钮Button pages->ui->button.js:对应路由/admin/ui/buttons import React from 'react'; import {Card, Button, Radio} from 'antd' import './ui.less' class B

【共享单车】—— React后台管理系统开发手记:Router 4.0路由实战演练

前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. 一.React Router 4.0核心概念 4.0版本中已不需要路由配置,一切皆组件 react-router:基础路由包 提供了一些router的核心api,包括Router,Route,Switch等 react-router-dom:基于浏览器的路由(包含react-router) 提供了

【共享单车】—— React后台管理系统开发手记:权限设置和菜单调整(未完)

前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. 一.创建角色 权限菜单设计:RBAC权限模型(详解链接) RBAC,即基于角色的访问控制(Role-Based Access Control),是优秀的权限控制模型 主要通过角色和权限建立管理,再赋予用户不同的角色,来实现权限控制的目标 角色列表展示:对应Easy Mock数据接口/role/li