bee智能化代码生成器,一分钟实现前后端系统
共 3406字,需浏览 7分钟
·
2020-07-23 11:13
前言
前不久,我们宣布了 beego 再出发,要为大家带来更好用,功能更多的 beego。我们要做的不只是 beego 本身的重构,还有 beego 周边生态的完善。
众所周知,beego 是用来构建 go 应用的开源框架,那么 go 应用有了,相应的管理后台怎么办,怎么才能只用简单的配置快速的搭建出一套完整的前后端代码,从而解放程序员于 crud 之中呢?
bee 1.3
它来了它来了,它带着大家的福音走来了,经过社区内同学日以继夜的努力,bee 1.3 正式发布了,为什么说它带来了福音,是因为这个版本新加的命令 bee gen pro,下面就着重介绍一下这个命令都能做什么。
bee gen pro
上面也提到了,crud 是很多人绕不过的坎,并不是说它有多困难,而是大量的重复工作会让很多人不胜其烦,beego 社区的同学考虑到了这个问题,所以在 bee 的新版本里推出了这个命令,简单来说,就是可以使用官方提供的配置模版,或者个性化定制的模版,通过这个命令快速的构建出 crud 代码,从而节省大量的时间。
你以为这就完了?不不不,在构建出 crud 代码的同时,我们还可以生成相应的管理后台,数据库,并且自动打通前后端,让你可以直接在管理后台体验 crud 的功能。
到这里如果还觉得不过瘾,我们还提供了 Docker 环境的实例,可以几分钟之内飞速部署,快速体验 bee gen pro 带来的舒爽体验。
设计目标
所以我们将Bee设计为CRUD的元数据中心,使CRUD解析数据和代码模板分开。其优势在于 • 我们的模板不局限于go代码。还可以生成vue,ant design pro等代码,可以将前后端打通。• 我们提供生成代码的官方模板,用户可以提pr,贡献更多的模板 • 如果官方模板不满足用户的需要,用户可以将代码仓库指定到自己的地址或者代码仓库,用自定义的生成代码模板
设计架构
快速体验
创建项目
更新
bee go get -u github.com/beego/bee
创建一个 beego 项目,
bee new beeblog
创建一个 ant design pro4 项目,
cd beeblog && mkdir ant && cd ant && yarn create umi
安装 ant4 的依赖,npm i
创建数据库,
CREATE DATABASE IF NOT EXISTS beeblog DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci;
创建 beegopro.toml
dsn = "root:@tcp(127.0.0.1:3306)/beeblog"
proType = "ant4"
[models.blog]
names = ["name","content","created_at","updated_at"]
orms = ["string","string","datetime","datetime"]
comments = ["名称","内容","创建时间","更新时间"]
[path]
beego = "."
ant = "./ant/src/pages"
注入灵魂,执行生成脚本,
bee pro gen
前端添加代码
/ant/package.json 增加 mock 方式 "start:dev": "cross-env REACT_APP_ENV=dev umi dev",
./ant/config/proxy.ts 增加 beego 反向代理
export default {
dev: {
'/api/blog': {
target: 'http://127.0.0.1:8080',
changeOrigin: true,
pathRewrite: { '^': '' },
},
'/api/': {
target: 'https://preview.pro.ant.design',
changeOrigin: true,
pathRewrite: { '^': '' },
},
},
test: {
'/api/': {
target: 'https://preview.pro.ant.design',
changeOrigin: true,
pathRewrite: { '^': '' },
},
},
pre: {
'/api/': {
target: 'your pre url',
changeOrigin: true,
pathRewrite: { '^': '' },
},
},
};
在 ./ant/config/config.ts 添加菜单
{ name: '博客',icon: 'RocketOutlined',path: '/blog',component: './blog/list'},
{ path: '/blog/info', component: './blog/info'},
{ path: '/blog/update', component: './blog/update'},
{ path: '/blog/create', component: './blog/create'},
添加 beego 代码
conf/app.conf 增加数据库配置
appname = .
httpport = 8080
runmode = dev
####################MySQL 数据库配置###########################
db_adapter=mysql
# 您的数据库host
db_host="127.0.0.1"
#您的数据库端口
db_port=3306
#您的数据库用户名
db_username="root"
# 您的数据库密码
db_password=""
# utf8或者utf8mb4数据库。如果数据库还没创建,并且账号有创建权限,将自动创建。
db_database="beeblog"
main.go 注入数据库代码
package main
import (
_ "github.com/go-sql-driver/mysql"
_ "beeblog/routers"
"fmt"
"github.com/astaxie/beego"
"github.com/astaxie/beego/orm"
)
func main() {
dataSource := fmt.Sprintf("%s:%s@tcp(%s:%s)/%s?charset=utf8mb4&parseTime=true&loc=Local", beego.AppConfig.String("db_username"), beego.AppConfig.String("db_password"), beego.AppConfig.String("db_host"), beego.AppConfig.String("db_port"), beego.AppConfig.String("db_database"))
orm.Debug = true
err := orm.RegisterDataBase("default", "mysql", dataSource)
if err != nil {
panic(err)
}
beego.Run()
}
运行项目
运行 Beego
bee run
运行 Ant
cd ant && npm run start
最后说几句
看了上面简单的几步操作就运行出来的前后端项目,同学们有没有心动,心动不如行动,快去体验一下 bee 新版本带来的便利吧。这里附上操作的视频讲解:https://www.bilibili.com/video/BV1ik4y1B74G/,如果想看更详细的介绍也可以点击下方官方文档的链接。后续我们计划把 Charts,地图等组件也纳入进来,全力辅助小伙伴们愉快的撸码。同时也欢迎各位小伙伴来充实 bee gen pro 的配置模版,多多提 pr,帮助我们把 beego 生态维护的更好。Beego 社区欢迎各位的加入。