携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第7天，点击查看活动详情
先讲一个我的一个学生的故事：
先说一下他的背景吧，他是一名双非理工科学校毕业，工作了两年的前端工程师，目前年薪大概在30w左右。在大三的时候进入学院的工作室开始自学PHP并和同学一起做项目，大四去一家广州的公司前端开发实习、转正。中间经历过一次跳槽，一直到现在从事的都是前端开发工作。
对于刚入学的大一大二学生们来说，可能还在学习基础通识课阶段，可能还没怎么接触编程，或者刚接触编程语言，那我的建议是专注计算机基础理论的学习包括操作系统、计算机原理、算法和数据结构、编程语言的学习，养成编程习惯为主。如果已经是大三大四了，那么我们应该把项目实践放在第一位，作品是一个程序员最好的自描述，无论是参与开源项目还是自己尽可能去模仿一些优秀的互联网项目产品都是很好的方式。
经过近几年的爆发式增长，前端工程师这个岗位的市场热度也是比较高的，而且入门门槛相对较低，上手快，前期初入行都是要从页面做起的，所见即所得，能够得到正反馈，比较容易获得成就感，能够激励你深入学习。
现在，我们开始进入主题。总体思路大概是这样的，作为一个刚接触前端的小白，肯定对前端还没有很深的概念，建议先囫囵吞枣式的先看一遍官方基础文档或经典书籍（别太厚的否则容易劝退）脑子里有个大概知识轮廓；再跟着一些优质的视频去敲代码，在编码工程中逐渐构建起自己的前端知识体系；再回过头来翻看一些经典书籍和文档，补全自己的一些缺漏。
接下来围绕这个思路我们讲学习前端主要分为三个阶段。
关于入门的文档和书籍
- w3school在线教程（官方在线文档）、MDN(web技术文档，据说是前端工程师的霍格沃茨魔法学校)
- 《JavaScript高级程序设计（第4版）》（俗称红宝书，囊括js大部分知识点）
- 《CSS世界》（详细剖析了CSS的相关基础知识和常见问题）
第一阶段
这个阶段我们需要通过翻阅官方在线文档及网上的前端入门基础视频，了解HTML、CSS、JavaScript的基础语法（包括HTML5，CSS3，ES6-10的新特性）然后在代码编辑器上验证其效果。这一阶段学习成果验收标准：能够以动态交互页面的形式临摹出主流网站首页。
第二阶段
学习完前端基础知识，不要着急去研究框架，什么Vue，React，Angular之类框架的更新太快，你好不容易研究透了，等你毕业的时候，又会出来很多新的，所以掌握基础最重要。这个阶段，我们应该花时间去了解软件产品研发全链路的流程，明白前端交互，数据是怎么来的，数据是怎么存储的，前端是怎么和后端通信的等这些问题。所以我们就需要学一些后端语言如PHP,node.js；数据库如mysql（关系型），mongoDB（非关系型）；网络协议如HTTP，TCP/IP协议；服务器知识点如Linux命令，搭建基础环境等。这一阶段学习成果验收标准：能够在服务器上自己搭建一个mvc模式的web服务，提供增删改查的接口，进行数据库操作，并能和前端实现通信。
第三阶段
经过前两步的学习，我们对前端有了大概的印象，了解前端演变的历史；趁着大学有时间不妨把经典主流的前端框架都过一遍，包括jquery,angular,vue,react等，才能让你更加理解比对框架间的异同点。在这一阶段，我们还会接触到前端工程化如webpack，rollup，vite等；了解JS能用于不同端的技术如：Electron，各家的小程序等；了解基于前端框架二次开发的框架如next，taro等。这一阶段学习成果验收标准：能够利用不同的框架做出一个最小的mvp的前端项目。
总结
其实写到这里，大家是不是已经对前端学习有了一定的概念和规划，基本上如果能按照上述的计划去学习，相信大家都能达到初级甚至是中级前端开发的标准，至于高级嘛...你是不是想多了少年，前面还有很多东西等着你呢。
关于学习技巧这一块，我可以总结几个关键词：
1.每个阶段都给自己定一个目标并向其奔赴，正如我给每个阶段定义的学习成果验收标准一样。
2.学习好的思维方式、信息检索、解决问题的能力，比如我之前在学校的时候原本可能直接百度去搜索，直接看推荐的一些零散博客来学习知识甚至是解决问题）现在是耐着性子去看官方文档翻阅API；去官方的一些社区，群聊提出问题；去github上看issue或者提issue。debug的过程就是真正学习排查问题的过程；大部分碰到的常规问题都是在debug中解决，下次再遇见就可以借助经验更快的定位并解决问题了。
3.保持谦卑，前端技术栈是爆炸性的发展，我们没法全部都能精通，掌握学习方法是很重要的，哪怕进了公司，你不会这方面的技术栈，那么凭借经验、翻看文档、视频，也能快速上手业务开发，再逐步花时间在熟悉业务的同时去深入研究技术向。
最后希望大家都能好好学习，找到满意的工作。