Dojo的UI框架bootstrap for dojo和Dojo-Bootstrap简介
最近在学习Dojo,但样式问题真是头疼呀,虽然清新的淡蓝色很是减缓眼睛的疲劳,但这个扁平化简约风盛行的年代,光是清新的拟物已经满足不了群众的需求了,所以就在这样的需求下,我知道了bootstrap for dojo UI 的存在,并且好消息是这个是基于 BSD和Apache的开源协议,也就是说和dojo一样可以改源码,可以免费商用,你的项目也不用必须开源,跟Dojo一样,很爽吧。
在github上的地址是https://github.com/atoha/dbootstrap,演示地址是http://martinpengellyphillips.github.com/dbootstrap/,谁说dojo没有extjs好看,只是因为自己懒吧,既然懒,还不找找大牛制造的轮子么,好了,等我兴致勃勃的下载下来后发现不知怎么运行,这时候就是此篇博客所要发挥的重要性了。
首先下载,不要点github上的下载zip按钮,因为项目中有的文件是别的项目的文件,直接下载不会包含引用的文件,要复制下面说明中的
git clone --recursive git://github.com/martinpengellyphillips/dbootstrap.git
这个我就不详细说了,用过git的都知道怎么弄了,没用过的学下吧,有好处。
git 下载后的目录结构是这样的

你的下载文件可能比我多几个,这是因为我把没用的删掉了。并且你们也没有build目录,这个目录就是我们最后要生成的目录,继续往下看吧!
之后就是重头戏了
这里需要安装四个文件,至于安装方法我只能简单概括,毕竟安装软件对于工程师来说应该不算什么难事,网上的帖子说的比我要详细的很多。
第一步:安装python,这里要注意python的版本有所限制,要大于等于 2.6,小于3,现在官网最新的python2.x的版本是2.7,所以我使用的是2.7版本,就好似你需要兼容IE8一样,不能使用jquery2.1.4一样,只能用1.11.3。
第二步,安装node,这个步骤我就不说了,自行查吧,很简单。但要版本大于等于0.10.5,还好现在官网的下载连接都是0.12.x的了
第三部,安装stylus,这个stylus其实是一个css预编译语言,只不过这里说的是一个基于node构建的编译styl文件的模块,所以你安装完node后,想必你也知道npm了,就是一个node模块的管理工具,在控制台中输入:
npm install -g stylus
即可,之后等待安装完毕,-g一定不要丢了,这个很重要,意思是这个模块在任何文件目录下都可用。stylus的版本要求是最低0.31,但你在看这篇帖子的时候npm下来的版本已经大于这个版本了,无需关心。
第三部,java jdk安装,这个更不用说的。配置jdk环境的帖子比配置node的都要多,自己搜下吧,但要7以上才行,我用的最新的8.
当这些步都搞定的时候接下来就是生成可运行的demo时候了:
也很简单cd进入到dbootstrap目录,也就是有build.py文件的根目录下
运行以下命令行
python build.py demo
此时就会在dbootstrap目录下生成build目录,这个目录就是编译后的文件,但入口的html文件在dbootstrap\source\index.html下,此时在服务器环境中运行index.html即可,如下:

怎么样,完全的bootstrap风格吧,但全是这种风格看多了,我怎么感觉bojo的默认风格反而更好看呢,哈哈!!!
第二次添加:
另一个DojoUI框架:Dojo-Bootstrap
这个一个网友推荐的,我也就看了下,毕竟因为自己懒吗,不想自己写,嘿嘿。
github地址:https://github.com/xsokev/Dojo-Bootstrap
演示地址:http://xsokev.github.io/Dojo-Bootstrap/
这个的构建要比第一个要简单
直接下载文件,之后进入到项目根目录,用bower下载依赖项
第一步:安装bower
npm install -g bower
第二步:安装依赖
bower install

此时就可以运行Dojo-bootstrap/tests/index.html了

Dojo的UI框架bootstrap for dojo和Dojo-Bootstrap简介的更多相关文章
- HBuilder支持jquery、zepto、angular、ext、dojo 等js框架的提示吗
HBuilder有通行的js扫描分析提示,大部分js库都可以方便的提示.但js是一门超级灵活的语言,通行分析有时分析的不够完美,如果对框架做单独优化配置,可以有更好的提示.DCloud官方对jquer ...
- Bootstrap 前端UI框架
Bootstrap 有哪些优越性? 1.简单灵活的用于搭建WEB页面的HTML,CSS, JavaScript的工具集 2.基于html5, css3, 具有良好特性,友好的学习曲线,卓越的兼容性,1 ...
- 前端MVC框架、类库、UI框架选择
CSS预处理器sass(基于Ruby服务端版)less(客户端版:基于js; 服务端版:基于nodejs) 前端UI框架JqueryMiniUI: http://www.miniui.com/(适用于 ...
- 5个界面效果很炫的JavaScript UI 框架
Web 开发很简单,Web 应用的 UI 开发却很复杂,如果能够利用一些成熟的 UI 框架可以大大的减少开发的复杂度.本文向你介绍 5 款界面效果很不错的 JS 框架. 1. ExtJS ExtJS ...
- 《开源框架那些事儿22》:UI框架设计实战
UI是User Interface的缩写.通常被觉得是MVC中View的部分,作用是提供跟人机交互的可视化操作界面. MVC中Model提供内容给UI进行渲染,用户通过UI框架产生响应,一般而言会由控 ...
- 前端UI框架和JS类库
一.前端框架库: 1.Zepto.js 地址:http://www.css88.com/doc/zeptojs/ 描述:Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与jqu ...
- 从零开始,搭建博客系统MVC5+EF6搭建框架(4)上,前后台页面布局页面实现,介绍使用的UI框架以及JS组件
一.博客系统进度回顾以及页面设计 1.1页面设计说明 紧接前面基础基本完成了框架搭建,现在开始设计页面,前台页面设计我是模仿我博客园的风格来设计的,后台是常规的左右布局风格. 1.2前台页面风格 主页 ...
- 推荐几个精致的web UI框架
1.Aliceui Aliceui是支付宝的样式解决方案,是一套精选的基于 spm 生态圈的样式模块集合,是 Arale 的子集,也是一套模块化的样式命名和组织规范,是写 CSS 的更好方式. git ...
- 不懂前端的程序员不是好美工——UI框架metronic使用教程——程序员视角
本着不懂前端的程序员不是好美工的观点,所以作为一个仅懂一点前端的程序员,为了成为一个好美工,所以只能用些取巧的方法伪装一下. metronic一个基于bootstrap的响应式的后台管理平台的UI框架 ...
随机推荐
- 将JSON映射为实体对象(iOS篇)
将JSON映射为实体对象(iOS篇) iOS开发人员已经习惯于将JSON转换为字典或者数组来进行操作了,接下来我要做的事情,可能匪夷所思,但是,对WP和Android开发人员而言,他们更倾向于将JSO ...
- CKeditor 集成 CKFinder
之前照着网上的做,遇到了一些问题,经过多次实验修改最后算是成功了,下面进行详细讲解. 一.CKeditor的配置(附件中已有最新版CKeditor和CKFinder) 1.需要下载ckeditor, ...
- jquery选择器之属性过滤选择器
<style type="text/css"> /*高亮显示*/ .highlight{ background-color: gray } </style> ...
- Go Revel 学习指南
Go Revel 学习指南 CONTROLLERS(控制器) Routing(路由)http://www.cnblogs.com/hangxin1940/p/3267065.html Paramete ...
- 虚拟化平台cloudstack新版本的调试
虚拟化平台cloudstack(7)——新版本的调试 调试环境 ubuntu 12.04 JDK1.7 apache-maven-3.10 eclipse 4.2 Juno mysql 5 源码下载及 ...
- 项目检出JRE问题(Unbound classpath container: 'JRE System Library [JavaSE-1.7]' in project 'idweb')
分类: java 技术2014-07-31 16:51 9864人阅读 评论(13) 收藏 举报 项目从SVN检出到工作空间后报了很多错误,其中很明显就是一些jar的问题,没有相关的jar或版本问题, ...
- hibernate添加spring 事务管理注意问题记录
今天弄了一天的hibernate添加事务的问题 首先,建立的是一个java工程,把hibernate添加进工程里,很容易就可以写一个增删改查的方法.索性就多加点东西,把接口,抽象类也加到里面,自己看着 ...
- [置顶] “河软CSDN2011级表彰暨实习动员大会”顺利召开!
9点30分 伴随着激昂的开场曲,主持人走到台前!“河软CSDN2011级表彰暨 实习动员大会即将开始,请各位嘉宾入场!”他们分别是“CSDN教育事业部总经 理李天山先生”“河北软件职业技术学院 软件工 ...
- Data Guard组件等相关介绍
1.Data Guard组件介绍 Data Guard架构归类为3个主要的组件. Data Guard 重做传输服务 重做传输服务用来将主数据库生成的重做数据传输给备用数据库. Data Guar ...
- react+redux渲染性能优化原理
大家都知道,react的一个痛点就是非父子关系的组件之间的通信,其官方文档对此也并不避讳: For communication between two components that don't ha ...