从零开始搭建web产品项目（一）

这篇文章的主要目的，是帮助基础不好甚至是零基础的同学从整体项目出发，从前到后的掌握一份web产品从立项到的上线的完整流程。由于讲解的内容较多，我会分多个篇幅慢慢解说。

---

先开上帝视角

许多同学在最开始开始学习某项技能的时候，都不知道从什么方面去下手。

就拿web前端来说，web前端的开发可谓是超级大杂烩，稍微学习过前端开发的同学都知道，一入前端深似海，看似低门槛甚至是零门槛（对比其他编程语言）的前端开发，在真正运用在项目实战上时，自己摸索的那一点简直是不够用，而且前端圈子涉猎非常的“杂乱”，几乎每天都有新的东西诞生，怎么样在有限的精力来满足无限的学习需求，我的回答是——“想得美”。

选择最适合自己的学习路线，才是最重要的（“这不废话吗，我都还不知道怎么开始，选个P哦”），我只能说一定要先把立意先明确，这样学到的硬技能再被更新的事物取代时才不会产生——“我要这铁棒有何用”的感觉。

好了，前面啰嗦那么多，咱们言归正传——先开上帝视角，对于开上帝视角，我把整个产品项目划分成以下几个部分：

• 需求分析——先明确你想做个什么东西，满足什么需求点，立个目标出来。例如某首富说的“先定一个小目标”（手动滑稽），再考虑如何实现
• 产品设计——说直白了，就是把自己设想草稿绘制出来，并对比之前的需求分析，修修补补。常用的工具有：axure、visio、Photoshop、sketch（如果你有mac的话）等等，都不会用？手绘的干活！
• 开发——到了这个环节，就是上手写代码的时候了，这个时候需要首先考虑程序整体的架构、可维护性并且结合需求分析，给出一定的数据上报方便进行数据分析和产品的迭代。开发到时候会挑选最简单易懂的方案详细讲解。（先俯视一下整体）
• 发布上线——哇哦，开发完了是不是就应该上线了，其实中间还有一个环节，测试与修复BUG。之所以没放里面是因为，作为一名全栈式产品+开发人员，这个问题不应该放在开发中解决吗（手动滑稽）（“竞品分析和用户调研呢...” “早着呢...”），开发完成后，整个web项目会托管到github，不熟悉github的同学，可以先去了解一下，或者等到我写到这一章
• 数据分析——目前蛮多家数据分析服务的供应商，基本都有免费服务：友盟、TalkingData、百度统计、google analytics等等。个人推荐使用TalkingData
• 优化迭代——字面含义，但内容涉及非常广，对自己有严格要求的同学，可以待项目上线后深究一下。web端常见的优化有：优化图片尺寸、减少单位时间内请求数量、减少重绘和回流（这个对新手来说有点深了，先无视吧）等等。迭代的话，除了根据产品自身的需求以外，还需要结合数据表现，纠正和完善迭代方向

关系流程图

上图是几大步骤的基本关系图，我叫它基本套路。

橙色字体标记出来的是需要重点关注的对象，先弄清楚关注点，再去找切入点下手

结束语

这篇文章干货并不多，主要目的，是帮助大家了解整套项目的基本结构或者说流程。每个环节还可以再拆解细分，这里就不做详细描述了。

就跟学校教书的套路一样，我会从前到后把一个web产品的整个生命周期描述一遍。如果只是单纯对技术，或者是对产品感兴趣的朋友，大可不必每个环节都看。

（由于工作的原因，我的更新速度会很慢，有多慢呢？我也不知道，但一定会把它讲完）