AngularJS开发实战（1）

从接触angularjs到现在已经有1年多的时间期间已经用这个框架开发了大大小小的好几个项目，参考了其他一些项目的结构模版和自己摸索尝试，从一开始项目结构错乱复杂到现在我自认为是比较良好的结构划分，现在整理成一个系列留作团队培训内容和分享，如果有更好的方案欢迎一起研究讨论。
我们以一个简单的新闻管理系统作为引子从无到有的创建一个基于angularjs框架的系统，第一篇我们先从创建一个angularjs的框架开始。系列中包含gulp、bower、sass极angular中的指令、服务、过滤器、拦截器的使用，我们使用sublime text3 作为开发编辑器。
这个系列的github地址：https://github.com/chenfengjw163/angular-news.git

在github上创建angular-news项目后在本地clone：

git clone https://github.com/chenfengjw163/angular-news.git

用sublime 打开：

好了，我们开始吧！

---

gulp、bower和sass安装

如果使用过gulp和bower的同学可以跳过下面的文字到下一步。
gulp、bower和sass不知道什么东西的同学自行google。
下面我们来简单介绍下如何安装：
安装nodejs：https://nodejs.org/en/download/
sass则需要安装ruby环境：http://www.w3cplus.com/sassguide/install.html
安装好之后命令行执行：

npm -v

ruby -v

显示版本号就表示安装成功了，接下来执行：

npm install -g bower 

npm install -g gulp 

安装bower和gulp。

---

因为这个项目我们会用到gulp构建工具和bower管理所以我们先初始化gulp和bower的配置在项目目录下打开命令行，执行:

gulp init

和

bower init

根据提示填写信息完成之后两个工具的配置文件就创建完毕了。
接下来我们安装一些npm工具：

npm install --save gulp-concat gulp-connect gulp-sass

gulp-concat用于合并文件、gulp-connect用于创建一个web调试环境、gulp-sass用于编译sass文件。
和一些bower依赖包：

bower install --save angular angular-resource angular-ui-router bootstarp jquery

ps：如果安装慢或者直接不能安装的情况&