传智汇

传智播客旗下IT互联网精英社区

作者 | Marty Jacobs

译者 | 苏本如

责编 | 仲培艺

本文经授权转自公众号CSDN（ID：CSDNnews）

如今，前端开发需要的不仅仅是用户体验的设计技能，开发直观的界面还需要高水平的编程能力。公司正在争相引入新的框架和概念，对前端开发人员的技能要求也因此越来越复杂。本文将重点介绍2019年作为前端开发人员所需的主要技能。

CS 基础知识

建议从掌握 CS（Computer Science，计算机科学）基础知识开始，这意味着对互联网、编码、网络技术、算法和基础问题的解决技能的了解，这些技能在前端开发时不可或缺。可以通过大学 CS 类的学位课程获取，也可以自学掌握，再常见的就是通过 CS 技能相关的训练营来获得。

HTML5/CSS3/JavaScript

HTML5、CSS3 和 JavaScript 是所有前端开发职位的必备技能。这些技能让你作为前端开发人员可以读写基本的网页，设置它们的样式（使用CSS），同时还能使用 JavaScript 添加动态行为/存储信息。

REST

REST（Represential State Transfer，表征状态转移）是实现 Web 服务的另一种方法。它的基本思路是将网络上的任何一个实体都视为一个资源，每个资源都由一个唯一的统一资源标识符（URI）标识。以下面两个 URI 为例： 

• http://mywebservice.com/australia/ 将返回澳大利亚所有州、城市和郊区的完整列表

• http://mywebservice.com/australia/queensland/ 将返回一个过滤后的列表，只显示昆士兰州的城市和郊区。

同样，这个 URI 是获取美国最近一次地震的 API 端点：http://api.geonames.org/earthquakesJSON?north=44.1&south=-9.9&east=-22.4&west=55.2&username=demo

这是一个实时的 REST 服务，当你在浏览器中单击这个链接，它将在页面上显示一段文本信息，内容是最近发生的一次地震（可能仅包括美国范围）。这个 REST 返回的数据是 JSON 格式，并显示在页面上。返回的 JSON 数据可以按照你应用程序的要求进行处理，并以你期望的任何方式显示出来。

需要注意的另一点是，REST 是无状态的。这意味着，当你访问上面链接的地震数据时，它返回的是这个资源的最新状态（即最近的数据）。你可以出去散一会儿步再回来，如果在此期间发生了新地震。那么再去访问这个链接的时候数据已经更新了，你再也无法访问散步前的数据。

下面列出 REST 的一些好处：

• 轻量级

• 可扩展，支持大数量的请求

• 可靠，无单点故障

SOAP

SOAP（Simple Object Access Protocol，简单对象访问协议）被设计来交换基于 XML 格式的“结构化信息”。它通过传输协议进行数据交换（消息内容独立于传输方法）。举个例子，一个 Web Service 提供者想要发布一个 Service，这个 Service 包括一个简单的可以被任意访问的 note，他们就会把这个 note 封装成 XML 格式：

然后对上述数据进行 SOAP 封装，封装后的 SOAP 消息体将包括下面的元素：

• Enveloper 元素：将 XML 文档标识为一条 SOAP 消息

• Header 元素：包含头部信息

• Body 元素：包含所有的调用和响应信息

• Fault 元素：用于错误处理

一旦这些元素被添加，SOAP 消息体就构造出来了，你就可以创建 Service 函数，例如 getNote()，然后通过更新 WSDL，将你创建的 Service 发布到 Web Service 库中，就如向电话簿添加电话号码一般进行更新，很方便。现在更新完 WSDL，Web Service 也可以被找到了。接着 Web Service 的使用者们就可以在他的应用中通过调用 getNote() 来使用这个Service，他们会收到一个 SOAP 响应，内含他们请求的 note。

SOAP 的优点：

• 平台无关、语言无关、传输无关

• 内置错误处理

• 使用某些产品时的自动化

React/Angular/Vue.js

React、Angular 和 Vue 都是用于编写用户界面的基于组件的 JavaScript 框架。它们允许灵活地与 API 交互，进行运算及在 Web 应用的前端显示各种形式的媒体。

这篇文章给出了基于组件的用户界面开发广受热捧的 6 大原因：

https://www.tandemseven.com/technology/6-reasons-component-based-ui-development/

Web 服务器编程

Web 服务器编程是指所有代码运行于服务器端的编程。一个基本的示例通常包含用户向服务器发出 HTTP 请求，然后服务器将内容返回到用户界面。想想看，好像所有动作都发生在后台。

Node.js 也被称为服务器端的 JavaScript，它运行在 JavaScript 引擎上，使用事件驱动和非阻塞 I/O 模型。Node.js 是我们推荐的 Web 服务器编程语言，因为它有世界上最大的库集合之一，我们称之为 Node package manager（NPM）。Node.js 开发社区分布全球，贡献了大量免费且功能丰富的 Library。这个快速的框架是一个轻量级框架，允许中间件响应 HTTP请求。它还具有路由表功能，方便开发人员指定 HTTP 方法和 URL。这个快速框架还是开发 API endpoint 的理想选择，它允许开发人员轻松、高效地构造 endpoint。

Node.js 是经过深思熟虑的选择，不仅因其功能丰富，更因为它是最适合构建可扩展系统的框架，使项目移交更便捷。因为它与 JavaScript 同源，所以也很容易理解。现在主要的云平台，如 AWS、Azure 和 GCP 都支持 Node.js。

版本控制（Git）

作为前端开发人员，你所编写的代码可能只是整个项目的小部分。版本控制有助于维护你手头正在做的项目代码，而不会破坏整个项目，保证了其他开发人员可以在同一项目上工作。现在大多数公司都推荐使用 Git 作为他们的主要版本控制系统。

这里我不会告诉你如何设计一个网页、应该使用什么颜色、它看起来应该怎样等等。我要说的是你不要做什么：

网页设计的“5 不要”：

• 不要使用没有对比度的颜色

• 不要让网页有太多东西

• 不要让网页太慢

• 不要有无关的内容，比如在一个园艺博客网站上出现健身内容。

• 不要停止改进

以 Zero Equals False 的网站为例，它只使用白色背景和黑色文本，几乎没有其他内容。由于网页上只有文本，它加载时间很短，在 5 秒内就能完成，提供了最优的用户体验。

简约设计是一个基于现实考量的设计原则，想想苹果公司和他们的产品。他们的整个品牌都建立在简约的基础上。人类喜欢简单，所以为什么不去做简单的事情，而是重新造明轮子呢？

总结

前端开发人员的角色已经转变，现在它不仅需要用户界面/用户体验技能，而且需要更多的编程技能。如果你掌握了版本控制、服务器端编程、HTML/CSS/JavaScript、基于组件的 JS 框架、Web 服务（如 SOAP 和 REST）等技能和知识，你就打下了良好的计算机科学基础，也将有机会获得成功。

希望本文对你帮助！

原文：

https://www.zeroequalsfalse.press/2019/01/10/frontend/

你点的每个赞，我都认真当成了喜欢