前端程序员：月薪 5K 到 5 万

Posted 2020-06-14

入行行头：5 大硬件

请准备好以下东西

1. 一颗人类的大脑：智商在平均水平线以上即可

2. 一份强烈的渴望：我的代码要可以运行在任何一个有浏览器的设备上。

3. 一台笔记本电脑：不需要花费很多钱得那种，只要它可以运行 Windows, Mac OS X, 或 Linux 系统。当然你也可以只用一台台式机，但是那样就不能带着它坐在咖啡馆里…

4. 一个文本编辑器：可以推荐的比如 Atom,Visual Studio Code, TextMate, 它们都有在 Mac OS, Windows 的免费版本，什么还有 Sublime, WebStorm? 啊，那些都很流行，不过需要需要一笔不少于 70 美元的花费…

5. 一个FQ代理：这个大家都懂的，我就不解释了

初级资质要求

一些专业基础

你需要学会浏览器能理解的三大语言：html, CSS, javascript – 神圣的三位一体！

非常重要的一点是，一定要理解这三大语言后再去学习别的，确保知道怎样在各种尺寸的屏幕上排列好你的网页，怎样在一个按钮被按下后 do something!

一些很有用的学习资源

• Codeacademy: interactive, code-along tutorials (this site is the bomb btw)

• Web Development for Beginners: article from webplatform.org.

• MDN：https://developer.mozilla.org/en-US/docs/Web

中级进阶路径一旦掌握了三大语言，就可以开始学习专业的开发流程啦：

1. Command line：好吧,命令行也许都会,但是要掌握最基本的操作,熟悉怎样配置你的环境,还有那些奇怪的 shell 脚本，因为你会经常用到它们。

2. CSS 已经不够用了,我们有了 CSS 的预处理：Sass, LESS。

3. 知道如何搭建一个 build 系统：Gulp 或 Grunt 这类的构建任务脚本器,编译 LESS 成 CSS, concatenating Javascript, minify 压缩静态资源, 选一个异步或同步的方式加载它们，然后一个好的 build 系统要能自动做到那些,包括一个本地的 web 服务器用于测试代码。

4. 代码版本管理，git。

5. 在 github 上分享你的代码！

6. 部署! 让你的网站上线。可以找一个免费的服务提供商，比如 heroku.com, https://pages.github.com

这些几乎就是现代前端开发者会用到的工具和技术，好了，你现在可以成为一个前端开发工程师了。

高级炸裂装备

你已经能够为你的朋友的业务搭建一个网站了，简洁的排版，高清大照片，你成功了，它甚至在你的手机都看着很棒。那么还有什么值得学的？

把你的网站和一个内容管理系统 (CMS）集成在一起。一个 CMS 能够让你通过用户界面增、删、改、组织你的内容，不需要任何代码。这就是那些博客网站如何工作的。比如免费的 WordPress，去熟悉一个开源的 CMS 吧，会很有用的。

学习怎样搭建一个 CMS，意味着你讲要熟悉一个服务器端的语言，比如 Node.js, 或 php，然后你还会想要知道怎样和数据库打交道，比如 mysql 或者 MongoDB。

来熟悉一种 Javascript 框架吧，这样你可以真正的搭建一个交互出色的 web 应用，那真的很重要，比如 Angular, React, Ember。只要挑一个你喜欢的，但是一定要精通它。

Javascript design patterns，javascript 也有设计模式？ 是的，读一下吧。

突破天际的大招

沟通技巧！你需要和你的小伙伴们沟通，他们是你的 coder 伙伴，你的老板，你的用户，你的….stackoverflow.com， 有问题找 stackoverflow，扩展一下人脉把，上 meetup.com, 在博客上写一些你的学习体验， 在 Gitgub 贡献一下你的 Pull request。

界面设计和用户体验设计 UI/UX design，前段开发的小伙伴需要具备基本的 UI/UX 设计知识。

搜索优化，要知道怎样提高网站的搜索排名，更容易被人们搜索到。

CSS 过度效果，给你的按钮写一个 hover 的 CSS 动画，还有你的从右边滑入的导航菜单也需要一个平滑的动画。

关于性能，让你的网站尽可能快的被加载，减少 DOM 的 reflow 和 repaint 操作，防止滚动性能瓶颈，优化 Javascript, FQ读一读这个吧 google web developer fundamentals。

用一些测试框架来实现 Javascript 单元测试，比如 Jasmine，QUnit。

持续集成 Continuous integration (CI)，知道怎样配置一套和伙伴们一起使用的自动测试和部署的工具，比如 CircleCI, Travis CI, Jenkins.

超好用的其他加成技能

↓↓↓这些并非必须，但能帮你脱颖而出：

用 CSS3, SVG, Canvas API 实现动画。

后端开发， Node.js

最后：去找工作吧！

有了技能是不够的，你需要能展示它们，你还能干的是：

1. 搭建一个小网站，公开你的 gitub 代码库，确保你的代码和文档清楚漂亮，还有一份 README

2. 去 meetup.com 找你的老板或者投资人吧，开一个博客，申请一个 linkedin 帐号

3. 因为 web 技术总是在变化，最后，即使找到了一份称心的工作，还是需要 stay motivated, 你需要时常去下面这些地方转转：CSS Tricks，SitePoint，Smashing Magazine

4. 当然还有些像 CSDN 这样中文社区，总之遇到任何难题，社区里有总有乐于助人的。

5. 保持好的职业态度：Stay humble, and build cool shit