前言

本篇的主要内容是 52ABP SPA模板如何配合52ABP代码生成器开发项目

如果不了解 52ABP 项目请先看我的第一篇文章 [52ABP系列] - 001、SPA免费项目模版搭建教程

话不多说,教程开始

一、安装代码生成器

首先打开VS,找到顶部菜单中的 工具 选项,打开 工具 选项中的 扩展和更新, 然后选择 联机 ,输入 52ABP 安装最新的代码生成器,支持生成UI的代码生成器版本是 2.1.8 或者更高版本 (我这里是2.1.8,本机打的包,暂时没有发布)

二、启动项目

请直接根据第一篇文章,搭建并运行项目: [52ABP系列] - 001、SPA免费项目模版搭建教程

三、新建实体并添加到数据库

在项目中的Core层创建一个实体对象 Member 如图所示

实体Member的代码贴在这里

using Abp.Domain.Entities;
using System;
using System.Collections.Generic;
using System.Text; namespace LTMCompanyNameFree.YoyoCmsTemplate.Members
{
public class Member : Entity<long>
{
public string Name { get; set; } public int Age { get; set; } public string Remark{ get; set; }
}
}
创建数据表

DbContext 中添加 DbSet

迁移数据库,这里和第一篇文章中的创建数据库相同,但是命令会多一个,使用了了如下两个命令

add-migration AddEntityMember   // 创建迁移
update-database // 更新数据库

如果没有用过EFCore Code First做迁移,请先查阅资料 官方文档

四、使用代码生成器快速生成前后台基本代码

如果是第一次使用代码生成器请查看: .NET CORE 框架ABP的代码生成器(ABP Code Power Tools )使用说明文档

选中实体代码文件右键菜单选择52ABP代码生成器

选择你需要生成的选项,如果是第一次使用,就要勾选第一次是用代码生成器,会给你生成一些基础的代码。

NG-Zorro UI是生成前端页面的选项。

选择好了之后直接点击 确认 ,进入Dto配置界面,在这里勾选配置Dto要用到的字段、校验、字段对应的前端控件等等。 选择好了之后,直接点击确认,开始生成代码

生成成功将会弹框提示

生成的代码文件:

NgZorroUI目录中的members目录就是生成的前端页面,将这个目录copy到前端项目中使用的位置

Copy结束之后,打开生成的Readme.cs文件,根据说明一步步执行操作

  1. 编译并启动后端项目
  2. 运行前端项目中 nswag 目录下的 refresh.bat 文件
  3. refresh.bat 执行完成之后更新前端 shared-> service-proxies-> service-proxy.module.ts

  1. 添加到前端导航菜单

  1. 添加到前端路由

  1. 添加到前端对应的Module

按照步骤操作完成之后,编译启动前端项目查看效果

菜单

创建新数据

创建成功后的列表和操作

编辑

到这里本篇教程就结束了,配合代码生成器达到了快速开发的目的,当然代码生成器生成的代码还是又很大缺憾的,如果要灵活的话,还是需要你自己在代码生成器生成的代码基础上做修改。

文笔欠佳,只能尽力描述到细节,还请多多指正错误,多多支持

[52ABP系列] - 002、模板项目配合代码生成器开发的更多相关文章

  1. Flask开发系列之模板

    Flask开发系列之模板 本文对<FlaskWeb开发:基于python的Web应用开发实战>模板一节做的总结. Jinja2模板引擎 模板 模板是一个包含响应文本的文件,其中包含用占位变 ...

  2. Win10系列:JavaScript 项目模板和项模板

    使用Visual Studio 开发Windows应用商店应用时,通过其提供的模板可以帮助我们快速地创建一个应用.其中,在新建一个Windows应用商店应用程序项目时可以在项目模板中选择所需要的模板类 ...

  3. Node项目模板管理脚手架ptm-cli开发

    目录 一.ptm-cli 使用说明 1.特点 2.安装 3.使用 1)基础帮助命令 2)添加模板/项目 3)编辑模板/项目 4)查看模板/项目 5)删除模板/项目 6)基于模板新建/初始化项目 二 p ...

  4. maven系列:archetype项目模板_create-from-project

    主要介绍create-from-project插件在命令行下的使用. [第一步:生成模板项目] 新建一个maven项目,比如叫 :groupId=com.abc.demo,artifactId=com ...

  5. Winform开发框架之图表报表在线设计器2-图表-SNF.EasyQuery项目--SNF快速开发平台3.3-Spring.Net.Framework

    上一篇讲到,如何快速创建报表程序了.这篇教大家如何快速制作图表报表. 继上一篇,Winform开发框架之图表报表在线设计器-报表 上一篇讲到如何了创建数据源,这里就不在介绍了.那我们就直接从图表设计器 ...

  6. Winform开发框架之图表报表在线设计器-报表-SNF.EasyQuery项目--SNF快速开发平台3.3-+Spring.Net.Framework

    带过项目和做过项目的人都知道,在客户现场客户的需求是百般多样的,今天要查销售出库情况,明天要看整个月的各部门销售情况,后天要查全年每个客户的项目金额.一直以前都有新需求,虽然会有售后收益,但如果有一个 ...

  7. [置顶] vue-cli的webpack模板项目配置文件分析

    2017-09-11更新:更新到webpack 2.6.1所对应的配置,完善部分代码注释. 由于最近在vue-cli生成的webpack模板项目的基础上写一个小东西,开发过程中需要改动到build和c ...

  8. vue 快速入门 系列 —— Vue(自身) 项目结构

    其他章节请看: vue 快速入门 系列 Vue(自身) 项目结构 前面我们已经陆续研究了 vue 的核心原理:数据侦测.模板和虚拟 DOM,都是偏底层的.本篇将和大家一起来看一下 vue 自身这个项目 ...

  9. QT5 QSS QML界面美化视频课程系列 QT原理 项目实战 C++1X STL

    QT5 QSS QML界面美化视频课程系列 QT原理 项目实战 C++1X STL 课程1   C语言程序设计高级实用速成课程 基础+进阶+自学 课程2   C语言程序设计Windows GDI图形绘 ...

随机推荐

  1. 有意思的String字符工具类

    对String的操作是Java攻城师必备的,一个优秀的攻城师是懒惰,他会把自己的一些常见的代码写成可提供拓展和复用的工具类或者工具库,这些是这些优秀工程师的法宝. 我就先从String这个基本操作开始 ...

  2. 【译】x86程序员手册41-10.6 TLB(快表)测试

    译注:本章基本未做翻译 10.6 TLB Testing TLB测试 The 80386 provides a mechanism for testing the Translation Lookas ...

  3. webstorm里直接调用命令行

    写代码写到一半要切换窗口出去敲命令行?webstorm的external tools可以帮你省下一点时间 举例说明,比如我要直接使用npm: ctrl+alt+s打开setting菜单,找到exter ...

  4. (转)淘淘商城系列——分布式文件系统FastDFS

    http://blog.csdn.net/yerenyuan_pku/article/details/72801777 商品添加的实现,包括商品的类目选择,即商品属于哪个分类?还包括图片上传,对于图片 ...

  5. pringBoot Controller接收参数的几种常用方式

    第一类:请求路径参数1.@PathVariable 获取路径参数.即url/{id}这种形式.2.@RequestParam 获取查询参数.即url?name=这种形式例子 GEThttp://loc ...

  6. clusterdb - 对一个PostgreSQL数据库进行建簇

    SYNOPSIS clusterdb [ connection-option...] [ --table | -t table] [ dbname] clusterdb [ connection-op ...

  7. CAD使用GetxDataDouble读数据(com接口)

    主要用到函数说明: MxDrawEntity::GetxDataDouble2 读取一个Double扩展数据,详细说明如下: 参数 说明 [in] LONG lItem 该值所在位置 [out, re ...

  8. Vue完成TodoList案例

    写一个简单的TodoList的更实用(文末有彩蛋). 一,使用VUE-CLI脚手架快速搭建一个框架 利用VUE-CLI来自动生成我们项目的前端目录及文件,方法: npm install -g vue- ...

  9. Mysql读写分离与主从数据库设置方案

    Mysql读写分离与主从数据库设置方案 亿仁网 18-10-0711:31 Mysql无非四个功能:增,删,改,读.而将增删改和读分离操作.这样有利于提高系统性能.下面是非常直观的操作: 1.配置: ...

  10. 安装Yellowfin报错——No such file or directory: '/tmp/pip-build-jykvuD/YellowFin/README.md'

    https://blog.csdn.net/quqiaoluo5620/article/details/80608474 在Pycharm中安装Yellowfin时一直报错"no such ...