[译] 写给“老派” Web 开发者的“现代” JavaScript 指南

本文讲的是[译] 写给“老派” Web 开发者的“现代” JavaScript 指南,


用 JavaScript 学习 JavaScript。图片来自 learnyounode

有这样一种守旧的后端 web 开发者,他们很久以前就掌握了诸如 Perl 、Python、PHP 或 Java Server Pages 一类的东西,甚至还掌握了 Rails 或者 Django。他们使用巨大的关系型数据库构建 JSON API 服务,呃甚至是 XML。

他是个后端开发者, 因此对他而言,JavaScript 一直只是个可以添加一些前端花招,使网页上的东西变色的有趣小玩具。如果说 JavaScript 真的很有用,那也不过是给表单添加验证,以防止错误的数据进入数据库。八年前 jQuery 让这个人十分震惊。JavaScript 本身依然是可以被容忍但从未被接纳的语言。

随后 JavaScript 及其现代框架侵蚀了后端、前端和他们之间的一切,对于 JavaScript 开发者而言,2017年正是重新成为一个全新 web 开发者的时刻。

Hi.我是一个正在学习现代 JavaScript 的“老派” web 开发者。我才刚刚起步玩得也还算尽兴,当然也踩了一些坑。有一些现代 JavaScript 的概念我希望我能在开始学习之前就融会贯通。

在旧编程语言的惯性思维模式之上学习一个新的生态系统,我在心态和期望方面得做下面一些改变。

转移目标 (.jS)

现代 JS 的特点就是朝气蓬勃和发展迅速,所以很容易就选择了过时的框架、模板引擎、构建工具、 教程或者已经不是最佳实践的技术。(如果真有一个被广泛接受的最佳实践的概念的话)

这种情况下,就有必要向你身边的 JavaScript 工程师朋友伸手求助了,和他们聊一聊你的技术路线。我很荣幸在 Postlight 得到了工程师朋友(特别是 Jeremy Mack)的精湛指导,感谢他们容忍我无穷无尽的问题。

我要说的是,学习现代的 JavaScript 需要人为干预。事物还在不断发展变化,各种教程尚未成熟和定型,所谓最佳实践也未形成正式规范。如果你身边没有大牛,那么至少也得检查 Medium 上文章或教程的日期,或 GitHub 仓库的最近一次提交时间。如果时间超过了一年,基本上可以确定已经过时。

新的问题,而不是已经确定的解决方案

走类似这样的路线:当你在学习现代 JavaScript 时,你遇到的问题的解决方案还在渐渐得到解决,这正是一个好机会。事实上,很可能仅仅差一次 code review,你在使用这个包时就可以修复问题。

当你在使用一种像 PHP 这样的古老的语言的时候,你可以 Google 一个提问或者问题,几乎百分之百能找到一个 5 年前的 Stack Overflow 回答来解决它,或者你能在(详尽的、大量评论的、无与伦比的)文档里找到整个描述。

现代 JavaScript 就并非如此了。 我曾经徜徉在 GitHub issues 和源码的时候不止一次找到的都是一些过时的文档。剖析 GitHub 版本库是学习和使用各种包的一部分,而且对于我这样的“老派人”,差之毫厘的学习总是令人迷惑。

工具过载

在 2017 年学习 JavaScript 还有另一个不一样的地方:创建程序花费的时间感觉和写应用的时间一样多。需要以“正确的方式”去做的工具、插件、软件包和依赖以及编辑器配置和构建配置所需的绝对数量足以使你在启动项目之前望而却步。

Markdown

不要因此止步不前。我不得不放手去做,从起步到正确配置,允许自己的不完美甚至一些业余,只为舒适地使用自己的工具。(我不会告诉你我曾用 nodemon 做代码检查)随后我会找到更好的方法并且在每个新项目中纳入进来。

这方面 JS 还有大量的工作要做。现代 JavaScript 领域依然是不断变化的,但我一个现代 JS 工程师亲友告诉我,这份来自 Jonathan Verrecchia 的教程是目前构建一个当代 JavaScript 栈的不二之选。对,就是现在。

Markdown

教程 / 项目 / 舍弃 / 重复

无论学习什么语言都要经历写代码 - 舍弃 - 写更多代码这个过程。我的现代 JavaScript 学习经历已经成为一个个教程组成的阶梯,然后做一个小巧简单的项目,期间总结出现的疑问和困惑列出清单。然后和我的同事碰头以获得答案和解释,然后刷更多的教程,然后做一个稍微大一些的项目,更多的问题,再碰头,如此重复。

这是迄今为止我在这个过程中经历过的一些研讨会和教程的不完整列表。

  • HOW-TO-NPM —— npm 是 JavaScript 的包管理器。即使在学习这个教程之前我已经敲打过上千次 “npm install”,但是知道学完这个我才知道 npm 做的所有事情。(在很多项目中我已经转移使用 yarn,而不是 npm,但所有的概念都是相通的)

npm i -g how-to-npm

  • learnyounode——我打算专注于服务端 JavaScript,因为那有令我安逸的东西,那就是 Node.js。Learnyounode 是一个交互式教程,结构上类似 how-to-npm。
  • expressworks —— 和前面两个项目类似,Expressworks 是 Express.js 的介绍,一个 Node.js 的 web 框架。在 Postlight 公司 Express 没有得到广泛使用,但对于初学者,它值得学习去上手构建一个简单的 web 应用。
  • 现在是时候做点真东西了。我发现 Tomomi Imura 的一篇教程 Creating a Slack Command Bot from Scratch with Node.js 已经可以学到足够的 Node 和 Express 的新技能来应对工作。因为我专注于后端,使用 Slack 创建一个 “/” 命令是一个很好的开始,因为没有前端演示(Slack 帮你做好了)
  • 在构建这个命令的过程中,我不使用演练中所推荐的 ngrok 或者 Heroku,而是使用 Zeit Now,这是任何人可用的、创建快速一次性的 JS 应用的宝贵工具。
  • 一旦开始写真正意义的代码,我也开始掉下工具无底洞了,安装 Sublime 插件,获取正确的 Node 版本,配置 ESLint,使用 Airbnb 的代码规范 (Postlight 公司的偏好) —— 这些事情拖了我的后退,但也都是有价值的初始化投资。对于这方面我还在坑里,例如 Webpack 对我来说依然美妙又神秘,不过这个视频是个很不错的介绍.
  • 某些时候 JS 的异步执行(特别是回调地狱)开始困扰我,Promise It Won’t Hurt 是另一个教你怎样使用 Promise 书写优雅异步逻辑的教程。Promise 是用于解决异步执行的 JS 新概念。说实话 Promise 令我耳目一新,他们是巧妙的范式转变。感谢 Mariko Kosaka,现在我每次买汉堡的时候都能想起这些。

burger.resolve() — 图片来自 The Promise of a Burger Party.

我知道在这会陷入各种各样的麻烦,比如尝试使用 Jest 测试,使用 Botkit 让 Slack 机器人更有趣,使用 Serverless 真正打破函数式编程的价值。如果你不知道这些是什么意思,其实也没关系。这是一个大世界,我们都有属于自己的路要走。

“首先做,然后做对,然后做得更好.”

最后这件最重要的事我一定要提起:不断去做就是学习的过程,做得很糟糕?那也是学习的过程。

这年头学习现代 JavaScript 感觉就像是在不知所以然得做无用功。当你在想有这么多时间搬搬砖不是更好吗的时候,Google 的 Addy Osmani 有个不错的建议

我鼓励人们采用这种方法来跟上 JavaScript 生态系统:首先做,然后做对,然后才是做得更好. […]

掌握任何新技能的基本要求都需要时间,实践和技巧。如果不使用每日一库或者响应式学习,容易产生挫败感。学会正确使用 Babel 和 React 花费了我数周时间,学习 Isomorphic JS,WebPack 和其他所有相关的库花了更多的时间。 简简单单地开始并且从基础做起就好.

这里感谢 NodeSchool 和 Free Code Camp,帮助初学者学习 JavaScript 的两个神奇的网站.





原文发布时间为:2017年4月11日


本文来自合作伙伴掘金,了解相关信息可以关注掘金网站。

时间: 2024-08-01 17:28:06

[译] 写给“老派” Web 开发者的“现代” JavaScript 指南的相关文章

[译] Web 开发者安全清单

本文讲的是[译] Web 开发者安全清单, 原文地址:Web Developer Security Checklist 原文作者:Michael O'Brien 译文出自:掘金翻译计划 译者: GangsterHyj 校对者: zaraguo, yzgyyang Web 开发者安全清单 开发安全.健壮的云端 web 应用程序是非常困难的事情.如果你认为这很容易,要么你过着更高级的生活,要么你还正走向痛苦觉醒的路上. 倘若你已经接受 MVP(最简可行产品) 的开发理念,并且相信能在一个月内创造既有

优秀Web开发者提升开发能力必知的10件事

"开发工作不仅仅只是写代码"这句话来自3EV网站的Dan Frost,他在一篇文章中阐述了开发过程中应该注意的一些事项.原文内容如下: 开发者是创造数字世界的主力军,他们不应该只扮演编程工具的角色,而应该对开发工作有更高的要求.那么,开发者可以从哪些方面提高开发能力呢?下面我就谈一下我的想法.我的建议可能不全面,但希望能够给你带来一些帮助. 1. 不要只盯着代码 如今人人都会写代码.很多业余爱好者也可以搭建网站.编写应用程序,编程已经不再稀奇. 随着网络的普及,许多人只需通过自学就会编

WEB 开发者应该有哪些必备的技能?

WEB 开发者应该有哪些必备的技能? WEB开发本身涵盖了许多领域的许多技术,那么,有哪些是WEB开发者必备的技能呢?这是一个 Quora 上用户提出的问题,其中Ellyse Taylor的回答获得了1900+的赞同. 可能很多人对下面这个列表中的大部分内容都已经了解了,但其中必定有一些是你之前没有看到过,或者没有完全理解的,甚至有些你可能从来没听说过. 1. 界面和用户体验 注意,浏览器的实现标准是不一致的,请确保你的网站能够兼容所有主流的浏览器.最少需要测试的有 Gecko 引擎(Firef

web开发者不可错过的11个JavaScript工具

JavaScript即将接管Web世界,如雨后春笋版冒出的JavaScript工具更是让web开发者无所适从. 本文我们为大家推荐11款崭露头角但功能强大的JavaScript工具,是追逐web设计新潮流(界面简洁.面向移动.强调互动)中不可或缺的好帮手. 一.Meteor Meteor web应用开发框架定义的七大开发天条为现代软件开发打下良好基础,例如Meteor采用开源社区的方式培育插件资源,其他天条还包括:设计简单的API.仅通过网络传送数据.使用统一的开发语言等.Meteor还开发了一

41个Web开发者必须收藏的JavaScript实用技巧_javascript技巧

Web开发者必须收藏的JavaScript实用技巧,供大家参考,具体内容如下 1. 将彻底屏蔽鼠标右键 oncontextmenu="window.event.returnValue=false" < table border oncontextmenu=return(false)>< td>no< /table> 可用于 Table 2. 取消选取.防止复制 < body onselectstart="return false&qu

10件优秀Web开发者必须知道的事

"开发工作并不仅仅只是写代码而已"这句话是来自3EV网站的Dan Frost,而他在一篇文章中阐述了在开发过程中应该注意的一些事项.而原文内容如下: 开发者是创造数字世界的主力军,他们不应该仅仅只是扮演编程工具的角色,而应该对开发工作有着更高的要求.那么,开发者可以从哪些方面来提高自己的开发能力呢?下面,我就来谈一下我的想法.我的建议可能并不是全面的,但是我希望能够给你带来一些帮助. 1. 不要只盯着代码 在如今这个社会,人人都会写代码.而很多业余爱好者也可以去搭建网站.编写自己的应用

每一个web开发者都应该了解的HTTP/2

自从我写了上一篇博文之后,就再也找不到空闲时间写文章了.今天我终于可以抽出时间写一些关于 HTTP 的东西. 我认为每一个 web 开发者都应该对这个支撑了整个 Web 世界的 HTTP 协议有所了解,这样才能帮助你更好的完成开发任务. 在这篇文章中,我将讨论什么是 HTTP,它是怎么产生的,它的地位,以及我们应该怎么使用它. HTTP 是什么 首先我们要明白 HTTP 是什么.HTTP 是一个基于 TCP/IP 的应用层通信协议,它是客户端和服务端在互联网互相通讯的标准.它定义了内容是如何通过

[深度好文]想成为一个高效的Web开发者吗?来看看大牛分享的经验吧~外加一些自己的理解

前言: 无意间浏览到此篇文章,发现这篇文章无论是对于新手程序员,还是学过几年的程序员,都是挺有帮助的.于是,在此分享,后面也有我自己的一些理解,希望能帮到更多的朋友. 作为一个软(ku)件(bi)工(de)程(ma)师(nong),你有没有觉得做什么事都没时间?没时间学习新东西,没时间去回顾.整理原来写的烂代码,没时间写单元测试,没时间给接管你项目的家伙写文档,没时间思考,没时间喘气,没!时!间! 额--如果你肯花点时间看看这篇文章,我相信你会明白应该把时间花在哪. 我曾以为成为一个技术大牛的唯

WEB 开发者应该具备的 6 大技能?

WEB开发本身涵盖了许多领域的许多技术,那么,有哪些是WEB开发者必备的技能呢?这是一个 Quora 上用户提出的问题,其中Ellyse Taylor的回答获得了1900+的赞同. 可能很多人对下面这个列表中的大部分内容都已经了解了,但其中必定有一些是你之前没有看到过,或者没有完全理解的,甚至有些你可能从来没听说过. 1. 界面和用户体验 注意,浏览器的实现标准是不一致的,请确保你的网站能够兼容所有主流的浏览器.最少需要测试的有 Gecko 引擎 (Firefox),WebKit引擎(Safar