DevUI Admin 2.0 重磅发布！🥳

DevUI是面向企业中后台产品的开源前端解决方案，其设计价值观基于"至简"、"沉浸"、"灵活"三种自然与人文相结合的理念，旨在为设计师、前端开发者提供标准的设计体系，并满足各类落地场景，是一款企业级开箱即用的产品。如果你正在开发 ToB 的工具类产品，DevUI 将是一个很不错的选择！

引言

预告了2个星期，DevUI Admin 2.0 终于来了！先来看看黑科技是什么吧！

在2.0版本中，我们将区块从Admin中抽离了出来，并且推出了一套对应的Angular CLI去帮助你使用我们的区块，让你可以更快更方便地搭建一个基于DevUI Admin的后台管理系统。后续我们还会持续丰富现有的区块，完善CLI让其能够帮助你做更多的事情。

除此之外，我们还新增了：

动态表单
第三方登录，账号注册
消息提醒面板

为了让大家快速将黑科技用起来，我们特意在B站录制了一段4分钟的教学视频，欢迎大家围观～

https://www.bilibili.com/video/BV1o3411z7qi/

1 DevUI Admin 区块

目前DevUI Admin提供了4类共19个内置区块，覆盖表单、列表、图表等丰富的业务场景。

为了更方便的使用我们的区块，我们建议你先初始化我们的种子工程，再通过我们提供给你的 cli 来添加我们的区块以及基于我们的区块来搭建一个页面：

ng add ng-devui-admin

初始化我们的种子工程之后，别忘了先安装我们的物料库哦：

npm i ng-devui-materials

之后你就可以在你的项目中通过我们提供的命令行来进行区块的添加以及页面的创建：

ng g ng-devui-admin:blocks
ng g ng-devui-admin:views

在这里你需要知道我们区块的名字，你可以前往 Admin 区块进行查看。

1.1 在页面中添加区块

# For Example
cd src/app/pages/getting-started/sample
ng g ng-devui-admin:blocks

通过使用我们提供的 ng-devui-admin 命令行，通过简单的命令行操作你就可以将我们的区块快速添加到你的页面当中，之后你只需要简单的调整布局或者内容的调整就可以完成页面的搭建，布局的调整可以参考 Admin 布局。

1.2 基于区块创建页面

# For Example
cd src/app/pages/getting-started
ng g ng-devui-admin:views

通过使用我们提供的 ng-devui-admin 命令行，通过简单的命令行操作你就可以初始化一个页面并添加我们提供的区块，再将其添加到对应的模块中，之后根据你的需要自行进行调整即可，更多使用可以参考 DevUI Admin。

2 动态表单

由于中后台应用表单需求较多，通过多次书写繁琐的表单模板进行表单创建，费时费力。DevUI Admin对DevUI组件库的表单组件进行了二次封装，你可以根据我们规定的对象模型元数据来动态的创建表单。另外，DevUI Admin已内置radio、checkbox、textInput、toggle、select等多个小部件可供选择，在表单内渲染。