2018 最值得关注的 JavaScript 趋势 已翻译 100%

如果你在过去的 2017 年有过一连串的规划，那么这篇文章适合你。

2017 年发生了很多事情，我们一直在 X-Team 中仔细观察，并想着如何让 2018 更加富有激情和创新。

你也可以利用这篇文章来帮助你完善 2018 的计划或者让你做出更有创意的计划。

React vs. Vue.js

我们直接上好东西吧：不是有很多人认为 Vue 或许会成为 React 的一大竞争敌手，但是今年想要无视 Vue 是不可能的，在开发者的炒作宣传方面甚至令 Angular 黯然失色。

我们展望随着 Vue 的大肆宣传，在 2018 年即将展开一场为期 2 年的激烈竞争。

React 仍然有着全球最富有公司之一的财政支持，更不用说他们还有极其有才的维护人员。

但是 Vue 做了下面这些让开发者真心高兴的事：

• Vue 轻量，容易学习，有着令人难以置信的工具，有很棒的状态管理和路由内置等。

Vue 的社区当然还没有 React 那么大，但是社区的增长是基于核心团队是否拥有优秀的（团队）代表并倾听社区（建议和意见）（两者都已做到位）。

谈到取悦开发者，不要忘了 Facebook 今年在 BSD+Patents 的收费事件中遭遇到史诗般的失败就为取悦开发者。

我们现在其实已经发展到你一样可以通过 Vue 启动任何项目来让自己生活变得简单的程度，这是他们的核心团队取得的一项令人印象深刻的成就。

这里有一篇今年的文章关于 React、Vue vs Angular。

最终可能会发展成什么样子？Facebook 会做它最擅长的东西：抄袭创新者然后世界继续使用 React 。

如果你是一位拒绝学习 React 的 Angular 开发者，随着 Angular 的机会日渐消亡，Vue 应该迅速成为你职业生涯更好的选项（而且 Vue 的部分语法跟 Angular1 类似）。

每一位 JS 开发者都仍然应该考虑学习 Vue.js ，因为它已经制造了足够大的影响，现在我们开始看到对 Vue.js 开发者的需求出现，这意味着至少在短期内你能够为自己创造一些价值。

Next.js

Next.js ，我们称之为“ React 保险”。

即使 Facebook 永远不会领先在和 Vue 的竞争中领先，并且也不会以同样的动力去创新，但就工具而言，React 和 Next.js 一起使用会让你体验更接近 Vue 的特性，代码分割，路由与状态管理，允许你保留大量的 React 生态系统和支持。

Next 对于在 React 服务器端构建应用程序也特别有用，而且呈增长趋势。

另外，添加 Now.js（由同一个团队创建），你会有一个超级快速的方法来部署你的 React 应用。

由于 Vue 和 React 的 PK 仍在继续，希望看到越来越多的 Next 被 React 采用，使每一个使用 React 框架的人更舒适。

Angular

尽管 Angular 在取悦开发人员方面遇到了越来越大的困难，但它仍将继续成为 2018 年被广泛使用的框架。

很多公司都采用了 Angular 1.0 ，并且随着他们在 2018-2019 年期间希望更好的迁移，他们将把 React 或 Vue.js 视为比 Angular 2 更好的替代方案。

Angular 的其余拥护者认为 Angular 将成为企业首选的 JS 框架，但这一说法尚未得到证实，并且不太可能在 2018 年得到证实。

以下是 2017 年有关 Angular 发生的所有事情。

Reason

Facebook 在生产中使用的任何东西总是值得关注的。

Facebook 现在使用 Reason（使用的是已经成熟的 OCaml 语言编写），用于 Facebook Messenger 网络版，以及其他项目（WhatsApp、Instagram、广告等）。

在 2017 年，他们还发布了为 React 创建绑定的 reason-react ，所以你实际上可以将 Reason 代码编译为惯用的 ReactJS 代码。

所以设想下如果不需要安装 Babel（+各种插件）、Flow 等，而只需要用到 OCaml + Reason（现在支持 React 绑定）的能力。 这是一个亟待爆发的大趋势。

在 JS 领域，2017 年的 Reason 比其他大多数编译语言更受关注（对不起 Elm ，我们仍然爱你），所以它绝对是在 2018 年值得保持关注和使用的。

GraphQL

GraphQL 是 API 的查询语言（想想：REST 的现代变体）。

GraphQL 践行了 2017 年的炒作，因为现在像 Yelp、Spotify、Github、Walmart、NYTimes 等大公司都已拥有基于 GraphQL 的 API 。

其中一些 API 甚至是纯 GraphQL ，没有 REST 选项。简而言之：创新公司正在将他们的放在 GraphQL 之上。

REST 风格的 API 肯定远没有消失，但再次看看初创公司正在转向的趋势，GraphQL 是一个正在风口的选择。

另一方面，像 Falcor 这样的替代品几乎不再被讨论。

如果你想在创新型公司找到工作，现在绝对是开始学习 GraphQL 的时刻了。

Redux, Relay Modern和Apollo

Redux 是 Dan Abramov/Andrew Clark 构建的非常受欢迎的项目，很快便成为 React 中状态管理和数据获取的首选解决方案。

但 GraphQL 真的让 Redux 震惊，尤其是在数据获取方面。

我们现在有 Relay Modern（由 Facebook 创建）和 Apollo （GraphQL 客户端框架），可以让你比使用 Redux 更加有效地获取 GraphQL 数据并传递到 React 应用程序中。

但正如一位开发人员指出的有关 Relay/Apollo/Redux ：

这些框架及其好处不一定是互斥的。实际上，将它们一起使用可以很好地分离在 Web 开发中非常重要的问题。

这意味着你仍然可以同时使用 Redux 和 Relay ，比如使用 Redux 管理本地状态和一些复杂的非服务器状态，然后使用 Relay 用于获取。

但社区渴望某些东西来简化这个处理（到目前为止，唯一的响应来自 Vuex/Vue.js / Apollo 或 Cashay ）。

Storybook

哇~，Storybook 是火于 2017 年的。

Storybook 是定义，开发和测试 UI 组件的环境。

2017 年年初，它几乎快要关停项目，得益于社区的重大成就，于 2017 年中期大受欢迎。这是一个关于如何正确开展开源工作，且值得一读的鼓舞人心的故事。

它非常有用(甚至是有趣)，让你单独地构建和测试 UI 组件。它就像一个能实际为开发者提供价值的活生生的 UI 风格指南。

你可能已经遇到过一个使用 Storybook 的开源项目，但如果想自己看看它是怎么用的话，请查看用 Storybook 设计的 Airbnb 日期选择器吧。

如果你想作为一个在 2018 脱颖而出的开发者，那就在面试的时候用 Storybook 展示你最新的项目吧。

额外提示：建议你也看看 react-bluekit，这是替代 Storybook 的，Netflix 的团队用它来设计他们的组件库。

Prettier

正如其名, Prettier 是一个代码格式化工具，可以使你的代码更具可读性，并且看起来也更漂亮。

foo(reallyLongArg(), omgSoManyParameters(), IShouldRefactorThis(), isThereSeriouslyAnotherOne());

能变成这样…

foo(
 reallyLongArg(),
 omgSoManyParameters(),
 IShouldRefactorThis(),
 isThereSeriouslyAnotherOne()
);

在 Github 上有超过 18000 个 Star, 开发者们都喜爱这个简单且极具价值的工具。

它同时也已被许多其它的你兴许很喜爱的项目所运用，比方说 Webpack、React、Next.js、Babel 等等。

还是一样，你甚至不需要去安装这个东西就可以成为一名 Go 语言开发者。

Jest 和 Enzyme

当遇到要进行 JavaScript 测试的时候, Jest 一定是首选, 而在构建 React 应用的时候，搭配使用 Enzyme 就是绝配啦。

你可以在这儿看到, Jest 的下载量已经主宰了 Jasmine。

Jest 的快照功能在 2017 年获得了真正的腾飞, 使得用它来处理测试问题能减少很多痛苦。你可以观看 React Conf 2017 来完完全全地了解它。

Enzyme, 它是由 Airbnb 的工程师团队创建的，是一个用来测试 React 组件的 JavaScript 库。它在 Github 上的 Star 数从 2016 年起疯涨到了 12,000。

Jest 的镜像 + Enzyme 超级简单的 API ，用来测试 React 组件，就是一对超强组合，在 2018 也会继续引领潮流。