基于 Ng-zorro-antd 的企业后台模板 ng-alain

2024-06-12 09:11:09

ng-alain 详细介绍

ng-alain

一套基于 Ng-zorro-antd【ANT DESIGN】的企业后台模板。

README in English

DEMO

快速入门

确保 node 版本 >= 6.9.0 且 npm 版本 >= 3 以上。

ng-alain 本身并非组件库，只是一个单纯的企业后台模板，你可以直接克隆到你的本地，然后立即进入实际开发。

# clone ng-alain repo
# --depth 1 removes all but one .git commit history
git clone --depth 1 https://github.com/cipchk/ng-alain.git# change directory
cd ng-alain# install npm package
# in china please use cnpm （https://github.com/cnpm/cnpm）
npm install# start the serve
npm start# use HMR
npm run serve:hmr

环境

包	版本
`ng-alain`	0.0.1-beta.3
`ng-zorro-antd`	0.5.1
`@angular`	4.4.1
`@angular/cli`	1.4.2

第三方类型[可选]

包	额外依赖	说明
`font-awesome`
`simple-line-icons`
`weather-icons`
`angular-baidu-maps`		BaidDu Map
`angular-qq-maps`		QQ Map
`angular-web-storage`		LocalStorage
`ng2-charts`	`chart.js`
`d3`
`g2-angular`	`g2`
`jquery-sparkline`	`jquery`
`ng2-file-upload`
`ng2-img-cropper`
`ngx-color-picker`
`ng-tree-antd`	`angular-tree-component`
`ng2-dnd`
`sweetalert`

指引文章

ng-alain 非常单纯，整体的设计都基于 ng-zorro-antd。虽然 antd 的栅格、布局已经足够满足我们日常的需求，然而出于对企业后台在开发过程中总是需要一点微调，因此我独立构建了一套用作这类需求工具类样式。

因此，在你开始ANTD之前最好先了解以下系列文章，他们会帮助你更好的理解 antd 是怎么一回事，以及为什么需要这一套工具类规则。

整个antd的指引文章（非常经典一定要细读）
设计规则
CSS组件补丁类
工具类规则
接地气Pipe
ACL访问控制
目录结构与版本升级说明
为了减少github的发布，后续有关 ng-alain 的文章，会一直发布在我的SF专栏当中。

特性

基于 ng-zorro-antd
响应式
国际化
ACL访问控制
延迟加载及良好的启用画面
良好的UI路由设计
十种颜色版本
SCSS预编译
良好的目录组织结构
简单升级
模块热替换

应用截图

Troubleshooting

Please follow this guidelines when reporting bugs and feature requests:

Use GitHub Issues board to report bugs and feature requests (not our email address)
Please always write steps to reproduce the error. That way we can focus on fixing the bug, not scratching our heads trying to reproduce it.

Thanks for understanding!

License

The MIT License (see the LICENSE file for the full text)

ng-alain

一套基于 Ng-zorro-antd【ANT DESIGN】的企业后台模板。

README in English

DEMO

快速入门

确保 node 版本 >= 6.9.0 且 npm 版本 >= 3 以上。

ng-alain 本身并非组件库，只是一个单纯的企业后台模板，你可以直接克隆到你的本地，然后立即进入实际开发。

# clone ng-alain repo
# --depth 1 removes all but one .git commit history
git clone --depth 1 https://github.com/cipchk/ng-alain.git# change directory
cd ng-alain# install npm package
# in china please use cnpm （https://github.com/cnpm/cnpm）
npm install# start the serve
npm start# use HMR
npm run serve:hmr

环境

包	版本
`ng-alain`	0.0.1-beta.3
`ng-zorro-antd`	0.5.1
`@angular`	4.4.1
`@angular/cli`	1.4.2

第三方类型[可选]

包	额外依赖	说明
`font-awesome`
`simple-line-icons`
`weather-icons`
`angular-baidu-maps`		BaidDu Map
`angular-qq-maps`		QQ Map
`angular-web-storage`		LocalStorage
`ng2-charts`	`chart.js`
`d3`
`g2-angular`	`g2`
`jquery-sparkline`	`jquery`
`ng2-file-upload`
`ng2-img-cropper`
`ngx-color-picker`
`ng-tree-antd`	`angular-tree-component`
`ng2-dnd`
`sweetalert`

指引文章

ng-alain 非常单纯，整体的设计都基于 ng-zorro-antd。虽然 antd 的栅格、布局已经足够满足我们日常的需求，然而出于对企业后台在开发过程中总是需要一点微调，因此我独立构建了一套用作这类需求工具类样式。

因此，在你开始ANTD之前最好先了解以下系列文章，他们会帮助你更好的理解 antd 是怎么一回事，以及为什么需要这一套工具类规则。

整个antd的指引文章（非常经典一定要细读）
设计规则
CSS组件补丁类
工具类规则
接地气Pipe
ACL访问控制
目录结构与版本升级说明
为了减少github的发布，后续有关 ng-alain 的文章，会一直发布在我的SF专栏当中。

特性

基于 ng-zorro-antd
响应式
国际化
ACL访问控制
延迟加载及良好的启用画面
良好的UI路由设计
十种颜色版本
SCSS预编译
良好的目录组织结构
简单升级
模块热替换

应用截图

Troubleshooting

Please follow this guidelines when reporting bugs and feature requests:

Use GitHub Issues board to report bugs and feature requests (not our email address)
Please always write steps to reproduce the error. That way we can focus on fixing the bug, not scratching our heads trying to reproduce it.

Thanks for understanding!

License

The MIT License (see the LICENSE file for the full text)

基于 Ng-zorro-antd 的企业后台模板 ng-alain相关推荐

angular7中引用ng zorro antd的三种方式
在新版本的angular中使用新的ng zorro,按照官方文档一步一步来,没有报错,但是也没有反应. 试了一下官方的两种方式,第一种方式如果使用cnpm会报错,第二种方式会没有反应,也是因为使用了c ...
基于 vue + zhengAdmin 的一套后台模板
废话不多说直接上图 vue代码: var data = {system_skin: 'bloom-upms-server',//headersystem_title:'权限管理系统',system_l ...
20款响应式bootstrap后台模板源码下载
绿色清新的bootstrap响应式国外后台管理网站模板蓝色简洁的响应式手机端云后台管理系统模板扁平的html5 bootstrap手机后台管理模板源码下载 win8扁平风格响应式后台管理系统模板下 ...
angular项目集成ng zorro 和ng alain
angular项目集成 ng zorro和ng alain(mock 和acl权限)学习笔记这段时间,比较忙,很久没有写博客了.作为后端开发人员,第一次接触angular,以下是个人的学习心得和D ...
xiaocms php,XiaoCms PHP企业网站模板，，后台可备份 WEB(ASP,PHP,...) 238万源代码下载- www.pudn.com...
文件名称: XiaoCms下载收藏√ [ 5 4 3 2 1 ] 开发工具: PHP 文件大小: 395 KB 上传时间: 2014-09-19 下载次数: 0 提供者: 企诚科技详 ...
响应式织梦通用企业网站后台模板(自适应手机端)
介绍: 精心社交改良过的织梦后台模板,更适合接企业建站单时,给客户使用.简洁明了,容易操作,没有织梦的广告. 不影响原后台使用,做到独立为客户而存在,如果开发人员习惯用默认后台,也可以切换,这个很方便 ...
基于Bootstrap的网站后台模板Metronic
介绍一个非常好用的额后台模板:Metronic.它是一个扁平化设计的响应式后台管理模板,基于强大的Bootstrap 框架实现.Metronic 拥有简洁优雅的 Metro UI 风格界面,6 种颜色 ...
Yii2-Admin-Theme 基于layui的通用后台模板
Yii2-Admin-Theme 基于layui的通用后台模板 Yii2基于layui的通用后台模版,实现了,用户登陆,权限管理,用户管理,密码修改等功能,可以说基本功能已经很全了,方便我们后续的二次 ...
php快速搭建后台,基于thinkphp的后台管理系统模板快速搭建，thinkphp后台模板_PHP教程...
基于thinkphp的后台管理系统模板快速搭建,thinkphp后台模板当我们在搭建网站的时候,后端开发人员在编写后台的管理系统的时候,往往会因为缺少一个合适的后台管理系统的模板,而必须去重新编写一 ...

最新文章

热门文章