本书以JavaScript语言为基础，以一个完整的网站开发过程为主线，介绍了一整套面向Web项目的开发技术，如使用Node.js搭建服务端，使用NoSQL数据库管理数据，使用Vue.js搭建前端UI，使用Nginx部署代码，使用Git管理版本等。通过阅读本书，读者可以掌握从网站开发到网站上线的全过程。本书分为10章，涵盖的主要内容有购买域名、网站备案、Node.js安装、Express安装、Vue.js安装、前后端分离设计、网站需求设计、网站模块规划、网站服务器端开发、网站客户端UI开发、服务器端部署和网站上线等内容。本书通俗易懂，图文并茂，适合所有初级和中级Web开发人员阅读，尤其适合一些想自学网站开发的非专业人员阅读。另外，对于相关院校的学生和培训机构的学员而言，本书也是一本不可多得的实战指导书。
构建一个完整Web项目，详解前后端分离架构技术，展现全栈开发全流程，涵盖服务器购买、NoSQL数据库设计、Vue.js前端开发、Node后端开发、Nginx代码部署及Git版本管理等
编辑推荐：
通过构建一个完整的Web工程项目，展现Web前后端开发的全流程
涵盖服务器购买、数据库设计、前端开发、后端开发和部署上线等内容
内容全面：涵盖Node.js后端开发、NoSQL数据库管理、Vue.js前端开发、Nginx代码部署及Git版本管理等Web全栈开发的大部分核心技术。
技术新颖：紧跟技术发展趋势，详解Web开发领域非常流行的前后端分离架构技术。
实用性强：通过一个综合项目案例展开讲解，并穿插大量的示例帮助读者提高编码能力。
风格独特：按照项目开发的流程推进，展现实际工程项目开发的思想和注意事项。
随着宽带速度的提升，原本内容单一的网站可以增加更多的图片、动画和视频，而无须顾虑加载速度，因此与网站相关的应用（也称为Web应用）近几年发展飞快。除了传统的网站页面、HTML应用和HTML游戏外，还有类似于“小程序”“快应用”这样基于网络开发的移动端应用也在蓬勃发展。虽然这些应用大多数不能通过浏览器直接启动和打开，但其本身依然是传统的Web应用，只是通过一些技术手段优化了性能，如增加了缓存和系统API接口等。可以说，开发Web应用的能力依然是每个互联网开发人员必须具备的。
Web应用开发包括前端开发和后端开发。目前，通过一个项目把Web前后端开发技术贯穿起来的图书还不多。本书从这个角度切入，通过构建一个完整的Web工程项目，展示Web前后端开发的整个流程，其中，前后端分别采用Vue.js和Node.js技术来实现。本书的写作遵循网站开发的流程，从购买一个域名开始，逐步向读者展现网站开发的整个过程。与已经出版的同类图书不同的是，本书不精研每一个技术细节，而是从宏观项目入手，让读者掌握一个完整项目的开发过程。通过阅读本书，读者可以快速了解一个网站产品的全部技术栈，继而能搭建一个类似的网站。
本书特色
1．详解网站从开始搭建到部署上线的全流程
一个网站从开始搭建到最后上线要经过购买网站服务器、数据库设计、前端开发、后端开发和部署上线等多个步骤。本书通过一个项目案例把这些步骤完整地展现出来，让读者可以从零开始，一步一步地亲自动手演练每个步骤。
2．提供大量完整的小示例帮助读者练习编码
动手是学习编程必不可少的方式，也是非常有效的方式，多写代码能有效地提高编程能力。本书除了大型项目外，还穿插了大量的小示例帮助读者提高编码能力，这些示例大多在一页以内，而且给出了运行结果，读者可以先自己编写代码并测试运行，再与提供的示例代码进行比较，从而发现自己的不足并加以改进。
3．注重项目设计思路和工程开发思想
本书从项目需求分析到功能说明，从数据库的选择到前后端技术栈的考量，从编码测试到项目部署与上线，全都按照实际项目开发的流程进行推进，而且还展现了实际工程项目开发的思想和需要注意的事项，从而帮助读者建立完整的项目开发思维。
4．广阔的技术视角，开阔的开发思路
本书从项目设计到路由设计，从网站整体风格定位到单一界面开发，从Vue.js前端开发到Node.js后端开发，从Nginx到Git，都有涉及。这些技术有的从设计角度出发，有的从UI角度出发，有的从开发和测试角度出发，有的从部署角度出发，给读者以广阔的技术视角和开阔的开发思路，最终提升项目开发水平。
本书内容
第1章简要介绍云服务器、网站域名、网站认证和网站备案等知识，并介绍如何将来自互联网的访问转发到服务器中（这是域名解析的魅力所在）。
第2章简要介绍Node.js、Express和Vue.js等Web项目开发的基础知识。学习完本章内容后，读者就能跨入全栈开发的大门，并能熟练地使用JavaScript编写代码。
第3章主要介绍数据库和工程化开发的一些常用工具，这些工具可以让项目开发事半功倍。其中，数据库技术包括MongoDB和Redis等，工程化开发工具包括Git和Postman等。
第4章详细介绍网站开发的后端关键技术Express，涵盖Express路由管理、Express与数据库的连接，以及Express中间件等关键技术。
第5章详细介绍网站前端开发工具Vue.js的基础知识。网站前端相当于网站的门面，本章介绍如何使用Vue.js打造前端组件，并构建美观的前端页面。
第6章深入介绍Vue.js的高级开发技术，包括Vue.js中至关重要的路由、状态管理和UI库等相关概念。本章基于第5章所讲内容，阅读顺序不能颠倒。
第7章重点对Web项目做需求分析和功能说明，包括项目的设计、功能策划和模块划分等。对于开发人员而言，这是网站项目开发的第一步，要先分析需求，然后才能进入开发阶段。
第8章重点介绍Web项目的后端开发过程。本章使用Express框架开发一个完整的项目后端，并且提供Vue.js中用来获取数据的API。
第9章重点介绍如何编写Web项目的前端页面，这样就能完整地展现整个Web项目的开发流程。
第10章介绍网站部署和上线的相关知识，涵盖在不同场景中的打包方法、防火墙设置和网站优化等相关内容。
读者对象
* Vue.js与Node.js技术爱好者；
* JavaScript程序员；
* Web开发人员；
* Web项目负责人和产品经理；
* 对网站开发感兴趣的人员；
* 互联网产品开发者；
* 高校相关专业的学生；
* 相关培训学校的学员。
配套资源获取
本书涉及的源代码文件等相关资源需要读者自行下载。请在机工新阅读网站（www.cmpreading.com）上搜索到本书，然后单击“资料下载”按钮，即可在本书页面上找到下载链接。另外，读者也可以关注作者的微信公众号“科技集散地（tech-jsd）”进行获取。
致谢
感谢参与本书出版的所有编辑！也感谢在本书写作过程中给予我帮助的人！更要感谢我的家人，正是有了他们的支持，我才得以坚持下去！最后还要感谢本书的各位读者，本书因你们而有价值。
计算机\Web开发
本书赞誉
本书是一本全栈开发初学者的入门佳作，非常适合互联网行业的开发人员从零开始了解网站应用从开发到上线的整个流程。由于前后端技术比较庞杂，使得很多入门人员不知该从何学起，本书对这些技术进行了梳理，并对网站项目开发流程也做了梳理，给初学者提供了合理的学习路径，非常值得阅读。
——尼奥巴兰网络科技有限公司CEO 苏振鹏
紧跟Web发展趋势，选择更好、更适合的技术无疑是每一个Web开发者都要面临的问题。目前，国内图书市场上还鲜见专门介绍Vue.js+Node.js开发网站项目的图书。张帆一直从事Web前后端开发和研究，他将自己多年的开发感悟和经验分享了出来，相信可以帮助读者快速上手，并系统学习Web全栈开发涉及的核心技术。
——巨人网络产品经理 张懋
对于具有基本的Web技术储备但缺乏实际项目经验的初学者而言，本书无疑是一本非常好的Web项目开发入门读物。本书从实际项目入手，不但介绍了网站开发的前期准备工作，而且重点介绍了Vue.js前端开及Node.js后端开发涉及的相关技术，可以让读者通过一本书便可系统了解从网站开发到上线的全部流程。
——小牛互娱高级工程师 卢文荣
配套资源获取方式
本书涉及的源代码文件等配套资源需要读者下载。请在机工新阅读网站（www.cmpreading.com）上搜索到本书，然后单击“资料下载”按钮，便可在本书页面上找到下载链接。
前言
第1章 开发一个网站的准备 1
1.1 如何从零开始建设一个网站 1
1.1.1 网站建设流程 1
1.1.2 网站开发技术和工具 2
1.2 第一步：购买一个域名 3
1.2.1 域名简介 4
1.2.2 如何通过阿里云购买域名 5
1.3 第二步：域名的备案和解析 8
1.3.1 域名的实名认证和备案 8
1.3.2 域名相关解析 9
1.4 第三步：购买一台服务器 10
1.4.1 云服务器 10
1.4.2 服务器的后台管理 11
1.5 小结与练习 13
1.5.1 小结 13
1.5.2 练习 13
第2章 Node.js+Vue.js项目开发基础 14
2.1 Node.js简介 14
2.1.1 Node.js的前世今生 14
2.1.2 在Windows中安装Node.js 15
2.1.3 在Linux中安装Node.js 18
2.1.4 第一个Node.js示例——Hello World 20
2.2 Node.js后端框架Express 21
2.2.1 Express的发展 21
2.2.2 Express的安装 23
2.2.3 Express项目示例——Hello World 25
2.2.4 RESTful API规范 25
2.3 页面显示框架Vue.js 27
2.3.1 Vue.js简介 27
2.3.2 Vue.js的安装 28
2.3.3 用Vue.js编写Hello World——CDN方式 29
2.3.4 用Vue.js编写Hello World——Webpack方式 30
2.3.5 其他页面显示框架 34
2.4 JavaScript代码编写——IDE的选择 35
2.4.1 编写基础的JavaScript代码 35
2.4.2 JavaScript开发利器——WebStorm 37
2.5 小结与练习 38
2.5.1 小结 38
2.5.2 练习 38
第3章 项目开发准备 39
3.1 初识数据库 39
3.1.1 数据库简介 39
3.1.2 SQL数据库和NoSQL数据库 40
3.2 MongoDB介绍 41
3.2.1 为什么选择MongoDB 42
3.2.2 在Windows中安装MongoDB 43
3.2.3 在Linux中安装MongoDB 44
3.3 Redis简介 46
3.3.1 为什么选择Redis 46
3.3.2 在Windows中安装Redis 47
3.3.3 在Linux中安装Redis 49
3.4 版本控制 51
3.4.1 版本控制简介 51
3.4.2 Git和GitHub简介 51
3.4.3 安装和使用Git 54
3.5 测试工具 57
3.5.1 浏览器自带的开发者工具 57
3.5.2 Postman插件 59
3.6 小结与练习 61
3.6.1 小结 61
3.6.2 练习 62
第4章 项目后台技术Express 63
4.1 开发Express应用程序 63
4.1.1 Express应用程序生成器 63
4.1.2 Express提供的路由 66
4.1.3 使用Express托管静态文件 68
4.2 Express和数据库交互 70
4.2.1 连接MongoDB数据库 70
4.2.2 使用对象模型驱动连接MongoDB 72
4.2.3 如何定义模型 73
4.2.4 Node.js和Redis集成 74
4.3 Express高级应用 75
4.3.1 Express中的中间件 75
4.3.2 Express错误处理 79
4.4 小结与练习 81
4.4.1 小结 81
4.4.2 练习 81
第5章 项目前端开发之Vue.js基础知识 82
5.1 Vue.js开发基础 82
5.1.1 安装Vue.js与Webpack 82
5.1.2 Webpack常用配置详解 85
5.1.3 Vue.js条件渲染 89
5.1.4 Vue.js列表渲染 90
5.1.5 Vue.js输入监听 91
5.1.6 Vue.js事件处理——v-on绑定 94
5.2 Vue.js的生命周期 97
5.2.1 生命周期与钩子函数 97
5.2.2 演示Vue.js的生命周期 99
5.3 Vue.js的模板语法 100
5.3.1 文本 101
5.3.2 JavaScript表达式 103
5.3.3 v-bind绑定动态属性 104
5.4 Vue.js的组件化 105
5.4.1 组件化简介 105
5.4.2 组件的创建 106
5.4.3 组件的注册 106
5.4.4 组件间的数据传递 109
5.4.5 监听子组件事件 111
5.4.6 通过插槽分发内容 114
5.5 小结与练习 116
5.5.1 小结 116
5.5.2 练习 116
第6章 Vue.js高级应用 117
6.1 Vue.js的vue-router库 117
6.1.1 Vue.js的页面路由实现 117
6.1.2 使用vue-cli初始化Vue.js项目 118
6.1.3 安装和配置vue-router 122
6.1.4 动态路由匹配 123
6.1.5 路由嵌套 126
6.1.6 路由跳转 128
6.1.7 导航守卫 131
6.2 Vue.js的状态管理库Vuex 132
6.2.1 状态管理与store模式 133
6.2.2 使用Vuex的情形 133
6.2.3 在Vue.js组件中获取Vuex状态和Getter对象 135
6.2.4 更新Vuex中的store 138
6.2.5 Vuex模块的划分 142
6.3 Vue UI库 143
6.3.1 Element UI库 143
6.3.2 Ant Design of Vue UI库 144
6.3.3 iView UI库 145
6.4 小结与练习 146
6.4.1 小结 146
6.4.2 练习 146
第7章 项目需求分析和功能说明 147
7.1 内容发布网站的需求分析 147
7.1.1 系统设计需求和技术说明 147
7.1.2 后端接口需求 148
7.1.3 前端页面需求 149
7.2 项目策划和功能设计 150
7.2.1 项目功能策划 150
7.2.2 项目模块划分 150
7.2.3 项目后端API路由定义 151
7.2.4 项目前端页面路由定义 152
7.3 项目原型图和流程图 153
7.4 小结与练习 154
7.4.1 小结 154
7.4.2 练习 154
第8章 项目后端API开发 155
8.1 开发前的准备工作 155
8.1.1 初始化项目 155
8.1.2 连接数据库 156
8.1.3 配置服务应用列表 161
8.2 通用API开发 164
8.2.1 获取页面导航栏的API开发 164
8.2.2 获取底部详细内容的API开发 167
8.2.3 获取友情链接的API开发 168
8.2.4 获取首页轮播图的API开发 169
8.2.5 获取热点文章列表内容的API开发 171
8.2.6 获取文章列表的API开发 173
8.2.7 获取文章详情的API开发 175
8.2.8 获取文章评论的API开发 177
8.2.9 获取分类内容的API开发 178
8.2.10 记录文章浏览量的API开发 180
8.3 用户权限相关API开发 182
8.3.1 用户模块开发前的准备工作 182
8.3.2 用户评论文章的API开发 183
8.3.3 获取用户资料的API开发 185
8.3.4 修改用户资料的API开发 187
8.3.5 发送私信的API开发 189
8.3.6 获取私信列表的API开发 191
8.3.7 获取私信的API开发 192
8.3.8 用户注册的API开发 194
8.3.9 用户登录的API开发 196
8.3.10 文章分类列表的API开发 199
8.3.11 文章“点赞”和“踩”功能的API开发 201
8.3.12 文章收藏功能的API开发 202
8.3.13 获取收藏文章列表的API开发 203
8.4 后台管理相关API开发 204
8.4.1 文章添加和修改的API开发 205
8.4.2 文章发布和删除的API开发 208
8.4.3 添加和修改分类的API开发 210
8.4.4 获取全部用户列表的API开发 211
8.4.5 封停用户的API开发 213
8.4.6 修改首页轮播内容的API开发 214
8.4.7 修改导航内容的API开发 216
8.4.8 修改底部内容的API开发 217
8.4.9 修改友情链接内容的API开发 218
8.4.10 其他权限判断 220
8.5 小结与练习 221
8.5.1 小结 221
8.5.2 练习 222
第9章 前端页面开发 223
9.1 项目前期准备 223
9.1.1 创建新项目 223
9.1.2 选择UI库 224
9.1.3 安装HTTP请求库 225
9.2 主要页面的开发 228
9.2.1 主页 228
9.2.2 文章总列表页 235
9.2.3 文章分类结果页 237
9.2.4 文章详情页 239
9.3 用户相关页面及权限的开发 244
9.3.1 登录页 244
9.3.2 注册页 247
9.3.3 用户信息页 251
9.3.4 在导航栏中增加用户信息 256
9.3.5 私信功能 258
9.3.6 文章评论功能 262
9.3.7 文章的收藏和点赞功能 265
9.3.8 查看所有收藏 267
9.4 管理员页面的开发 269
9.4.1 管理员页面路由设置 269
9.4.2 文章编辑页 271
9.4.3 文章管理页 275
9.4.4 用户管理页 278
9.5 小结与练习 280
9.5.1 小结 280
9.5.2 练习 280
第10章 网站的部署和上线 281
10.1 远程连接服务器 281
10.1.1 虚拟机简介 281
10.1.2 虚拟机的安装 282
10.1.3 远程连接云服务器或虚拟机 288
10.2 搭建服务器部署环境 290
10.2.1 配置pm2 290
10.2.2 构建用于发布的Vue.js程序 293
10.2.3 使用Nginx部署静态文件 294
10.3 在服务器端部署代码 295
10.3.1 服务器的防火墙设置 295
10.3.2 使用Git部署代码 296
10.4 网站优化常用方法 299
10.4.1 优化应用 299
10.4.2 使用nw.js打包项目 300
10.5 小结与练习 302
10.5.1 小结 302
10.5.2 练习 303
附录A 检测Node.js是否支持ES 6的语法 304
附录B npm安装过慢的解决方法 306
