前端开发者，2017 年你应该学习什么

心已赠人 2022-07-12 05:06 219阅读 0赞

![090049y9y99imzi9w9cyld.jpeg][]

在当今的快节奏生态中，我们都倾向于花时间尝试最新的发明，然后在网络上进行激烈的辩论。

这里，我并不是说我们不能这样做。但我们的确应该把脚步放慢一些，并认真了解那些不会有很大变化的事情。这样不仅会提升我们的工作质量和我们所创造的价值 —— 还将切实地帮助我们更快理解这些新的工具。

本文融合了我的个人经历以及对新一年的希冀。正如我想热切表达自己想法一样，我也期待能在下方的评论表单中看到你的建议。

### 学习如何写出可读性高的代码 ###

我们多数的工作并不是编写新代码，而是维护已有代码。这意味着你最终阅读代码的时间要比编写它所花费的时间要长，所以你需要为之后需要阅读你代码的程序员优化代码，而不是为了解释器。

这里我建议你按以下顺序 — 由浅入深 — 阅读下面三本书：

*  Dustin Boswell 的 《[编写可读代码的艺术][Link 1]The Art of Readable Code\[1\]》
 *  Robert C. Martin 的 《[代码整洁之道][Link 2]Clean Code: A Handbook of Agile Software Craftsmanship\[2\]》
 *  Steve McConnell 的 《[代码大全][Link 3]Code Complete: A Practical Handbook of Software Construction\[3\]》

![090110m49qkzziwfgzbezj.jpeg][]

### 深入学习 JavaScript ###

现如今，每周都会出现一个新的 JavaScript 框架，并标榜自己比其他的任何旧框架都要好用。这样的情况下，我们很多人更倾向于花费时间来学习框架，而且这样也要比学习 JavaScript 本身要容易的多。如果说你正在使用框架，但并不了解该框架的工作方式，立刻停止使用它，并去学习 JavaScript，直到你能够理解这些工具的工作方式为止 。

*  可以从 [Kyle Simpson][]\[4\] 的 [你所不知道的 JavaScript][JavaScript]\[5\] 系列开始，这个系列可以在线免费阅读。
 *  [Eric Elliott][]\[6\] 列出的一个长长的 [2017 年：JavaScript 的学习目标][2017 _JavaScript]\[7\]。
 *  [Henrique Alves][]\[8\] 列出的 [进行响应式开发之前必须了解的事情][Link 4]\[9\]（实际上就是一个知识框架）。
 *  Mike Pennisi 的 [JavaScript 开发者：注意你的语言][JavaScript 1]\[10\] — 了解 ECMAScript 新特性的中 TC-39 发展过程。

### 学习函数式编程 ###

多年以来，我们一直期待着 JavaScript 引入类，但真正引入类之后，我们却不想在 JavaScript 中使用类了，我们只想使用函数。我们甚至使用函数编写 HTML (JSX)。

*  Kyle Simpson 的 [轻量级函数式 JavaScript][JavaScript 2]\[11\]。
 *  Frisby 教授的 [函数式编程完全指南][Link 5]\[12\] 和 [在线免费课程][Link 6]\[13\]。

![090130vwwmxx761bbdwrrr.jpeg][]

### 学习设计基础知识 ###

作为一个前端开发者，我们比这个生态中的任何人 —— 甚至可能是设计人员 —— 都要更加接近用户。如果设计者必须去确认你还原在屏幕上的每一个像素，你或许做错了某些事。

*  [David Kadavy][]\[14\] 的《[黑客设计][Link 7]Design for Hackers\[15\]》或对应的 [免费课程][Link 8]\[16\]。
 *  [Tracy Osborn][]\[17\] 的讲座：[为非设计人员的设计知识][Link 9]\[18\]。
 *  [Nathan Barry][]\[19\] 的 《[Web 应用设计][Web]Design of Web Applications\[20\]》。
 *  [Jason Santa Maria][]\[21\] 的 《[Web 页面设计][Web 1]On Web Typography\[22\]》。
 *  Alan Cooper 的 《[交互设计之路：让高科技产品回归人性][Link 10]The Inmates Are Running the Asylum: Why High Tech Products Drive Us Crazy and How to Restore the Sanity\[23\]》。
 *  两篇关于 UI 动画的文章：[如何使用动画来提高 UX][UX]\[24\]、[过渡界面][Link 11]\[25\]。

### 学习如何与人协作 ###

有些人很喜欢通过编程来与电脑进行交互，而非与人进行交互。不幸的是，这样的结果并不是很好。

基本上我们不可能完全脱离群体来工作：我们总是需要和其他开发者、设计师以及项目经理 —— 有时候甚至要和用户 —— 交换意见。这是比较难的任务，但如果你想要真正理解你在做什么以及为什么要这么做的话，这一步是非常重要的，因为这正是我们工作的价值所在。

*  [John Sonmez][]\[26\] 的《[软技能：代码之外的生存指南][Link 12]Soft Skills: The software developer’s life manual\[27\]》。
 *  Robert C. Martin 的《[代码整洁之道：程序员的职业素养][Link 13]The Clean Coder: A Code of Conduct for Professional Programmers\[28\]》。
 *  Jim Camp 的 《[从零开始：专业人士不想让你了解的谈判工具][Link 14]Start with No: The Negotiating Tools that the Pros Don’t Want You to Know\[29\]》。

![090152u00pcdprrz67trhr.jpeg][]

### 学习如何为用户编写代码 ###

与同事或其他人的交流大部分是以文本的形式进行的：目标描述和评论、代码注释、Git 提交、即时聊天消息、电子邮件、推文、博客等。

想象一下，人们要花费多少时间来阅读和理解所有以上提到的这一切。如果你可以通过写得更清楚、简洁来减少这个时间，世界将变成一个更好的工作场所。

*  William Zinsserd 的《[写作法宝 : 非虚构写作指南][Link 15]On Writing Well: The Classic Guide to Writing Nonfiction\[30\]》。
 *  William Strunk 和 E. B. White 的《[英文写作指南][Link 16]The Elements of Style\[31\]》。
 *  [奥威尔写作规则][Link 17]\[32\]。
 *  俄文：很好的 [Glavred 课程][Glavred]\[33\]。

### 学习以前的计算机科学智慧 ###

前端开发已经不仅仅简单的下拉菜单了，它前所未有的更复杂了。随着我们所需解决问题的复杂度越来越高，声名狼藉的“JavaScript 疲乏症”也随之出现了。

这意味着现在需要学习非前端开发人员过去几十年所积累形成的知识精华。而这也是我最想听到你向我推荐的内容了。

以下是我个人给大家的推荐：

*  Coursera 的 《[学习像计算机科学家那样思考方式][Link 18]Learn To Think Like A Computer Scientist\[34\]》。
 *  [DHH][]\[35\] 的 [对我意义非凡的五本书][Link 19]\[36\]。

--------------------

读完本文，你有些什么建议呢？在这新的 2017 年里你又想学习些什么呢？

--------------------

作者简介：

Web 开发者，充满激情的摄影者，crazy dogs 的主人。

译者简介：

[GHLandy][]\[37\] —— 欲得之，则为之奋斗 (If you want it, work for it.)。

--------------------

via: [https://medium.freecodecamp.com/what-to-learn-in-2017-if-youre-a-frontend-developer-b6cfef46effd\#.ss9xbwrew][https_medium.freecodecamp.com_what-to-learn-in-2017-if-youre-a-frontend-developer-b6cfef46effd_.ss9xbwrew]

作者：[Artem Sapegin][]\[38\] 译者：[GHLandy][GHLandy 1]\[39\] 校对：[bestony][]\[40\]

本文由 [LCTT][]\[41\] 原创编译，[Linux中国][Linux]\[42\] 荣誉推出

--------------------

\[1\]: https://www.amazon.com/gp/product/0596802293/  
\[2\]: https://www.amazon.com/Clean-Code-Handbook-Software-Craftsmanship/dp/0132350882/  
\[3\]: https://www.amazon.com/Code-Complete-Practical-Handbook-Construction/dp/0735619670/  
\[4\]: https://medium.com/u/5dccb9bb4625  
\[5\]: https://github.com/getify/You-Dont-Know-JS  
\[6\]: https://medium.com/u/c359511de780  
\[7\]: https://medium.com/javascript-scene/top-javascript-frameworks-topics-to-learn-in-2017-700a397b711\#.zhnbn4rvg  
\[8\]: https://medium.com/u/b6c3841651ac  
\[9\]: http://alves.im/blog/before-dive-into-react.html  
\[10\]: https://bocoup.com/weblog/javascript-developers-watch-your-language  
\[11\]: https://github.com/getify/Functional-Light-JS  
\[12\]: https://github.com/MostlyAdequate/mostly-adequate-guide  
\[13\]: https://egghead.io/courses/professor-frisby-introduces-composable-functional-javascript  
\[14\]: https://medium.com/u/5377a93ef640  
\[15\]: https://www.amazon.com/Design-Hackers-Reverse-Engineering-Beauty-ebook/dp/B005J578EW  
\[16\]: http://designforhackers.com/  
\[17\]: https://medium.com/u/e611097a5bd4  
\[18\]: https://youtu.be/ZbrzdMaumNk  
\[19\]: https://medium.com/u/ac3090433602  
\[20\]: http://nathanbarry.com/webapps/  
\[21\]: https://medium.com/u/8eddcb9e4ac4  
\[22\]: https://abookapart.com/products/on-web-typography  
\[23\]: https://www.amazon.com/Inmates-Are-Running-Asylum-Products-ebook/dp/B000OZ0N62/  
\[24\]: http://babich.biz/how-to-use-animation-to-improve-ux/  
\[25\]: https://medium.com/@pasql/transitional-interfaces-926eb80d64e3\#.igcwawszz  
\[26\]: https://medium.com/u/56e8cba02b  
\[27\]: https://www.amazon.com/Soft-Skills-software-developers-manual/dp/1617292397/  
\[28\]: https://www.amazon.com/Clean-Coder-Conduct-Professional-Programmers/dp/0137081073/  
\[29\]: https://www.amazon.com/Start-No-Negotiating-Tools-that-ebook/dp/B003EY7JEE/  
\[30\]: https://www.amazon.com/gp/product/0060891548/  
\[31\]: https://www.amazon.com/Elements-Style-4th-William-Strunk/dp/0205313426/  
\[32\]: http://www.economist.com/blogs/prospero/2013/07/george-orwell-writing  
\[33\]: http://maximilyahov.ru/glvrd-pro/  
\[34\]: https://www.coursera.org/specializations/algorithms  
\[35\]: https://medium.com/u/54bcbf647830  
\[36\]: https://signalvnoise.com/posts/3375-the-five-programming-books-that-meant-most-to-me  
\[37\]: http://GHLandy.com  
\[38\]: https://medium.freecodecamp.com/@sapegin  
\[39\]: https://github.com/GHLandy  
\[40\]: https://github.com/bestony  
\[41\]: https://github.com/LCTT/TranslateProject  
\[42\]: https://linux.cn/article-8183-1.html?utm\_source=rss&utm\_medium=rss

[090049y9y99imzi9w9cyld.jpeg]: https://dn-linuxcn.qbox.me/data/attachment/album/201702/08/090049y9y99imzi9w9cyld.jpeg
[Link 1]: https://www.amazon.com/gp/product/0596802293/
[Link 2]: https://www.amazon.com/Clean-Code-Handbook-Software-Craftsmanship/dp/0132350882/
[Link 3]: https://www.amazon.com/Code-Complete-Practical-Handbook-Construction/dp/0735619670/
[090110m49qkzziwfgzbezj.jpeg]: https://dn-linuxcn.qbox.me/data/attachment/album/201702/08/090110m49qkzziwfgzbezj.jpeg
[Kyle Simpson]: https://medium.com/u/5dccb9bb4625
[JavaScript]: https://github.com/getify/You-Dont-Know-JS
[Eric Elliott]: https://medium.com/u/c359511de780
[2017 _JavaScript]: https://medium.com/javascript-scene/top-javascript-frameworks-topics-to-learn-in-2017-700a397b711#.zhnbn4rvg
[Henrique Alves]: https://medium.com/u/b6c3841651ac
[Link 4]: http://alves.im/blog/before-dive-into-react.html
[JavaScript 1]: https://bocoup.com/weblog/javascript-developers-watch-your-language
[JavaScript 2]: https://github.com/getify/Functional-Light-JS
[Link 5]: https://github.com/MostlyAdequate/mostly-adequate-guide
[Link 6]: https://egghead.io/courses/professor-frisby-introduces-composable-functional-javascript
[090130vwwmxx761bbdwrrr.jpeg]: https://dn-linuxcn.qbox.me/data/attachment/album/201702/08/090130vwwmxx761bbdwrrr.jpeg
[David Kadavy]: https://medium.com/u/5377a93ef640
[Link 7]: https://www.amazon.com/Design-Hackers-Reverse-Engineering-Beauty-ebook/dp/B005J578EW
[Link 8]: http://designforhackers.com/
[Tracy Osborn]: https://medium.com/u/e611097a5bd4
[Link 9]: https://youtu.be/ZbrzdMaumNk
[Nathan Barry]: https://medium.com/u/ac3090433602
[Web]: http://nathanbarry.com/webapps/
[Jason Santa Maria]: https://medium.com/u/8eddcb9e4ac4
[Web 1]: https://abookapart.com/products/on-web-typography
[Link 10]: https://www.amazon.com/Inmates-Are-Running-Asylum-Products-ebook/dp/B000OZ0N62/
[UX]: http://babich.biz/how-to-use-animation-to-improve-ux/
[Link 11]: https://medium.com/@pasql/transitional-interfaces-926eb80d64e3#.igcwawszz
[John Sonmez]: https://medium.com/u/56e8cba02b
[Link 12]: https://www.amazon.com/Soft-Skills-software-developers-manual/dp/1617292397/
[Link 13]: https://www.amazon.com/Clean-Coder-Conduct-Professional-Programmers/dp/0137081073/
[Link 14]: https://www.amazon.com/Start-No-Negotiating-Tools-that-ebook/dp/B003EY7JEE/
[090152u00pcdprrz67trhr.jpeg]: https://dn-linuxcn.qbox.me/data/attachment/album/201702/08/090152u00pcdprrz67trhr.jpeg
[Link 15]: https://www.amazon.com/gp/product/0060891548/
[Link 16]: https://www.amazon.com/Elements-Style-4th-William-Strunk/dp/0205313426/
[Link 17]: http://www.economist.com/blogs/prospero/2013/07/george-orwell-writing
[Glavred]: http://maximilyahov.ru/glvrd-pro/
[Link 18]: https://www.coursera.org/specializations/algorithms
[DHH]: https://medium.com/u/54bcbf647830
[Link 19]: https://signalvnoise.com/posts/3375-the-five-programming-books-that-meant-most-to-me
[GHLandy]: http://ghlandy.com/
[https_medium.freecodecamp.com_what-to-learn-in-2017-if-youre-a-frontend-developer-b6cfef46effd_.ss9xbwrew]: https://medium.freecodecamp.com/what-to-learn-in-2017-if-youre-a-frontend-developer-b6cfef46effd#.ss9xbwrew
[Artem Sapegin]: https://medium.freecodecamp.com/@sapegin
[GHLandy 1]: https://github.com/GHLandy
[bestony]: https://github.com/bestony
[LCTT]: https://github.com/LCTT/TranslateProject
[Linux]: https://linux.cn/article-8183-1.html?utm_source=rss&utm_medium=rss