在 GitHub 上开源了一个电力设施管理系统(经过授权), 主要使用了 Javascript 做前后端的开发: React + Ant Design + Koa2.

GitHub Demo 链接

系统截图

login
list
add
popup

技术栈

前端主要是 React + Antd, 系统功能比较少,所以没有使用 Typescript 以及没用 Redux 来管理状态。上传图片使用的 Aliyun OSS SDK,没有经过后端生成 token 而是直接上传到 bucket.
打包配置就是基本的 Webpack + Babel.

后端使用的 Koa2 + Mongoose 来访问 MongoDB, 也是基于业务逻辑不复杂,所以用了相对轻量级一点的 Koa2.

前后端交互上有意向考虑 GraphQL, 或者做 serverless 的尝试,但一开始毕竟是一个外包项目考虑到时间成本都作罢,但也有在这个开源项目基础上继续尝试的意愿。

项目结构

├── server
│   ├── app.js
│   ├── config
│   ├── controller
│   ├── ecosystem.config.js
│   ├── middleware
│   ├── model
│   ├── router
│   └── server.js
└── views
    ├── build
    ├── config
    ├── public
    ├── src
    └── static

views 里存放了项目前端的代码,build 相关使用的 webpack,组织方式类似 vue-cli 2.x 版本的方式,大部分配置在 build 和 config 两个目录中。src 里则聚集了各种组件,路由以及 api 交互的代码文件。

server 目录则为后端部分,由于开发和部署都比较依赖 pm2,所以几乎 package.json 的脚本大部分是通过 ecosystem.config.js 启动的。逻辑加数据也是简单的通过 controller + model + router 组织在一起的。app.js 负责 serve index.html 页面,server.js 则负责 api 部分。

安装及使用

仅是尝试功能的话可以直接使用 Demo,
如果想本地调试或者部署,可以在 views/server 文件夹中 npm install 之后修改部分配置再 npm run start.

具体配置在 GitHub Readme 中有介绍,欢迎提 Star 或者 PR 来完善这个项目。

感谢支持。