Demeter是一个CMS系统,提供用户体系以及App项目相关内容管理. 其中会包括用户模块,项目模块和归档模块等. 该系统会长期迭代和维护.
| 技术栈 | 描述 |
|---|---|
| ES6 | 项目代码以ES2015为标准 |
| Rxjs | 构建流式应用 |
| MongoDB | 使用MongoDB作为数据持久化容器 |
| Express | 基于nodejs的Web后端开发框架 |
| JWT | 使用JWT实现前后端分离 |
| React | 构建前端框架 |
| react-router | 控制前端路由 |
| Redux | 管理React的状态流 |
| Redux-observable | 处理异步redux action |
| Webpack | 打包React代码,并提供dev-server |
| AntD | 使用AntD提供的UI组件 |
项目地址: https://github.com/HiJesse/Demeter
项目部署和启动
- 安装并建立一个名为demeter的mongo数据库
- clone仓库在项目跟目录下执行
npm install - 安装配置pm2
npm install pm2 -g - 项目根目录下
npm run deploy部署项目 - 浏览器打开http://localhost:3000/站点进入demeter登录页
- 根目录下
npm run undeploy卸载项目.
用户模块
提供用户体系. 用户分为管理员和普通用户两个权限,管理员可以对所有用户信息进行管理.
| 功能 | 需要登陆 | 需要权限 |
|---|---|---|
| 登录 | × | × |
| 修改密码 | × | × |
| 修改昵称 | √ | × |
| 登录后修改密码 | √ | × |
| 创建用户 | √ | √ |
| 重置密码 | √ | √ |
| 删除用户 | √ | √ |
| 模糊查找用户 | √ | √ |
| 查看用户列表 | √ | √ |
-
在登录页点击修改密码跳转到该页面. 用户如果知道自己的账号密码就可以通过该页面修改密码. 如果忘记密码了则需要联系管理员重置账号密码.
-
登录成功之后进入系统首页,首页默认展示仪表盘页面. 该页面展示当前系统注册用户数和已经创建的项目数. 页面左侧为模块菜单,顶部显示用户名,用户权限以及推出登录按钮. 用户管理模块和项目管理模块只有管理员可以看到并操作.
个人中心
-
用户管理模块需要管理员权限才能访问. 提供新建用户,重置用户密码和用户列表展示. 新建用户时只能输入账号,用户昵称默认为匿名,用户权限默认为普通用户
项目模块
提供项目管理功能. 新建一个项目时会生成Android 和IOS两个平台对应的子项目,同时生成两个唯一的App ID作为该项目对应平台的唯一标识,可以在不同的场景使用,例如移动端原生接入或者作为脚本参数等. 之后的业务模块都以项目为单位展开. 该模块提供以下管理功能.
| 功能 | 需要权限 |
|---|---|
| 退出项目 | × |
| 查看项目信息 | × |
| 修改项目基本信息 | × |
| 新建项目 | √ |
| 删除项目 | √ |
| 添加项目成员 | √ |
| 删除项目成员 | √ |
创建项目
项目列表 (管理员)
所有建立成功的项目都会在项目列表中展示. 列表分页展示所有的项目信息,并提供根据项目名称模糊查询; 平台ID查询; 项目信息显示; 项目信息更新; 成员管理以及项目删除的功能.
项目列表 (普通用户)
普通用户可以查询到自己所加入的项目列表. 在项目信息展示方面跟管理员所查询到的项目列表保持一直. 但是在功能上普通用户只保留了退出项目的选项.
相关文档
原文链接：https://www.f2er.com/react/302424.html
