从零开始撸一款项目模版管理平台 【一】

前言

前一段时间膜拜vue3源码，看scprit脚本时学习到一个用来生成bootstrip.js代码。其功能通过命令 nodejs bootstrip.js -- projectname
生成新的有统一规范的项目模版。萌生了开发一套模版管理平台的想法，故在此系列开始介绍如何从零开始设计实现一套模版管理平台。希望能帮到有需要的同学，一起提高。

本篇内容

本篇主要分享一下准备实现的产品功能及目标，另外也介绍一下准备采用的技术栈供大家参考。

目标

用来管理常用的项目模版，在新建项目时可以快速获取有通用模版代码，减少项目搭建成本提升初始化项目效率。类似vue-cli,create-react-app等脚手架的一个可视化的实现，不同点在于生成的模版和项目数据存储在服务端，好处是模版灵活，项目模版可以类似资产一样方便公司级别的管理维护。

功能

第一版将只实现模版管理的核心功能

1. 新增模版 新增模版功能包括有新增模版,新增模版后模版对应的模版内文件管理，文件模版编辑，模版配置项管理
2. 编辑模版
   除没有新增入口外，其他的文件管理，文件模版编辑等功能交互均与新增保存一致
3. 模版列表
   查询模版列表，且提供新增编辑入口
4. 根据列表创建项目
   在模版列表提供项目创建入口,选择对应模版点击创建进入配置项选择。选择项目配置。选择完成后点击新建根据配置项生成代码。

后续可以持续迭代开发的地方

1. 权限管理，账号体系
2. 模版&项目与账号体系打通
3. 平台化,服务化

技术栈

架构采用前后端分离的方式实现，主要使用技术栈如下

• 后台服务端选用nestjs，选用的原因主要是其和java spring mvc模式相似，也有较方便的orm库，后续如其他同学想参考使用java改造自己的服务也方便参考。 官网 https://nestjs.com

• 管理界面在这个开源项目基础上开发 antdesignpro vue https://github.com/sendya/ant-design-pro-vue 不选用react系列的主要原因是想快速产出产品，vue开发来说效率真的会高一些

• db 选用 mysql

• 版本管理 git

因为主要是模版管理，数据量并不会太大，暂不考虑缓存等其他性能相关的设计。第一版以实现功能走通流程为主，而且如果只是公司内部使用也项目模版除了文件之外，数据量本身不会太大。当然，如果往平台方面发展做提供服务给所有需要服务的个人或者公司时需要考虑，这是后话，先把当前的想法撸出来。

预告

后续篇章的分享将会主要介绍前后台项目的搭建 ，表结构设计,和核心生成项目代码部分的实现思路。另外如有时间也会尽量完善用例图，产品架构图，系统架构等等方便快速熟悉项目。