既没有好看的皮囊，也不存在有趣的驱壳，只是个熬夜点... - 黑马程序员技术交流社区

既没有好看的皮囊，也不存在有趣的驱壳，只是个熬夜点外卖的猪精...

　　哈喽大家好，企业部的小姐姐来了，不知道上篇帖子对大家有没有帮助呢?本着看热闹不嫌事大的精神，我想看看大家发来的面试糗事，然而并没有很多，貌似大家更关注的是：为什么一起毕业的同学，薪水差距会那么大！今天用前端的来举个栗子，自我反省一下，你和高薪之间还有多大差距。

　　高贵的前端程序猿们：

　　前端开发工作已经变的越来越复杂，仅仅是想罗列一份前端开发的学习列表就已经是一件艰巨的工作。曾经只要会编写 HTML, CSS 和 Javascript 就是能够找到一份前端开发工作的全部要求。而现在，web 开发远远不止是简单编码。

因为我们的互联网上有了更多的内容，也因为有更多的人、更多设备可以访问互联网, web 前端开发技能也就更多了。我们现在需要考虑的问题很多，比如载入时间，性能，不同的屏幕尺寸, 不同的输入方式, build 系统, 部署策略，还有如何组织好我们的代码。

这还是想象中前端开发么？好吧其实只要你有热情，这些还是很有趣的，现在就来仔细看看，一份前端开发的工作，到底需要你准备些什么?

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

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

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

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

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

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

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

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

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, 翻墙读一读这个吧 google web developer fundamentals。

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

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

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

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

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

怎么样？有没有找到自己和别人的差距？不要怪小姐姐黑你们。有什么问题随时给我留言啊，互黑也可以啊！