├── README.md ├── images ├── api-architecture-two.png ├── auto-deploy.jpg ├── babie.jpg ├── best-rby-editor.png ├── build-web-project.png ├── cd.png ├── cdelivery.jpg ├── ci.jpg ├── coding.jpg ├── conway-law.jpg ├── deploy.jpg ├── elk.png ├── fullstack.jpg ├── helloworld.jpg ├── input-output.png ├── kanban.jpg ├── lean-loop.jpg ├── make-it-bette.png ├── new-relic.png ├── os-compare.jpg ├── refactor.png ├── retro.jpg ├── rework.png ├── seo.jpg ├── smart.jpg ├── smart.png ├── tasking.png ├── test-primard.png ├── ui.jpg └── waterfall.jpg ├── live-detail.md └── live.md /README.md: -------------------------------------------------------------------------------- 1 | 30分钟了解《全栈应用开发：精益实践》 2 | === 3 | 4 | 在《Growth：全栈Web开发思想》出版以前，请参考开源电子书《[Growth：全栈增长工程师实战](https://github.com/phodal/growth-in-action)》与《[Growth: 全栈增长工程师指南](https://github.com/phodal/growth-ebook)》。 5 | 6 | 引言：精益与全栈 7 | --- 8 | 9 | 在埃里克·莱斯的《精益创业》中提到了下面的精益环路： 10 | 11 | ![Lean创业](images/lean-loop.jpg) 12 | 13 | 而精益的思想是**在生产过程中减少的浪费**，在软件开发的过程中最容易造成浪费的就是： 14 | 15 | 1. 业务人员对于市场的理解不一致，导致做不出用户所需要的产品。这部分可以通过精益环路来提高。 16 | 2. 开发人员对于需求的了解不清晰，导致结果与业务人员所需要的不一致。这部分则可以通过改善流程来解决。 17 | 3. 开发人员与第三方开发商的沟通问题。呵呵。 18 | 4. 团队内部的沟通与集成问题 19 | 20 | 当我们讨论全栈的时候，我们就是想解决沟通带来的时间浪费问题。沟通不畅最好的例子就是**巴别塔**： 21 | 22 | ![巴别塔](images/babie.jpg) 23 | 24 | 而前后端分离带来的第一个痛点就是：集成。如果你和我们一样采用敏捷开发流程的话，你就可以很容易看到这个问题了： 25 | 26 | ![看板](images/kanban.jpg) 27 | 28 | 当你已经完成前端功能的时候，后端还没完成。你可能就需要开发额外的业务卡，最后等后端完成时再回来集成。尽管我们会在实践上使用基于契约的开发模式： 29 | 30 | ![契约API](images/api-architecture-two.png) 31 | 32 | 但是一旦我们发现最初的契约不符合我们要求的时候，我们就需要重新修改前后端。这时对接这个 API 的人，就需要放下手头的工作来更新这个 API。 33 | 34 | 尽管你们已经采用了迭代式开发，但是前后端分离在一夜又将软件开发放到了解放前的瀑布流： 35 | 36 | ![瀑布流](images/waterfall.jpg) 37 | 38 | 在我最初的项目里，我们采用全功能团队的模式，主要是因为团队小——小的团队一遇到一两个人请假，就可能会出现风险。尽管后来我们的团队从6个人变成了12个人，我们仍然采用这种模式。我们采用结对编程是一个方面，另外一个方面是：团队里就需要有一个人来专门解决各种大小事务。如持续集成有问题、自动构建出错、测试有问题等等，没有人愿意专门去做这样的事。 39 | 40 | 本文总结了正在撰写的《Growth：Web开发思想》里提出的一系列实践，为18个步骤: 41 | 42 | - Tasking，即将目标切换成一个个小的任务，而这些任务尽可能的遵循 SMART 原则，如这里的 18 个步骤。 43 | - Setup，搭建开发所需要的基本环境，并尽最大能力地去练习 IDE 及操作系统等等日常工具的使用。 44 | - UI Prototype，可以使用简单的使用 UI 工具来创建 Web 页面的原型。 45 | - Technology Decision，能根据我们的能力以及项目的需要，选择合适的工具。 46 | - hello, world -> Boilerplate，能自己搭建或者寻求一些比较好的 应用模板。 47 | - Build Pipeline，可以设计出整个应用的构建流程，如依赖包管理、运行服务、执行语法检测、运行测试等等。 48 | - Coding，至少能使用两门以上的语言，一门是 JavaScript，一门是编译语言。光只有动态语言，无法让你理解计算机语言的。 49 | - Testing，可以编写单元测试、服务测试、UI自动化测试。 50 | - Deploy，可以完整将应用部署到服务器上。 51 | - Auto Deploy，要会在本地敲个命令，自动部署新版本的应用到服务器上。 52 | - Analytics，不仅仅要知道很多用户喜欢这个功能，还要知道为什么。 53 | - Optimization，即要知道程序中哪里用得多，又要能对代码进行优化。 54 | - Continuous Intergration，除了学会使用持续集成工具，你还要学习什么是持续集成。 55 | - Continuous Delivery，就是缺少一个在持续集成与自动化部署之间的按钮。 56 | - Continuous Deployment，将持续交付的按钮变成自动化就完了？你要改变的不是代码本身 ，还有组织架构。 57 | - SEO / ASO， 将用户导向你的应用是一门艺术。 58 | - Retro，由输出结果来改入输入流程，这才能提高组织和自身的水平。 59 | - Refactor，你以为只有代码和架构可以重构么？ 60 | 61 | 任务切分 62 | --- 63 | 64 | > 即将目标切换成一个个小的任务，而这些任务尽可能的遵循 SMART 原则，如这里的 18 个步骤。 65 | 66 | ![Tasking](images/smart.png) 67 | 68 | - 具体的 69 | - 可度量的 70 | - 可实现的 71 | - 相关的 72 | - 时间可控的 73 | 74 | 环境搭建 75 | --- 76 | 77 | > 搭建开发所需要的基本环境，并尽最大能力地去练习 IDE 及操作系统等等日常工具的使用。 78 | 79 | ![开发工具](images/best-rby-editor.png) 80 | 81 | 至少达到下面的基本要求： 82 | 83 | - 有一个上手的 IDE 或者 编辑器 84 | - 熟练使用包管理 85 | - 使用快速启动工具 86 | - 有一个好的命令行工具 87 | - 熟练使用Git 或者 SVN 88 | 89 | UI原型 90 | --- 91 | 92 | > 可以使用简单的使用 UI 工具来创建 Web 页面的原型。 93 | 94 | ![UI原型](images/ui.jpg) 95 | 96 | 你应该会下面的这些内容： 97 | 98 | - 使用 UI 工具来设计原型 99 | - HTML + CSS 100 | 101 | 技术选型 102 | --- 103 | 104 | > 能根据我们的能力以及项目的需要，选择合适的工具。 105 | 106 | ![技术选型](images/os-compare.jpg) 107 | 108 | 至少要有： 109 | 110 | - 后台MVC框架 111 | - 数据库 112 | - UI 框架 113 | 114 | hello, world 115 | --- 116 | 117 | > 能自己搭建或者寻求一些比较好的应用模板 118 | 119 | ![hello, world](images/helloworld.jpg) 120 | 121 | 因此，你应该到 Web 前后端有一个明确的概念。 122 | 123 | 构建流 124 | --- 125 | 126 | > 可以设计出整个应用的构建流程，如依赖包管理、运行服务、执行语法检测、运行测试等等 127 | 128 | ![构建流](images/build-web-project.png) 129 | 130 | 你需要设计出这样的一个系统： 131 | 132 | - 能帮助你提高开发效率 133 | - 能帮助你提高代码质量 134 | - 帮你运行各种测试 135 | 136 | 编码 137 | --- 138 | 139 | > 至少能使用两门以上的语言，一门是 JavaScript，一门是编译语言。光只有动态语言，无法让你理解计算机语言的 140 | 141 | ![编码](images/coding.jpg) 142 | 143 | 编码需要这么一些步骤： 144 | 145 | - Kick Off 146 | - Tasking 147 | - 获取最新的代码 148 | - 实现功能 149 | - 编写测试 150 | - 重构 151 | - 本地提交代码 152 | - 获取最新代码 153 | - 运行测试 154 | - 提交代码到远程服务器 155 | - 等到 CI 构建完成 156 | 157 | 测试 158 | --- 159 | 160 | > 可以编写单元测试、服务测试、UI自动化测试 161 | 162 | ![测试金字塔](images/test-primard.png) 163 | 164 | 因此，你必须知道测试的基本类似： 165 | 166 | - 状态测试 167 | - 行为测试 168 | 169 | 部署 170 | --- 171 | 172 | > 可以完整将应用部署到服务器上 173 | 174 | ![部署](images/deploy.jpg) 175 | 176 | 你至少需要： 177 | 178 | - HTTP 服务器 179 | - CGI 或者类似的服务器 180 | - 进程管理工具 181 | - 语言版本管理工具 182 | 183 | 自动部署 184 | --- 185 | 186 | > 在本地敲个命令，自动部署新版本的应用到服务器上。 187 | 188 | ![自动化部署](images/auto-deploy.jpg) 189 | 190 | 熟悉使用自动化配置管理工具，如 Ansible、Salt Stack 等等来改进部署流程 191 | 192 | 分析 193 | --- 194 | 195 | > 不仅仅要知道很多用户喜欢这个功能，还要知道为什么。 196 | 197 | ![精益环路](images/lean-loop.jpg) 198 | 199 | 除了使用诸如 Google Analytics / Piwik 这样的工具，对于日志来说你还需要有： 200 | 201 | ![ELK](images/elk.png) 202 | 203 | 优化 204 | --- 205 | 206 | > 即要知道程序中哪里用得多，又要能对代码进行优化。 207 | 208 | 可以结合 New Relic 这样的 APM 工具进行性能分析。 209 | 210 | ![性能分析](images/new-relic.png) 211 | 212 | 持续集成 213 | --- 214 | 215 | > 除了学会使用持续集成工具，你还要学习什么是持续集成。 216 | 217 | ![持续集成](images/ci.jpg) 218 | 219 | 至少你应该熟练使用免费的开源集成工具：Jenkins 220 | 221 | 持续交付 222 | --- 223 | 224 | > 就是缺少一个在持续集成与自动化部署之间的按钮。 225 | 226 | ![持续交付](images/cdelivery.jpg) 227 | 228 | 持续集成完成后，你还需要： 229 | 230 | - 自动部署代码到测试环境 231 | - 运行集成测试 232 | - 发布最新的包 233 | 234 | 持续部署 235 | --- 236 | 237 | > 将持续交付的按钮变成自动化就完了？你要改变的不是代码本身 ，还有组织架构。 238 | 239 | ![持续部署](images/cd.png) 240 | 241 | 最简单的实现就是 GitHub Pages 了。 242 | 243 | > 设计系统的组织，其产生的设计等同于组织之内、组织之间的沟通结构。 244 | 245 | ![康威定律](images/conway-law.jpg) 246 | 247 | SEO / ASO 248 | --- 249 | 250 | > 将用户导向你的应用是一门艺术。 251 | 252 | ![搜索引擎优化](images/seo.jpg) 253 | 254 | 知道 PageRank 么？ 255 | 256 | 回顾 257 | --- 258 | 259 | > 由输出结果来改入输入流程，这才能提高组织和自身的水平。 260 | 261 | ![Retro](images/retro.jpg) 262 | 263 | Make it Right, Make it Better 264 | 265 | ![PID](images/input-output.png) 266 | 267 | 重构 268 | --- 269 | 270 | > 你以为只有代码和架构可以重构么？ 271 | 272 | ![Refactor](images/refactor.png) 273 | 274 | ![Rework](images/rework.png) 275 | 276 | -------------------------------------------------------------------------------- /images/api-architecture-two.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/api-architecture-two.png -------------------------------------------------------------------------------- /images/auto-deploy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/auto-deploy.jpg -------------------------------------------------------------------------------- /images/babie.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/babie.jpg -------------------------------------------------------------------------------- /images/best-rby-editor.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/best-rby-editor.png -------------------------------------------------------------------------------- /images/build-web-project.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/build-web-project.png -------------------------------------------------------------------------------- /images/cd.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/cd.png -------------------------------------------------------------------------------- /images/cdelivery.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/cdelivery.jpg -------------------------------------------------------------------------------- /images/ci.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/ci.jpg -------------------------------------------------------------------------------- /images/coding.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/coding.jpg -------------------------------------------------------------------------------- /images/conway-law.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/conway-law.jpg -------------------------------------------------------------------------------- /images/deploy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/deploy.jpg -------------------------------------------------------------------------------- /images/elk.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/elk.png -------------------------------------------------------------------------------- /images/fullstack.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/fullstack.jpg -------------------------------------------------------------------------------- /images/helloworld.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/helloworld.jpg -------------------------------------------------------------------------------- /images/input-output.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/input-output.png -------------------------------------------------------------------------------- /images/kanban.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/kanban.jpg -------------------------------------------------------------------------------- /images/lean-loop.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/lean-loop.jpg -------------------------------------------------------------------------------- /images/make-it-bette.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/make-it-bette.png -------------------------------------------------------------------------------- /images/new-relic.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/new-relic.png -------------------------------------------------------------------------------- /images/os-compare.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/os-compare.jpg -------------------------------------------------------------------------------- /images/refactor.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/refactor.png -------------------------------------------------------------------------------- /images/retro.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/retro.jpg -------------------------------------------------------------------------------- /images/rework.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/rework.png -------------------------------------------------------------------------------- /images/seo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/seo.jpg -------------------------------------------------------------------------------- /images/smart.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/smart.jpg -------------------------------------------------------------------------------- /images/smart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/smart.png -------------------------------------------------------------------------------- /images/tasking.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/tasking.png -------------------------------------------------------------------------------- /images/test-primard.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/test-primard.png -------------------------------------------------------------------------------- /images/ui.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/ui.jpg -------------------------------------------------------------------------------- /images/waterfall.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/growth-in-30-minutes/c77c99c4e1cf915143d8561ac1fd66828df61f80/images/waterfall.jpg -------------------------------------------------------------------------------- /live-detail.md: -------------------------------------------------------------------------------- 1 | 介绍 2 | --- 3 | 4 | 每一小节，都会挑选回答一个问题。 5 | 6 | ### 介绍我自己 7 | 8 | TW 咨询师 9 | 10 | ### 介绍 Live 的目的 11 | 12 | 什么是全栈工程师 13 | --- 14 | 15 | 当你工作多年后也会有同样的能力。 16 | 17 | 为什么会有这么多全栈工程师 18 | 19 | 小公司，大公司，精益团队，全能团队 20 | 21 | 每个团队都需要有这样的一个人，能帮助前后端理清需求 22 | 23 | 全栈应用开发的知识体系 24 | --- 25 | 26 | 完整的能完成一个应用的开发、部署 27 | 28 | - 前端 29 | - 后台 30 | - APP 31 | - Ops 32 | - 业务分析 33 | 34 | 我是如何成为全栈工程师的？ 35 | --- 36 | 37 | 写博客系统 38 | 39 | BootStrap + Django 40 | 41 | 公司的工作主要是在后台、搜索引擎 42 | 43 | 如何从产品 UI 原型到简单的 MVP？ 44 | --- 45 | 46 | - 产品原型 -> 开源软件工具 -> 确认出用户的真实需求 47 | - UI 原型工具 48 | 49 | 直接使用开源工具如 WordPress 、电子商务 magento 50 | 51 | 寻找开源的软件产品 + UI 设计 52 | 53 | 如何入门成为全栈工程师？ 54 | --- 55 | 56 | XAMPP 服务 57 | 58 | 部署服务的步骤 59 | 60 | - 购买域名和服务器 61 | - 登录服务器安装软件 62 | - 配置服务器与域名 63 | 64 | 如 WordPress 都是可以自动化的 65 | 66 | 运行代码，了解数据库之间的关系 67 | 68 | 全栈应用：如何从一到九十？ 69 | --- 70 | 71 | 手动部署 WordPress，可以编写成自动部署脚本， 72 | 73 | 基于 WordPress 修改，可以变成写一个相似的框架 74 | 75 | 下一步呢？ 自己理解系统的组成，手动编写 SQL、 76 | 77 | 为什么所有的 Web 应用都将被重写 78 | --- 79 | 80 | 1. 系统已经变得难以维护。 81 | 82 | 这里的原因仍然有很多：大量的代码已经没有人知道其业务逻辑，变得难以修改；代码间耦合度过高，重构系统的难度过于复杂；项目所使用的技术栈已经过时，已经被市场所淘汰；团队的技术栈在成员变动的过程中，团队中的大部分成员的技术栈已经和当前的项目不匹配了。 83 | 84 | 2. 系统的技术栈已经难以符合业务的需求。 85 | 86 | 绝大多数情况下，我们在最初的开始创建项目的时候，所选择的技术栈都是符合当时业务需求的技术栈、可以快速验证其业务价值的技术栈。而随着业务的扩张，现有的技术栈很快将难以满足当前业务的需求，或出现性能优化上的限制。 87 | 88 | Web应用的生命周期 89 | --- 90 | 91 | - 技术选型与验证 92 | - 搭建构建系统 93 | - 迭代开发与编码 94 | - 上线和数据分析 95 | - 自动化部署 96 | - 重构代码 97 | 98 | 列举他们所需要的技能。 99 | 100 | 全栈工程师如何提升自己？ 101 | --- 102 | 103 | 重构与代码质量 104 | 105 | 团队相处技能 106 | 107 | DevOps 技能与团队协作 108 | 109 | 110 | -------------------------------------------------------------------------------- /live.md: -------------------------------------------------------------------------------- 1 | 2 | ## 个人介绍 3 | 4 | 工程师 / 咨询师 / 作家 / 设计学徒。 5 | 6 | 作为一个作家，出版有《自己动手设计物联网》、《全栈应用开发：精益实践》，译有《物联网实战指南》等书，开源有《Growth：全栈增长工程师指南》等七本电子书 7 | 8 | 作为一个技术专家，审阅《Angular 2 Services》、《Getting Started with Angular》等四本英语技术书籍。 9 | 10 | 作为一个开源爱好者，在 GitHub 开源有学习应用 Growth 等数量众多的开源应用。 11 | 12 | 13 | ## Live 标题 14 | 15 | 为你的 Live 拟定标题，建议简洁、直接、有重点。13 个汉字以内。 16 | 17 | 全栈应用开发的精益实践 18 | 19 | ## Live 简介 20 | 21 | Web 全栈，能让我们对 Web 系统有一个完整的认识。当我们讨论全栈时，是在说自己有不同领域（前端、后台、DevOps）的基础。它可以在遇到一个复杂的问题时，帮轻松地帮助我们找到问题的来源。本次 Live，我将带来全栈开发的入门与进阶，主要是以我个人的工作经历为主。并帮助大家构建 Web 应用的全栈开发所需要的完整知识体系，并以精益创业的思想来一步步开发 Web 应用。 22 | 23 | ## 设定章节 24 | 25 | 26 | - Web 应用的生命周期 27 | - 全栈应用开发的知识体系 28 | - 如何从产品 UI 原型到简单的 MVP？ 29 | - 全栈应用：如何从一到九十？ 30 | - 我是如何成为全栈工程师的？ 31 | - 如何入门成为全栈工程师？ 32 | - 全栈工程师如何提升自己？ 33 | 34 | 35 | ## 书  36 | 37 | 本书的主线结合了《全栈增长工程师指南 》与《全栈增长工程师实战 》两部分的内容，即以实践的方式来贯穿这些理论知识。本书的目标，是旨在帮助读者构建 Web 应用的全栈开发所需要的完整知识体系，并以精益创业的思想来一步步开发 Web 应用： 38 | 39 | - 从创建一个 UI 原型到编写出静态的前端页面 40 | - 从静态的前端页面到带后台的应用，并部署应用 41 | - 从 Web 后台开发 API 到开发移动 Web 应用 42 | 43 | 在这个过程中我们还将介绍一些相辅相成的步骤： 44 | 45 | - 使用构建系统来加速 Web 应用的开发 46 | - 为应用数据分析工具来改进产品 47 | - 使用分析工具来改善应用的性能 48 | 49 | 50 | 51 | --------------------------------------------------------------------------------