前端开发师职业生涯入坑指南

21CTO

资讯 0 2976 2018-11-03 11:56:54

21CTO社区导读：前端开发人员的职业生涯将走向何方？或许你有点卡顿或者有点小沮丧？那么这篇文章可能适合你。

几个星期前，我的一位朋友告诉了我，他刚开始踏入前端开发者的职业生涯。

任何事情在开始的时候，都并不是那么容易。在旅程的开始就让人心生沮丧，这是人生路上非常典型的遇见，没有比找到去到过那里的人的建议更有价值的了。

当然，我从未仔细考虑过上面这个问题，我只是为他快速制定了一些东西还有规则。后来我决定将与他分享的详细与大家分享。

没有菜谱

其实你问我这样的问题，我也没有太好的配方。如果有，我想大概是“练习，练习，练习”。

你必须花费大量时间在技艺的磨练上，这不是秘密。在这点上，我也很小气。

如果你已经开始了职业生涯并且有幸找到好工作，你必须在回到家时也要从事辅助项目。倘若你还是个学生，你必须在放学后回来，参与辅助项目，深入学习课程和阅读相关的书。

如今看来，通过我的职业生涯，我意识到最重要的是辅助项目对我的成长有很强提升。

这就是你必须要完成的工作。

在工作中，我们会面临很多限制 - 现有的代码库，体系结构，一组库与框架，团队规则等。

它并不总是一个教育环境。你必须解决业务目标，而不仅仅是自我教育。这两件事很少同时进行。

因此，开发者要在精神上做好充分的准备，在IDE打开的情况下度过一个夜晚，而不总是在Netflix上看你最喜欢的电影或外出扯淡（尽管，这也是非常重要的事情）。

关于JavaScript

JavaScript是Web的汇编语言。如果你没有正确理解这门语言，就无法在前端世界中做任何事情。

当然你也不必成为像 Douglas Crockford 这样一位成功的开发者。我告诉你我怎么做的，我已经在该专业上花了很长时间，但只有到语言的细节后才打开了我。如果你暂时不了解语言的深度，这是完全正常的，但是你早晚会来补这个动作。

但是，有一个基本的语言部分，你必须要拿到这些技能：

1）数据类型
2）算术运算
3）逻辑和条件运算符
4）理解OOP范式（原子继承）
5）理解功能范式（函数，不变性）

此外，我建议你开始学习 Node.js。所有前端的工具都需要Node.js，与处理浏览器应用相比，在命令行上开发简单的应用程序会容易地多。

浏览器和DOM

除此之外，你应该能理解浏览器是怎样工作的，特别是要理解DOM的概念。

1）DOM如何运行以及它的基本组件
2）事件，事件传播和处理
3）DOM API，窗口对象
4）DOM选择器

掌握了这些，你便能够通过监听控件和执行简单的DOM操作（比如设置值，类和属性）来编写简单和纯粹的JavaScript应用。

UI 开发

在以往的职业生涯中，我有着后端和桌面应用程序的UI设计背景，乍一看HTML和CSS似乎很简单。它就不是真正的编程语言，只是一组标签声明，对吧？然而并不是。

即使你的职业目标并非一名设计师，你也应该培养自己有UI制作能力和对良好设计的品味。有一个很好的办法就是去“偷”一些人家做得很酷的东西。

我并不是开玩笑，找到你喜欢的网站尝试复制它。记住，有一个家伙这样说过 - “Un artista copia，un gran artista roba”（好艺术家靠复制，伟大的艺术家靠偷）。

让HTML和CSS弄脏你的双手

先让我们精通创建，简单且美观的界面，还会获得将一个PSD或Sketch文件转换为HTML/CSS的好自由职业，这可是一项目重要的技能。

客户/服务器通信

浏览器应用程序不是孤立存在的，它们需要与服务器通信以获取数据并推送数据。

这太让人激动了，如果我们了解以下事情后会更加获益匪浅：

1）HTTP协议的基础
2）REST的概念（HTTP动词和资源）。
可选技术：GraphQL的概念以及与REST的区别。

有很多开放的API，你可以用它们来做很酷的东西，让我们选择一个来构建一个简单的应用程序。

我做过一个项目叫 alexbeletsky/github-commits-widget，就是一个简单的应用程序，它连接到GitHub API并创建一个贡献小部件，我在上面玩得挺开心。

框架开发

前三个部分可能需要你花一年或更长的时间，接下来我建议你去看看一些 UI 开发框架。

目前的JS生态系统以创造“疲劳”而闻名。开发复杂，配置混乱。提醒你的是，不要以React或Angular做为入门，即便你听说它们很酷。

事实上，当你对JS/HTML/CSS写得很爽的时候，有些框架已经死了（前端开发框架有生存周期，大概在3-5年，然后完全被竞争对手超越......我们不去打扰那场比赛）。

但是现在，我建议你专注于React.js。它的生态系统是稳定的，有数百万个教程、开源项目和社区活动。

接下来你将对任何前端框架都充满信心，因为所有框架都旨在简化复杂的事情或让应用性能更高。至于开发的基础，例如DOM操作和HTML/CSS，或多或少有点新语法，但基本保持不变。

即便框架可以封装任何特定的细节，我们也有足够的信心去理解那里的实际细节。

最后，我再分享一下自己的学习旅程中帮助或影响我的资源清单：