1.关于什么是AngularJs以及什么是bootstrap我就不多说了,简单说下,AngularJs是一个比较强大前台MVC框架,bootstrap是Twitter推出的一个用于前端开发的开源工具包,可以迅速搭建web前台,可以去官网看看(AngularJs:http://angularjs.org/ ,bootstrap:http://twitter.github.io/bootstrap/)。

2.github上有一个比较好的纯净AngularJs app的种子,可以去github下载,地址:https://github.com/glitchtank/angular-seed-master

3.我们把下载的angular-seed-master-master.zip解压到某个文件夹,然后会看到这个app的项目组织,如下:

app:这个文件夹中包含了跟我们app相关的依赖css和js以及我们的页面等。

css:放的是项目的css文件

img:放的是images

js:放的是我们项目相关的js,包括controller、filter、service等

lib:放的是我们依赖的js,包括Angular和Bootstrap相关的库

别的就是一些html文件

其他文件夹暂时不需要知道,大概就是一些脚本(关于node的),还有一些用于Angular测试的

4.我们项目需要用node来启动,如果不太清楚,没关系,看我另一篇博客:http://blog.csdn.net/jthink_/article/details/9707895(linuix和windows下的差不多,实在不会就google吧)。

5.由于我们是在windows下,所以我们打开一个cmd,进入到angular-seed-master-master文件夹,然后键入命令node scripts/web-server.js(或者用supervisor scripts/web-server.js 如果安装了supervisor)。

6.打开chrome浏览器(这边推荐使用chrome,或者使用firefox,64位的操作系统可以使用waterfox),输入地址:http://localhost:8000/app/index.html,你就可以看到一个简单的页面出来了,别看它简单,麻雀虽小五脏俱全,所有的MVC相关的都包括了。

AngularJs+bootstrap搭载前台框架——准备工作的更多相关文章

  1. Play1+angularjs+bootstrap ++ (idea + livereload)

    我的web开发最强组合:Play1+angularjs+bootstrap ++ (idea + livereload) 时间 2012-12-26 20:57:26  Freewind.me原文   ...

  2. AngularJS Bootstrap

    AngularJS 的首选样式表是 Bootstrap. 可以在 AngularJS 应用中加入 Twitter Bootstrap,你可以在你的 <head>元素中添加如下代码: < ...

  3. 5个最好用AngularJS构建应用程序框架

    如果你打算建立自己的Web应用与AngularJS,那么现在是时候开始了.如果这个想法吓到你了,删除所有的恐慌,从你的头脑中有一些框架,AngularJS提供方便的支持.有一些预先的框架,使用框架可以 ...

  4. AngularJS - 下一个大框架

    AngularJS AngularJS是web应用的下一个巨头. AngularJS如果为创建web应用而设计,那它就是HTML的套路了.具有数据绑定, MVW, MVVM, MVC, 依赖注入的声明 ...

  5. 【17】AngularJS Bootstrap

    AngularJS Bootstrap AngularJS 的首选样式表是 Twitter Bootstrap, Twitter Bootstrap 是目前最受欢迎的前端框架. Bootstrap 你 ...

  6. LigerUI一个前台框架增、删、改asp.net代码的实现

    先上代码:前台代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  7. 8个强大的基于Bootstrap的CSS框架

    做过前端开发的小伙伴们应该对Bootstrap不会陌生,它是由Twitter推出的开源CSS框架,其中包含了很多Web前端开发的工具包和应用组件.当然,和jQuery一样,Bootstrap同时也是一 ...

  8. 前台框架的选择 EasyUI、DWZ、ligerui

    EasyUI1.3.1+MVC4.0+EF5.0 番外篇 关于前台框架的选择 EasyUI.DWZ.ligerui 昨天发了EasyUI1.3.1+MVC4.0+EF5.0实战之一 开篇及布局控件介绍 ...

  9. LigerUI一个前台框架增、删、改asp.net代码

    LigerUI一个前台框架增.删.改asp.net代码的实现   先上代码:前台代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tran ...

随机推荐

  1. 如何让Asp.net Web Api全局预防Xss攻击

    一.概述 二.什么是XSS 三.预防方法 四.在WebApi中如何实现 在实现之前,需要了解ASP.NET WEB API的pipeline机制. 如上,可以采用多种方式进行参数的过滤 1.重写Del ...

  2. 【BZOJ】【4003】【JLOI2015】城池攻占

    可并堆 QAQ改了一下午……最终弃疗求助zyf……居然被秒了QAQ真是弱到不行(zyf太神了Orz) 还是先考虑部分分的做法: 1.$n,m\leq 3000$:可以暴力模拟每个骑士的攻打过程,也可以 ...

  3. Matlab绘制透明平面(二元函数)

    一.需求来源 对空间结构聚类,恰好是圆台,找到了上下底面的方程,所以画图. 二.需求解决 2.1 绘制平面 x = linspace(0,5,100); y = linspace(0,4,100); ...

  4. Java compiler level does not match the version of the instal

    一.问题描述 新建了一个项目,workspace默认jdk编译版本是1.7的,新建项目使用的是jdk1.5的版本,肯定会报@override错误.这个时候,修改项目的compilor即可. 这时候,你 ...

  5. 用dedecms自定义表单创建简易自助预约系统

    建站往往需要根据客户的需求来增加相应的功能,比如预约.平时用比较多的是织梦系统,那么如何用dedecms自定义表单创建简易自助预约系统呢? 进入dedecms后台,左侧菜单中依次点击“核心” - 频道 ...

  6. Sqli-labs less 32

    Less-32 利用上述的原理,我们可以进行尝试payload为: http://127.0.0.1/sqli-labs/Less-32/?id=-1%df%27union%20select%201, ...

  7. 翻译 - NodeJS错误处理最佳实践

    王龑 - APRIL 13, 2015 NodeJS的错误处理让人痛苦,在很长的一段时间里,大量的错误被放任不管.但是要想建立一个健壮的Node.js程序就必须正确的处理这些错误,而且这并不难学.如果 ...

  8. 【译】 沙箱中的间谍 - 可行的 JavaScript 高速缓存区攻击

    王龑 - MAY 27, 2015 原文连接 The Spy in the Sandbox – Practical Cache Attacks in Javascript 相关论文可在 https:/ ...

  9. HDU4512完美队形I && HDU1423 Greatest Common Increasing Subsequence (LCIS)

    填坑的时候又到啦,校赛因为不会LCIS所以吃了大亏,这里要补起来.LCIS就是在两个串里找最长上升子序列,相关的博客有很多,这里自己就不写那么多了. http://www.cnblogs.com/ja ...

  10. ZOJ3718 Diablo II(状态压缩dp)

    题意:一个人物有K(K<=7)种技能,每种技能都有bi,ci,di值,表示该技能不能点超过bi次,每点一次加ci,点满bi次有一个附加得分di.然后还有N件武器,武器本身会有能力加成,然后每个武 ...