【源码】基于React框架的电商管理系统

项目简介

本项目基于React框架开发，结合前端React技术与状态管理库Redux，具备商品分类管理、商品信息添加与修改、用户和角色管理、导航菜单权限控制等功能，适用于电商后台管理场景。

项目的主要特性和功能

1. 用户交互：支持登录、自动登录及退出登录，登录成功后进入后台管理界面操作。
2. 商品管理：可添加、更新和展示商品分类，支持一、二级分类；能对商品进行分页展示、搜索、状态更新、详情查看、添加和修改，添加与修改时支持表单验证和图片上传。
3. 角色与用户管理：角色可前台分页显示、添加和授权；用户可分页列表展示、添加、修改和删除。
4. 权限控制：根据用户角色控制导航菜单权限，仅显示具备相应权限的菜单项。
5. 数据可视化：支持使用echarts、g2、d3等库进行数据可视化展示。
6. 界面展示：利用antd组件库搭建美观易用的界面，包含布局、表单、表格、模态框等。
7. 状态管理：使用Redux集中管理头部标题和登录用户信息等状态。

安装使用步骤

开发环境

1. 确保已安装Node.js和npm。
2. 下载项目源码文件，进入项目根目录。
3. 运行npm install安装项目依赖。
4. 运行npm start启动开发环境。
5. 若遇ajax跨域问题，可在package.json中配置代理：proxy: "http://localhost:5000"。

生产环境

1. 运行npm run build打包项目。
2. 使用serve工具运行打包后的文件：serve build。
3. 使用nginx的反向代理解决ajax跨域问题，或开启CORS允许浏览器端跨域。
4. 解决BrowserRouter模式刷新404问题，使用自定义中间件读取返回index页面。

Git操作

1. 创建远程仓库，在本地初始化仓库并关联远程仓库。
2. 本地创建dev分支并推送到远程。
3. 本地有修改时，依次执行git add .、git commit -m "xxx"、git push origin dev。
4. 新同事复制仓库，运行git clone url，创建并切换到dev分支：git checkout -b dev origin/dev，拉取远程dev分支代码：git pull origin dev。
5. 远程有修改时，运行git pull origin dev。

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】