• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

admui: 基于AngularJs、Bootstrap框架,以及Google Material Design的设计理念,开发 ...

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称:

admui

开源软件地址:

https://gitee.com/guoruifeng/admui

开源软件介绍:

AdmUI

AdmUI

AdmUI

你还在为项目的用户体验和UI的颜值发愁吗?

曾经,我们也是,公司的各个部门,每做一个项目都要对应的搭一套前端的项目,

对于只擅长写后台的代码汪来说,这个过程相当的苦恼,各种问题让你抓狂不已,

我们一怒之下,找了当下比较流行的技术,又不想跟Bootstrap千篇一律,

于是我们采用了Google Material Design做为设计语言,开发了适用于中后台管理类型的UI Template项目,

你只需要根据自己的需要,简单的修改几个配置就能搞出一个华丽的前端UI :tw-1f600:

你可以打开这个链接看一下效果,http://guoruifeng.oschina.io/admui/

所以,

AdmUI它是一个中后台管理UI快速开发模板,采用Bootstrap、AngularJS等技术,已完成项目整体基础搭建,只需要在App/modules下添加自己的view和js你就可以开始干活了 :tw-1f60b:

你需要熟(control+c)悉(control+v)并使用的技术:

  1. Bootstrap 3,http://getbootstrap.com
  2. AngularJS 1.5.x,https://angularjs.org/
  3. AngularJS Material 1.0.4,https://material.angularjs.org/1.1.0/

如何开发

Master是基础依赖框架整合分支,最终会生成单独的js和css包,供App开发引用,Pages是实践项目,包括App开发中所用到的文件。

克隆pages分支,在 app/modules/目录中添加模块即可,plugins是你项目依赖的第三文件组件,运行npm start启动项目,默认地址:localhost:9800

环境

  1. Node、Npm(建议使用cnpm加速器)
  2. grunt、bower

输入图片说明

功能特性

  1. 基于 Bootstrap 3
  2. 基于AngularJS 1.5.x
  3. 以 Google Material Design 为设计语言
  4. 支持多Tab切换,可以关闭当前、其它等功能
  5. 主菜单动态配置,支持多级
  6. 不同的 Material Design Colors ,并且可以在不同的View中使用不同的Color
  7. 三种不同的 layouts
  8. 集成了AngularJS Material
  9. 支持在View中懒加载所需要的依赖文件
  10. 响应式实现,适配各种尺寸的屏幕
  11. 完全实现了 Material Design Colors
  12. 采用 Node、Bower 和 Gulp做为开发工具
  13. Less源码
  14. 仿Inbox的案例页面
  15. 制作了Profile、Gallery、Login、Sample page等页面

依赖的技术

  1. Bootstrap - http://getbootstrap.com
  2. jQuery - http://jquery.com
  3. AngularJS - https://www.angularjs.org
  4. AngularJS Material - https://material.angularjs.org/
  5. Bower - http://bower.io/
  6. Gulp - http://gulpjs.com/
  7. OC Lazy Load for AngularJs - https://github.com/ocombe/ocLazyLoad
  8. Animate.css - http://daneden.github.io/animate.css/
  9. Flot Chart - http://www.flotcharts.org/
  10. magnific-popup - http://dimsemenov.com/plugins/magnific-popup/
  11. Full Calendar - http://fullcalendar.io
  12. Material Design Icon - http://zavoloklom.github.io/material-design-iconic-font/icons.html
  13. SparkLine Chart - http://omnipotent.net/jquery.sparkline/
  14. SummerNote - http://summernote.org
  15. Malihu Content Scroller - http://manos.malihu.gr/jquery-custom-content-scroller/
  16. Angular Loading Bar - http://chieffancypants.github.io/angular-loading-bar/
  17. Roboto Font - https://www.google.com/fonts/specimen/Roboto

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap