描述
开 本: 16开纸 张: 胶版纸包 装: 平装-胶订是否套装: 否国际标准书号ISBN: 9787121327223
入 门 篇
第1章 Bootstrap基础 2
1.1 概述 2
1.2 Bootstrap开发环境 3
1.2.1 Bootstrap的安装 3
1.2.2 Bootstrap的加载 5
1.3 Bootstrap 常用工具 6
1.3.1 Bootstrap代码编辑工具 6
1.3.2 Bootstrap设计工具——Layout IT 7
1.4 Bootstrap 布局 8
1.4.1 HTML标准模板 8
1.4.2 自定义CSS 10
1.4.3 响应式布局的实现 12
1.4.4 禁用响应式布局 16
1.5 小结 16
第2章 JavaScript基础 17
2.1 概述 17
2.2 JavaScript 语法 17
2.2.1 变量中的声明与赋值 18
2.2.2 如何判断两个字符串是否相等 19
2.2.3 创建JavaScript对象的三种方法 21
2.2.4 函数声明与函数表达式 23
2.2.5 可立即调用的函数表达式 25
2.2.6 循环的实现 27
2.2.7 防止JavaScript自动插入分号 28
2.2.8 严格模式 29
2.3 如何运行与调试JavaScript代码 30
2.3.1 把JavaScript代码内嵌到HTML页面中 30
2.3.2 通过Node.js运行JavaScript代码 31
2.4 JavaScript的面向对象设计思想 32
2.5 JavaScript的异步编程模式 33
2.5.1 Promise对象 34
2.5.2 生成Promise实例对象 34
2.5.3 Promise原型方法 35
2.5.4 Promise的catch方法 36
2.5.5 Promise在Node.js中的应用 37
2.6 如何在HTML中嵌入JavaScript 37
2.6.1 <script>标签 37
2.6.2 <script>标签的位置 38
2.6.3 嵌入JavaScript代码与外部文件引用 39
2.7 JavaScript与JSON 39
2.7.1 JSON概述 39
2.7.2 什么是JSON 40
2.7.3 JSON语法规则 40
2.8 小结 42
基 础 篇
第3章 Node.js入门指南 44
3.1 概述 44
3.2 Node.js生态 44
3.3 Node开发环境的搭建 45
3.4 Node.js验证 45
3.5 个Node.js工程 46
3.5.1 创建Node.js工程 46
3.5.2 运行Node.js工程 47
3.6 Node.js的module应用 50
3.7 Node.js 编码规范 52
3.8 小结 53
第4章 Express——后端框架 54
4.1 概述 54
4.2 个Express工程 54
4.2.1 Express工程的创建 54
4.2.2 Express的路由 55
4.2.3 Express的中间件 56
4.2.4 设置静态目录 57
4.3 Express中的Cookie与Session 58
4.3.1 Cookie是如何工作的 58
4.3.2 Session是什么 58
4.3.3 为什么需要Session 59
4.3.4 Session应用场景 59
4.4 Express中的网络请求方法 59
4.4.1 req.params 60
4.4.2 req.query 61
4.4.3 req.body 61
4.4.4 网络请求方法 61
4.5 Express中的GET与POST请求 62
4.5.1 GET请求 62
4.5.2 post请求 62
4.6 通过Express 实现登录页面 63
4.6.1 get请求验证 66
4.6.2 post请求验证 68
4.7 小结 69
第5章 Express的模板引擎 70
5.1 模板引擎概述 70
5.1.1 什么是模板引擎 70
5.1.2 模板引擎的选择 71
5.1.3 服务器端模板引擎 71
5.2 模板引擎的种类 72
5.2.1 模板引擎Jade 72
5.2.2 模板引擎Handlebars 73
5.2.3 模板引擎EJS 73
5.3 Express中的EJS 73
5.3.1 创建工程Express工程 74
5.3.2 引入工程的依赖包(dependency) 74
5.3.3 启动应用 76
5.3.4 EJS模板引擎的触发 77
5.4 小结 78
第6章 AngularJS——Google前端框架 79
6.1 AngularJS概述 79
6.2 AngularJS 常用指令 81
6.2.1 AngularJS 指令概述 81
6.2.2 AngualrJS指令:ng-app 81
6.2.3 AngularJS指令:ng-init 82
6.2.4 AngularJS表达式 82
6.2.5 AngularJS指令:ng-model 83
6.2.6 ng-app与ng-model示例 83
6.2.7 ng-app与ng-model常见错误分析 84
6.2.8 {{ }}的应用 85
6.2.9 指令:ng-bind 86
6.2.10 指令:ng-click 86
6.3 AngularJS构建单页面应用 86
6.3.1 单页面应用的优势 86
6.3.2 轻松构建单页面应用 88
6.3.3 单页面应用的实现 89
6.4 AngularJS的加载 93
6.4.1 AngularJS的引用 93
6.4.2 加载AngularJS静态资源库 94
6.5 AngularJS 的注入 94
6.5.1 依赖注入 94
6.5.2 依赖注入的行内声明 97
6.6 AngularJS 的Module 99
6.6.1 AngularJS Module 概述 99
6.6.2 AngularJS的Module 应用 100
6.7 AngularJS 控制器 102
6.7.1 控制器命名方法 102
6.7.2 AngularJS 控制器的创建 102
6.7.3 AngularJS控制器的应用 103
6.8 AngularJS的数据绑定 105
6.9 $scope用法 106
6.10 小结 109
第7章 MongoDB——文档数据库 110
7.1 MongoDB概述 110
7.1.1 MongoDB简介 110
7.1.2 MongoDB的历史 110
7.1.3 MongoDB的优势 111
7.1.4 MongoDB的安装 111
7.1.5 启动MongoDB 112
7.2 数据库存储机制 112
7.2.1 关系型数据库 112
7.2.2 NoSQL数据库 112
7.3 MongoDB数据结构 113
7.3.1 文档 113
7.3.2 集合 114
7.3.3 MongoDB存储格式——BSON 115
7.4 Mongo Shell 116
7.4.1 Mongo Shell简介 116
7.4.2 运行Mongo Shell 116
7.4.3 Mongo Shell基本操作 117
7.5 MongoDB文档操作 118
7.5.1 创建一个文档 118
7.5.2 查询所有文档 118
7.5.3 查询某一个文档 119
7.5.4 文档的更新 120
7.5.5 文档的删除 120
7.5.6 删除集合 121
7.6 _id和ObjectId 121
7.7 MongoDB管理工具 121
7.7.1 MongoDB可视化工具——Robomongo 121
7.7.2 Robomongo的安装 122
7.8 用mongoose操作MongoDB 125
7.8.1 mongoose概述 125
7.8.2 初识mongoose 125
7.8.3 mongoose的安装 126
7.8.4 mongoose连接数据库 126
7.8.5 Schema 127
7.8.6 Model及其操作 127
7.9 小结 132
实 战 篇
第8章 应用实例1——用户管理 134
8.1 概述 134
8.2 实现的思路 135
8.3 Node.js工程结构 135
8.3.1 创建一个Node服务 136
8.3.2 构建index.html页面 136
8.3.3 构建AngularJS页面 137
8.3.4 构建controller数据 138
8.3.5 构建路由 138
8.3.6 连接MongoDB 140
8.4 简单的用户管理操作 142
8.4.1 增加一条记录 142
8.4.2 删除一条记录 144
8.4.3 编辑与更新一条记录 146
8.4.4 $set与$unset的应用 149
8.5 小结 150
第9章 应用实例2——登录管理 151
9.1 概述 151
9.2 安装Express 151
9.3 创建Express工程 151
9.4 构建登录页面 157
9.4.1 构建登录的静态页面 157
9.4.2 构建路由 159
9.4.3 添加路由中间件 161
9.5 构建注册页面 161
9.5.1 静态页面的创建 161
9.5.2 构建注册页面的路由 163
9.5.3 添加路由中间件 166
9.6 小结 166
第10章 应用实例3——记事本 167
10.1 概述 167
10.2 实现思路 168
10.3 构建AngularJS应用 168
10.3.1 控制器 169
10.3.2 模块 171
10.3.3 模板 172
10.3.4 布局模板 172
10.3.5 路由 173
10.3.6 工厂方法 175
10.3.7 页面跳转 177
10.3.8 $routeProvider 180
10.3.9 过滤器 182
10.3.10 $index的应用 184
10.3.11 控制器之间的传值 185
10.3.12 $rootScope 185
10.3.13 使用$watch监控数据模型的变化 186
10.4 创建Express工程 189
10.5 创建MongoDB 190
10.5.1 连接MongoDB 190
10.5.2 创建mongoose的model 191
10.6 创建RESTful API 191
10.6.1 GET请求 191
10.6.2 POST请求 192
10.6.3 查找指定的对象 193
10.6.4 更新 194
10.6.5 删除 194
10.7 构建MEAN工程 194
10.7.1 路由 194
10.7.2 构建动态页面 196
10.7.3 $http的应用 196
10.7.4 基于$http的工厂方法 197
10.7.5 RESTful API的调用 198
10.7.6 基于$resource的工厂方法 199
10.7.7 创建一条记录 199
10.7.8 查看记录详情 201
10.7.9 更新记录 203
10.7.10 删除记录 206
10.7.11 运行结果 207
10.8 小结 208
第11章 应用实例4——商品管理 210
11.1 概述 210
11.2 实现思路 211
11.2.1 开发环境的搭建 211
11.2.2 创建Express工程 211
11.2.3 安装Monk 212
11.3 数据库管理 212
11.3.1 构建数据库模拟数据 213
11.3.2 通过Express创建访问数据库的API 213
11.4 重构页面 219
11.4.1 引入AngularJS 219
11.4.2 通过AngularJS重构首页 220
11.4.3 控制器的实现 222
11.4.4 when方法 225
11.4.5 $resource的调用 225
11.4.6 文档对象的创建 226
11.4.7 $location的应用 233
11.4.8 文档对象的编辑 234
11.4.9 $routeParams的应用 242
11.4.10 文档对象的删除 243
11.5 小结 245
参考文献 247
为何写一本全栈的书
为什么写一本以全栈为主题的书呢?这还得从我的工作经历说起。
在过去的十年,我一直从事与移动互联网相关的工作,从早期的手机软件开发到今天的移动应用,都离不开架构的支撑。在智能机出现之前,手机的软件架构群雄并起,各家手机厂商都在打造自己软件平台,直到iOS、Android、Windows Phone的出现,形成三足鼎立的时代。在经历了近五年的洗礼之后,进入移动互联网的时代。而今,iOS、Android两大平台平分天下。
开发一款移动互联网产品,从表面上来说,似乎只需要做一个APP,包括iOS和Android APP;其实,如果想让上线的产品运营起来,就没这么简单了。通常,一个活跃度很高的产品,都是一款具有生态系统支撑的平台,它包括。iOS APP、Android APP、微信公众号、PC网页、强大的后台管理,一个都不能少。如果采用传统的开发技术,打造这样的一款产品,需要组建一支十几人的开发团队,人员一多,沟通的成本可想而知。
移动互联网产品的一个特点是,一旦产品投放市场得到了用户的认可,其版本迭代更新非常之频繁。无形中,对团队的开发效率提出了更高的要求。
无论是iOS还是Android,APP原生开发模式的弊端是版本的迭代与升级的任务繁重。为了解决这个问题,才引入了HTML5的技术。从开发的技术工种来看,分为APP(iOS、Android)工程师、前端工程师、后端工程师。这三个角色中,前端工程师直接面向终端用户,是产品的门面起着一个桥梁的作用。如果后台选用PHP、Java之类的技术,前端工程师除了网页的制作之外,其他可做的非常有限,毕竟前端技术局限于HTML、CSS和JavaScript。因为角色的分工比较发散,以致开发效率难以提升。为了解决开发效率和运维灵活性的问题,我们希望从前端寻求到一个突破口。
众所周知,前端工程师身怀三大法宝:HTML、CSS和JavaScript。从编程语言讲,这些前端开发语言它既偏离APP的原生开发语言(Objective-C 或 Swift)语音,又与后台的开发语言(常用的Java)语音有着明显的差异。虽然JavaScript带有“Java”一词,但JavaScript与Java之间的关系如同雷锋与雷峰塔之间的关系,二者相去甚远。那么,有没有一种框架可以让前端开发人员“通吃”后台呢?
一个偶然机会,我接触到了全栈(Full Stack)的概念,并瞬间被它的理念所吸引。这里说的全栈,不是传统的LAMP(Linux、Apache、MySQL、PHP),而是一种全新的以前端为主导的框架,所谓“大前端”、“全端”,就是指的是以前端为核心的框架。终,我把框架选型聚焦在MEAN(MongoDB、Express、AngularJS、Node.js)上。MEAN全栈技术框架所用到的每个组件(MongoDB、Express、AngularJS和Node.js),都是基于JavaScript开发语言的。原本JavaScript是为网页设计的语言,但自从有了Node.js之后,JavaScript的春天来了,前端工程师也可以写后台了。Node.js让前端开发像子弹一样飞!
开发一个产品之前,我们总会纠结应该选择怎样的技术框架。的确,框架的选型很重要,它直接决定了这个产品未来的走向,技术的选择需要考虑几个主要因素,其中包括自身所掌握的技能、软/硬件环境、生产环境的部署、产品上线后的运维等。
选用MEAN全栈技术,可以快速地实现敏捷开发,尤其是到了产品的运营阶段,其优势表现得非常明显。我们知道,今天的任何一款移动互联网产品,离不开微信公众号的推广,大多出彩的产品,在它的微信公众号内,所展示的是一套完整的业务逻辑,而不是几个简单的页面。这就是说,一个运营成功的产品,对前端技术的依赖非常之高,更何况APP也可以采用混合开发模式(Native HTML5)。
全栈工程师并不是“全能”工程师,它是通过一种全栈的框架,从繁重的技术中解脱了出来。正所谓:工欲善其事,必先利其器。这里的“器”,就是全栈框架,具体到这本书所推荐的,就是MEAN全栈框架。
尽管前端技术琳琅满目,但全栈框架少之又少,本书以MEAN为主线,
践行全栈之路
用了MEAN全栈,它到底能带来什么好处呢?这里,以我们发布的一款产品——“点时”为例。“点时”APP是一款轻量级的知识分享平台,以语音分享为主。这样的一款产品,从生态上讲,该平台包括:iOS APP、Android APP、微信、后台的课程发布与运维管理。传统的做法是项目开发组分为前端与后台两套人马,因为进度不一,要么前端等后端,要么后端等前端,而我们采用的是MEAN全栈架构,不再区分前端与后台,开发效率明显提升。用了MEAN全栈框架,它带来的好处是减少了前、后端之间的依赖。
读者对象
这是一本讲述MEAN全栈入门的书,而但不是一本从入门到精通的书。MEAN全栈蕴含的组件知识点有多个,每一个组件知识点都可以独立成书。书中的每一个知识点都是为后面章节中的实例铺垫的,泛泛的基础知识不在本书讲解范围之内。
本书自始至终延续这样的一个主题:如何通过一种框架(MEAN全栈),将前端和后台(端)贯穿起来,让前端工程师快速上手。
MEAN全栈技术涉及的技术点很多,它是前端(Front-end)技术向后台(Back-end)的延伸。只有具备了前端的基础,才能更好地理解全栈架构的思想。如果尚未接触过HTML、CSS、JavaScript,那么,有必要“恶补”一些前端的基础知识。
具体来说,这本书适宜的读者有:
想学前端技术的APP(iOS、Android)开发工程师。随着APP多年的发展,APP的优势和短板日益明显,原生技术无法解决的问题,需要前端技术(HTML5)来弥补,二者结合相得益彰,所以混合开发模式越来越受欢迎。如果一个APP开发工程师同时具备了原生与全端的技能,由“单翼”变成了“双翼”,其技术路线的前景将越来越广!
想学习后台技术的前端工程师。传统的互联网开发,分为前端和后台,在职场上也就出现了前端工程师和后端工程师。借助Node.js平台和Express后端框架,前端工程师可以无缝地延伸到后台技术。
如何阅读本书
既然是全栈技术,其蕴含的知识点无疑有多个方面。为此,本书身分为入门篇、基础篇、实战篇。
入门篇:
这里没有讲述HTML的基础,也没有谈论CSS概念,而是直接切入CSS框架,一款主流的CSS框架——Bootstrap。在我所经历的互联网项目中,Bootstrap是应用为广泛的。这里还讲述了JavaScript特有的编程模式——函数表达式与函数式编程,在Node.js开发中,JavaScript把这些特有的闪光点发挥得淋漓尽致。“MEAN”全栈中所用到的数据交互格式和存储格式均为JSON,学习全栈技术,必须掌握JSON的应用。MEAN全栈中所用到的数据格交互和存储格式——JSON,因为其重要性而占用了独立的一章。
在入门篇中,没有讲述jQuery技术及其AJAX,这是因为,在MEAN全栈框架中用到的AngularJS前端框架本身就兼具jQuery和AJAX的功能。
基础篇:
从这篇开始,我们将正式进入Node.js的世界。尽管Node.js功能很强大,但其生态系统的构建还要借助于Express、AngularJS、MongoDB以及模板引擎。
在市面上,我们会看到很多权威指南系列的书,比如Node.js权威指南、AngularJS权威指南、MongoDB权威指南。这些书对每一个专业技能都讲得很透,但很少谈及它们之间的关系。既然Node.js可以独立存在,而Express是基于Node.js之上的后端框架,对初学者来说,我们更希望在Express基础之上开发。
那么,我们为何选用AngularJS呢?在吹响“全端”号角的今天,我们越来越强调前端框架的重要性。在前端的世界,AngularJS可谓玉树临风。在MEAN全栈中,Node.js和Express负责后端处理,而与网页交互的正是AngularJS。因此,可以想象AngularJS在本书中所占比重之高。
关于AngularJS,这里要特别说明一点:本书讲述的AngularJS、示例中所引用的AngularJS均为1.x版本,具体来说是1.4.6版本。AngularJS版本是2.x。或许读者产生疑问,为何不用AngularJS的2.x版本呢?这是因为,它的2.x并不是在原有1.x上的升级,而是一个全新的版本。二者谈不上兼容之说。业内普遍认为,AngularJS 1.x版本更成熟、应用更广泛、可参考的资料更多。在项目开发时,选择一个成熟的框架,十分重要!
把MongoDB数据库应用到MEAN全栈中,可谓相得益彰。通过MongoDB,你会对全栈开发有一个完整的、全新的认知。
实战篇:
学习一门编程技术,有效的途径还是实践。对于书中出现的每个知识点,都辅以相关的代码实例。每个篇章中的实例都不是独立的,而是沿用延从易到难的线索。
实战篇演示了四个实例,每个实例并不是独立的,从知识衔接上看,是一环扣一环的。通常,一个完整的应用包括:数据与页面之间的绑定、网络请求、路由的分发、数据库的增删改查。我曾试着通过一个完整的应用讲述以上知识点,发现越到工程的后期越发臃肿,前后逻辑关系太复杂,以至于理解起来破费周折。终采取一个折中的方案:借用国外网站的经典MEAN全栈的示例,在原示例的基础之上,对一些不易理解的地方,添加了补充的知识,正所谓“见招拆招”。
实战篇中示例,都是基于MEAN全栈的演练,只是侧重点有所不同,每个示例均附有完整的工程源码。
本书的源码
在学习本书示例代码时,可以按照书中讲解的步骤,一步一步地手工敲入所有代码,也可以下载随书所带的源码,本书所有的源代码都可以从GitHub下载。
源码下载地址:为https:/
评论
还没有评论。