RomeoMo

种一棵树最好的时间是十年前，而后是现在

发表于 分类于

说明：这个系列来源于 Fun Fun Function 函数式编程系列视频，以《JavaScript函数式编程指南》和 《Hands-On Functional Programming with TypeScript》 等函数式书籍，加上在工作中总结的经验完成此系列。

注： 此系列文章的参考资料，是对文章的扩展及补充，请擅加利用。

总论

函数式编程是声明式编程的一种实践，声明式编程目标是将程序的描述与求值分离开来。

“To have a deep understanding of functional programs as a data transform pipeline, you need a way to define your data structures.”

(摘自 《Hands-On Functional Programming with TypeScript》 )

目录

  1. Map, ForEach 及 Filter, Reduce
  2. 纯函数（Pure Function）
  3. 闭包和柯里化

参考资料

  1. Fun Fun Function 函数式编程视频(需翻墙)
  2. 《JavaScript函数式编程指南》
  3. 《Hands-On Functional Programming with TypeScript》
  4. 《Professor Frisby’s Mostly Adequate Guide to Functional Programming》

发表于 分类于

说明： 本文来自Medium，作者：Anoop Raveendran

文章版权属于原网站/原作者。我依旧只是个搬运工+不称职的翻译。

“JavaScript 的异步和单线程是怎样实现的？”简单来说，JavaScript 是单线程的但异步并不是在 JavaScript 中实现的，而是基于浏览器中 JavaScript 内核之上实现的并且通过浏览器 APIs 进行访问。

现在我试着通过两个简单的片段详细解释事件循环。

基础结构

浏览器主要组件概述

  • 堆（Heap）—— 对象存储在堆中，堆表示了内存中一个大的非结构化的区域。
  • 栈（Stack）—— 这个表示了 JavaScript 代码执行时的单线程。函数的调用组成了栈的帧（详情见下面的描述）。
  • 浏览器或是 Web APIs 是在浏览器中实现的，能从浏览器和电脑系统得到数据并且在此基础上执行复杂的事情。这些并不属于 JavaScript 语言本身，而是基于浏览器中 JavaScript 内核之上实现的，为你在使用 JavaScript 代码提供了额外的超能力。 举个栗子🌰，地理位置定位 API 提供了一些简单的 JavaScript 方法来检索位置数据，例如在 Google Map 中标记你的位置。在其背后的实现，浏览器其实是调用了一些复杂的底层代码（比如 C++）和设备的 GPS 硬件（或是任何可以定义位置信息）来获取位置信息，返回到浏览器中并在你的 JavaScript 代码中使用。对开发者来言，这些 API 抽象了复杂度。

片段1：详细解释

现在我们有一个主函数包含了在两个 console.log 语句分别在控制台输出 “A” 和 “C”。在两者之间，有一个等待 0 毫秒的 setTimeOut 打印 “B” 的函数。

执行过程的内部实现

  1. 首先是调用主函数（作为帧）加入到栈中。随后浏览器把 console.log(‘A’) 作为第一条语句加入到栈。这条语句执行完成并且此帧弹出。于是在控制台展示了字母 “A”。
  2. 下一条语句（ 回调为 exec() 且等待0毫秒，执行的setTimeout() ），推入了执行栈（call stack）并开始执行。setTimeout 函数调用的浏览器的 APIs 用于等待执行回调函数。这一帧（使用 setTimeOut）弹出并且完成交由浏览器。
  3. 当浏览器的定时器（timer）执行回调方法 exec() 时，console.log(‘C’) 加入到栈中。在特定的时候，正如延迟 0 毫秒的时候，（理想情况下）一旦浏览器收到回调，这个回调函数加入到消息队列（message queue）。
  4. 当执行完成主函数的最后一个语句时，这个 main() 函数从执行栈弹出，因此执行栈为空。浏览器从队列向执行栈传递数据时，必须执行栈为空作为前提。这就是为什么就算 setTimeout() 的等待时间为 0 毫秒，它的回调 exec() 必须等到执行栈的所有帧完成。
  5. 现在回调函数 exec() 调入到执行栈并开始执行。控制台显示字母 “C”。这就是 JavaScript 的事件循环。

所以在 setTimeout（函数，延迟时间）中的延迟参数，并不是函数延迟执行的准确时间。它代表在此之后某个时间点执行功能的最短等待时间。

片段2：深入理解

深入解释事件循环

  • runWhileLoopForNSeconds() 函数表示的和名字一致。其会不停的检查经过的时间是否等于此函数传入的第二个参数。重要的是记住 while 循环（与其他语言类似）是一个阻塞语句，意味着，它的执行是发生在执行栈中并且不会使用浏览器 APIs。所以它会阻塞后续的语句，直到完成执行。
  • 所以就上方的代码，尽管 setTimeout 只需等待 0 毫秒并且 while 循环执行 3 秒， 回调函数 exec() 语句卡在消息队列 3 秒。直到 3 秒以后 while 循环一直在执行栈中运行（单线程）。在执行栈为空之后，回调函数 exec() 才移动到执行栈并开始执行。
  • 所以 setTimeout() 的等待参数并不保证一定等于执行开始到结束的时间。它是等待部分的最短时间。

参考资料：

  1. 详解JavaScript中的Event Loop（事件循环）机制
  2. JS Event Loop(需翻墙，强烈推荐 12:50~17:20 之间的内容)
  3. JavaScript 事件循环可视化（”JS Event Loop” 演讲示例）

发表于 分类于

说明： 本文来自SitePoint，作者：M. David Green

文章版权属于原网站/原作者。我依旧只是个搬运工+不称职的翻译。

柯里化（Currying），或称为偏函数应用（Partial Application），是函数式编程中会给听起来给更熟悉传统的JavaScript编程的人带来困惑。但只要使用得当，柯里化会让你的函数式JavaScript更加易读。

更易读以及更具有扩展性

函数式JavaScript的一个显而易见的优点是代码量更少、代码内聚更高、代码更少的重复，在代码行更少的情况下，也能输出正确的结果。在不熟悉函数是编程如何实现之前，有时会多花一些时间去阅读理解代码，代码的书写也会变得难以理解。

如果你对柯里化这个词有影响，但从来不知道它的意思，你完全不用担心你曾经认为它是一种陌生或者神奇的技术。其实柯里化是一个相当简单的概念,当处理函数参数，它能处理一些常见的问题，并且为开发者开辟了更多的选择。

什么是柯里化？

简而言之，柯里化是一种允许偏函数应用作为参数组成新的函数。意味着为了获取函数结果，你可以传递函数所需要的所有参数，或者也可以传递一部分参数得到结果作为其余函数的参数。情况就是这么简单。

柯里化是如Haskell和Scala这样的函数式语言的基础。JavaScript具有函数式编写的能力，但柯里化并不实现于其中（至少在目前版本是这样的）。但我们已经知道一些函数式的方法，能让我们能在JavaScript中使用柯里化。

为了给你展现柯里化是如何实现的，我们写了JavaScript中第一个入门的柯里化函数，使用熟悉的方法创建了柯里化函数。我们想通过名字用来打招呼作为例子。我们知道如何通过创造一个简单的、包含使用名字和处理的打招呼的函数，并使用控制台打印名字。

1
2
3
4
5
var greetCurried = function(greeting) {
  return function(name) {
    console.log(greeting + ", " + name);
  };
};

这个函数需要两个参数–名称和方式才能正常的使用。但是我们可以仅通过简单的嵌套柯里化重写此函数，使之基本函数只需要传递方式，返回一个函数用于接受我们任意传递的名称。

第一次柯里化

1
2
3
4
5
6
var greetCurried = function(greeting) {
  return function(name) {
    console.log(greeting + ", " + name);
  };
};

这个小小的改变，让我们创建了一个可为任何类型方式的新函数，并且接受我们任意传递的名称。

1
2
3
var greetHello = greetCurried("Hello");
greetHello("Heidi"); //"Hello, Heidi"
greetHello("Eddie"); //"Hello, Eddie"

我们也可以对原始函数进行柯里化调用，只需要使用左到右的方式从传入参数的集合中分离参数。

1
greetCurried("Hi there")("Howard"); //"Hi there, Howard"

为何不在浏览器中尝试一下此代码呢？

此为JS Bin的链接

全部柯里化！

最酷的是，现在我们学习了可以使用这种方式处理参数用于改变传统函数，我们能对任意数量的参数使用此方法：

1
2
3
4
5
6
7
8
9
10
var greetDeeplyCurried = function(greeting) {
  return function(separator) {
    return function(emphasis) {
      return function(name) {
        console.log(greeting + separator + name + emphasis);
      };
    };
  };
};

我们四个参数的函数和两个参数的函数有同样的灵活度。无论嵌套有多深，我们都可以创造出一个包含任意人数的函数来满足我们的预期：

1
2
3
var greetAwkwardly = greetDeeplyCurried("Hello")("...")("?");
greetAwkwardly("Heidi"); //"Hello...Heidi?"
greetAwkwardly("Eddie"); //"Hello...Eddie?"

此为JS Bin的链接

柯里化传统函数

你能看到这样的尝试非常强大，特别是如果你需要创造一堆具体的函数的情况下。唯一的问题在于语法。一旦写出柯里化的函数，你需要不停地嵌套返回函数，调用每个都包含自有参数变量的新函数。这样会变得相当复杂。

为了解决这个问题，创造出一个包含不用包含所有嵌套返回的现存函数名称的快速和脏的柯里化函数。一个柯里化的函数需要放出参数列表，并且使用它们用于返回原始函数的当前版本。

1
2
3
4
5
6
7
8
9
var curryIt = function(uncurried) {
  var parameters = Array.prototype.slice.call(arguments, 1);
  return function() {
    return uncurried.apply(this, parameters.concat(
      Array.prototype.slice.call(arguments, 0)
    ));
  };
};

为了使用这个，我们设定号存放任何参数数量的函数，和我们初始设定的参数一致。然后我们获得了一个包含等待剩余参数的函数。

1
2
3
4
5
6
7
8
var greeter = function(greeting, separator, emphasis, name) {
  console.log(greeting + separator + name + emphasis);
};
var greetHello = curryIt(greeter, "Hello", ", ", ".");
greetHello("Heidi"); //"Hello, Heidi."
greetHello("Eddie"); //"Hello, Eddie."


和之前一样，我们使用从原始函数中分离出没有限制参数的函数。

1
2
3
4
5

var greetGoodbye = curryIt(greeter, "Goodbye", ", ");
greetGoodbye(".", "Joe"); //"Goodbye, Joe."


此为JS Bin的链接

开始严肃对待柯里化

我们的小柯里化函数并不包括所有情况，比如没有或者可选参数，但是它做的有意义同样严格按照语法传递参数。

以**Ramda**为代表的一些函数式JavaScript库又更灵活的柯里化方式以至于可以用来打破函数所必须的参数，并且可以让你挨个或者组团传递参数用于生成自定义的柯里化参数。如果你想更广泛的柯里化，这个可能是一种方法。

不管你在自己的程序里如何增加柯里化，无论你想使用嵌套参数或者更喜欢健壮的柯里化函数，为当前的柯里化函数提出一个组合化的名称将会让你的代码更具有可读性。每一个参数都需要一个让其具有明确行为以及期望传递的名字。

参数顺序

一个需要注意的是柯里化时参数的顺序。正如我们的描述，你显然希望参数大多数情况下是一个接着一个传递直到原始函数最后一个。

提早思考参数顺序会让你在工作中更容易的使用柯里化。并且思考参数顺序在设计函数大多数情况下都不是坏习惯。

小结

柯里化在函数式编程中是一项难以置信的有用办法。它允许你生成代码少、易于配置且运行稳定的库，同时易于使用，让你的代码更易理解。在实际代码编写时，实现柯里化会让你更容易的在代码中使用偏函数应用，避免有可能产生的重复，并且能让你在命名和处理函数参数时养成良好习惯。

发表于 分类于

传统CSS书写

存在的问题

  1. 就算加了注释,代码也很难维护
  2. 为了保证样式被覆盖,CSS的权重可能会变得非常⾼

Sass方式书写

何为Sass？

Sass是CSS的预处理程序，其思想是用一种专门的编程语言，进行网页样式设计，然后再编译成正常的CSS文件。同样也有Less，Stylus等其他预处理程序，而本人在平常中没有实践过其他预处理程序，所以在此按下不表。SCSS实现了Sass的所有功能，并且有类似于css的句法，所以在工作中，我更偏爱SCSS。

存在的问题

使用SCSS容易造成嵌套层级过多，导致 CSS 权重过高的问题。大漠在知乎上的回答写着**“别让你的嵌套层级超过四层”**，而腾讯的AlloyTeam在Code Guide上写着”嵌套最多不能超过5层“。为了减少嵌套层级，我认为解决方法为：提取公因式。

提取公因式就是把相同表现类似的css用同一个class表示，而独特表现的元素单独写。要熟练使用此方法需要透彻了解css的权重。

使用Compass

在使用SCSS中，最实用的是[@mixin](http://sass-lang.com/guide#topic-6 “Mixins”), 类似于c语言中的宏，使用@mixin能大大提升写代码的效率。

在平常工作中，特别是在使用css3时需要注意浏览器前缀问题。如果不想手写 CSS3 的浏览器前缀，想让工具生成这些属性，那Compass 就是一个很好的选择。

关于Compass应该知道的知识

Compass是Sass的一种工具库（toolkit），引用阮一峰博客上的一句话：“Sass是一种”CSS预处理器”，可以让CSS的开发变得简单和可维护。但是，只有搭配Compass，它才能显出真正的威力”。

Compass主要分为七部分

  1. reset(normalize)*：重写浏览器的默认样式
  2. layout：⻚面布局
  3. CSS3：跨浏览器的CSS3**（使用最为频繁）**
  4. typography：文本样式
  5. helper：类似于Sass语法的，一系列函数,
  6. utilities:除去以上5点的其他工具,多为@mixin
  7. Browser Support：浏览器支持，直接决定了以上6点的表现

PS：reset与Normalize的区别：reset是“暴力”的重写浏览器默认样式。而Normalize分为8个部分进行重写，分别为：base, html5, links, typography, embeds, groups, forms以及tables。Normalize可以整体引入也可以分开引入。所以是使用reset还是Normalize，就看各位看官了（本人更偏向于Normalize）。

使用SCSS+Compass的总结

优点

CSS 权重尽可能低，容易修改、覆盖。加上适当注释后，更容易阅读代码
不⽤担⼼ CSS3 兼容性问题，直接配置解决

缺点

从 CSS 到 SCSS，再到 Compass, 难度逐渐增加。

发表于 分类于

**说明：**本文来自SitePoint，作者：Tim Evko

文章版权属于原网站/原作者。我依旧只是个搬运工+不称职的翻译。

Web开发者是由多种职位构成的。你可以是前端开发者，用户体验设计师，软件工程师，或者是后端开发者。如果这样说太笼统了，你也可以自称为JavaScript 专家，Bootstrap 开发者甚至是Node 明星。 在Web开发中包含着无止境（甚至是奇怪）的职位名称。那么，为何会有这么多职位的存在？它们的存在是由于在建设Web时某个职位只能做很少的事情。过去在前端和后端开发者之间有着一条明显的分界线。同样这些种类也有自己的分支。前端开发者专长于CSS或者工作在基于UI设计的JavaScript，然而后端开发者专注Ruby或者其他语言。这样在Web开发者中产生了很多争论。如果你想在领域中取得成绩，你应该专注于那些方面？需要专注所有方面吗？需要成为在前端和后端环境都突出的全栈开发者，还是杰出于在某个方面？

雇主的要求

我认为真正的问题在于单一类型的开发者是否更容易雇佣。基于这种想法，有意义的回顾一下以及试图找出当前雇主的要求。

随着Web发展，雇主希望熟悉于更多技术和框架的开发者。这是由于站点变的越来越变幻莫测，并且在原生应用以及浏览器应用的程序之间的分界逐渐模糊。正如我工作的公司，越来越多的用户要求网站胜任现代的Web应用，而不仅仅是单传的静态站点。

那些主要以静态为主的网站，其在持续减少对Web开发者的需要。事实上，其中几个公司的产品能符合建立静态站点商城的需求，使客户能够创建自己的网站,而自己无需编写一行代码。WordPress.com、Squarespace，和Wix，这些都能降低成本，每个平台都有简单的学习曲线和普通的UI。不要求编程能力。

然而我不认为这些站点能在商业上使用，我很确定它们降低了HTML，CSS和JavaScript 能力的价值，同样我认为雇主开始意识到这个问题。他们开始寻找懂得整个架构的更全面和更有经验的开发者，从下拉菜单样式到部署服务器。

然而，我不认为真正的全栈开发者是实际存在的，我相信了解整个架构的开发者更容易被雇佣。而这并不意味着你需要知道Web开发的方方面面。取而代之的是，我认为应该有清单能让每个开发者开发的去学习，并且随着时间逐渐提高。

清单

Javascript Jabber 最近放出的播客就是专注于这个话题。他们列出了大量的技术要求Web开发者应该知道的。我总结了一下最重要的技能列表如下。

  • HTML, CSS, Javascript
  • 一门后端语言
  • 版本控制
  • 命令行使用
  • Node/Ruby 工具
  • 客户端MVC框架
  • 流行的工具和框架，例如Angular，Laravel，Rails等
  • 数据库知识
  • 服务器知识
  • 站点部署策略
  • 搭建和使用REST API
  • 响应式Web开发
  • 易用性
  • 代码测试

这有另外一张Louis Lazaris的清单。虽然有一些年份了，但其中很多技术现在依然很常用。

不要害怕

看到表中列的技术，你应该开始意识到，最基本的，应该听过它们之间的绝大多数。 此外，没有人能精通每个Web开发工具或者技术。反而，我们应该开放的去学习Web开发，尽可能的知道更多的技术和工具。

还有记住普遍水平的了解技术就已经很好了。比如开发者能熟练运用复杂的CSS布局，同样也能通过JavaScript 增加一个新的功能。一些公司或者机构由一个开发者写前端代码，另一个写后端。如团队基础的工作流就很好，这能让开发者大致了解其他部分的工作。

总结

以某些具体的工具或者技术为中心的思想会产生不良影响以至于组织技术的提高。随着Web技术的发展，要求Web开发者需要更多的懂得整个架构。我们依然有在特定领域做的更好的自由，但是正如排版变得越发容易以及交互性的更大的需求，基本的前端技能以及应用开发会受到更多的追捧。听到雇主雇佣全栈而不是专业的开发者可能会令人不安，但Andy Shora的结论揭示了这样的状况。

的确，没有人能指望你能从前端到后端，开始到结束只靠一个人完成。同样你也不应该为提这样需求的人工作。如果你熟练五到十种技术/工具，同样也有意愿去了解其他100多种你不熟悉的，那么你就是高价值的商品了。

发表于 分类于

**说明：**本文来自SitePoint，作者：Adam Bretz

文章版权属于原网站/原作者。我依旧只是个搬运工+不称职的翻译。

自从1995年发布以来，JavaScript 有了很大的发展。我们已经看到了ECMAScript 规格的几个重要版本及单页Web应用的崛起，这些都被客户端的JavaScript 架构支持。起初，所有的JavaScript 开发和创新都只能在浏览器实现，这是由于浏览器是支持这种语言的唯一环境。随着时间的推移，Web开发者开始意识到JavaScript 的很多实用的特性（没有块级作用域，事件驱动以及与许多其他语言相似）使其能对其他环境而不仅仅是浏览器。这促使JavaScript 社区进行了第二轮创新最终使JavaScript 运行于服务端和数据库。

突然，了解JavaScript 不会把你自动归类在“前端开发者”中。如果你熟悉这门语言，你能建立服务器和数据库，以及丰富前端用户体验。现在，第一次有了开发者能通过只用JavaScript 就能建立整个Web应用。这种趋势常常被称为“全栈的JavaScript”或“纯JavaScript解决方案”。组合了四种流行的JavaScript 技术：MongoDB, Express, AngularJS, and Node.js 建立Web应用受到欢迎了，这被成为“MEAN 全栈”。

MEAN

  1. MongoDB - MongoDB 是一种NoSQL的数据库。它是一种文件导向数据库管理系统, 而不是由行、列和表格组成的。主要用于存储JSON 数据；这完美契合由JavaScript 编写的应用。数据的关系性操作和严厉遵守图式的缺乏，这使MongoDB 具有快速，伸缩性强及易用的特性。
  2. Express - Express是一种轻量级的服务器级框架，被用来使Node 搭建的Web服务更简单及更强的可维护性。框架的灵活性提供给开发者高度的可定制性以及足够“低端”的用于操作Node 框架。Express 提供简单方式使用路由，cookie管理，静态文件服务和其他HTTP模块用于搭建企业级的服务。
  3. AngularJS - AngularJS 是一种客户端富应用的MVC JavaScript 框架。它可用于建立健壮的和复杂的单页Web应用。双向数据绑定和基于HTML的框架语言。AngularJS 也有称为“命令”的特性允许你拓展HTML的新的属性，甚至是新的元素。AngularJS 同样也经过了高强度的测试，这可能不会成为开发的有趣方面，但这对于AngularJS 来说是重要的并且经常管理客户端代码。最后，AngularJS 提供了协议和最佳实践用于帮助开发者建立客户端的解决方案。
  4. Node - Node 是JavaScript 的运行环境用于建立服务及网络应用。它提供了在客户端的所有JavaScript 的特性并且加入了文件以及网络I/O。Node使用了Google 的V8引擎（同样也用于Google Chrome）用于执行JavaScript 。其同样也是非常活跃的开发者社区和Node 模块的生态系统（Express就是其中一个模块）的基础。与此同时，也有很多其他在客户端的JavaScript 实践，到目前为止，就粉丝和大公司而言都成功采用的。

如果你像我一样都是JavaScript 的粉丝，你应该兴奋于只用JavaScript 就可以建立整个Web应用的前景。MEAN全栈是相当受欢迎的话题，在网络上也有很多如何开始这些技术的信息。事实上，有很多关于这项技术的信息，仅仅是有关“开始”的就可以“令人畏惧”。

译者按

最后作者介绍自己和Colin Ihrig共同编写的“MEAN全栈”书籍 有兴趣的朋友可以关注一下。

正如作者所说，仅仅使用JavaScript 就能建立这个Web应用是一件令人兴奋地事情。

发表于 更新于 分类于

更新

时间：2019年9月18号
说明：更新图片，原文链接链接已失效，更新备用链接

**说明：**本文来自SitePoint，备用链接，作者：George Fekete

文章版权属于原网站/原作者。我依旧只是个搬运工+不称职的翻译。

成为Web开发者进入Web开发领域的门槛依然很低，但Web开发变得越来越复杂。

整个行业的动态特性使需求常常转移到最受欢迎和“下个更好”的工具以及编程语言。

从前开发者只需一种编程语言或者掌握某特定流程的要求已经一去不复返了。现在为了做更棒的事情，开发者需要了解跨领域的大量知识。

全栈工程师意味什么？

全栈指的是工程师能懂得后端及前端的技术。

更详细的说，这意味着开发者能在PHP, HTML,CSS,JavaScript以及它们之间进行工作，并且能把PS的设计转化成前端代码

全栈工程师不需要成为所有领域和技术的大家，因为这几乎不可能。他只需要能在这些技术上掌握的知道即可，但这也是很多事情需要去做。

全栈在2000年和现在意味着什么？

being-full-stack-developer

2000年已经是很久之前了，当时PHP 4.0才发布。是的，4.0。回到当年，一个优秀的开发者知道一些HTML，CSS和一点过程式的PHP，因为直到5.0版本才出现合适的面向对象。

LAMP (Linux – Apache – MySQL – Perl/PHP)框架在那些年处于统治地位，只有很少或根本没有其他选择。在21世纪初，如果有人使用版本控制会被认为不是技术极客就是巫师。但这现在很少能听到了。

所以，我们划分现在全栈工程师需要掌握的关键技术：

系统管理

  1. Linux及基本的shell命令
  2. 云计算：Amazon, Rackspace等
  3. 后台处理：Gearman, Redis
  4. 搜索：Elasticsearch, Sphinx, Solr
  5. 缓存：Varnish, Memcached, APC / OpCache
  6. 监控：Nagios

Linux驱动着绝大多数的网站，这在Web开发上是事实上的操作系统（这里不讨论.NET）。此外，全栈工程师应该知道如何使用云进行工作，Amazon/Rackspace等供应商都提供了API。

搜索在大部分的网站上是必须的部分。开发者需要直到如何建立以及使用如Sphinx或Elasticsearch的搜索服务。

缓存同样很重要，比如Varnish-反向网站快取服务器, Memcached及opcode缓存。全栈工程师需要知道这些是什么及如何使用。

Web开发工具

  1. 版本控制：Git, Mercurial, SVN
  2. 虚拟化：VirtualBox, Vagrant, Docker
  3. 现在，不做版本控制是不能接受的，即便是单人开发也是如此。

使用虚拟化工具,在每个项目的基础使用单独的开发环境是容易获得的，至少在建立VirtualBox和Vagrant是很容易的。

如果你想在Vagrant上进行工作，Ruby和shell的基本命令是必不可很少的。

后端技术

  1. Web服务器：Apache,Nginx
  2. 编程语言：PHP,NodeJS,Ruby
  3. 数据库：MySQL,MongoDB,Cassandra,Redis,SQL/JSON
  4. Apache和Nginx是Web开发的基准。全栈工程师应该知道如何建立这些应用使之服务于网站。

PHP是需要熟练掌握的，NodeJS，Ruby同样也需要掌握。

除了Web服务器和编程语言外，数据库管理也是全栈工程师需要击败的野兽。

全栈工程师需要知道关系型数据库（比如MySQL, PostgreSQL）与非关系型数据库（例如MongoDB, Redis或者Cassandra）的区别，同样也需要知道XML / JSON的语法。

前端语言

  1. HTML / HTML5: Semantic web
  2. CSS / CSS3: LESS, SASS, 媒体查询
  3. JavaScript: jQuery, AngularJS, Knockout, etc.
  4. 浏览器兼容性
  5. 响应式布局
  6. AJAX, JSON, XML, WebSocket

有趣的是，如果你想更好的呈现网站，最好知道浏览器的怪癖。

JavaScript在早些年就是个笑话，但现在发展成为最流行和强大的语言。每天都会有新的方法论和框架提出，MVC， MVVM，MVP，Angular，Knockout， Ember等等。

和HTML，CSS, JavaScript一起，全栈工程师应该知道响应式设计和使用媒体查询进行工作以及CSS预处理程序，例如LESS和SASS。

使用AJAX或WebSockets与后端进行通信也是必须知道的。

设计

  1. 网站设计转换成前端代码
  2. UI
  3. UX

除了前端技术，全栈工程师应该知道根据设计(Photoshop/Illustrator文件)，那些是可以使用HTML/CSS/JavaScript进行转化而那些不能。

开发者可以不了解或者不使用提到的很多技术，比如Ruby或者是特定的Javascript库，但是它们之间都是相连的。

比如，如果你需要知道Ruby命令才能建立Vagrant， 最基本的，比如你想操作DOM元素，jQuery是值得了解的。

移动端技术是另一个值得提到的种类。这是一个充满活力的行业并且接近于Web开发。

  1. iOS
  2. Android
  3. 跨平台：PhoneGap, Appcelerator

现在Web和移动开发的鸿沟依然很大，但这个差距在迅速逐渐缩小。

全栈工程师同样也需要知道这些技术。

成为全栈工程师会更好吗？

成为全栈工程师意味着队新技术抱有开放的态度，对此亲力亲，并且懂得使一个Web应用从概念设计到最终的产品发布。

“全栈工程师”的理念并不意味着在所有游刃有余于所有的技术，毕竟专门化的存在是有原因的。它更像了解不同领域，能够聪明的与团队成员进行交流，并且成为解决方法的资源。

全栈工程师会在未来的Web开发中扮演越来越重要的角色，特别是例如像DevOps之类的开发方法成为软件开发公司必不可少的部分时，代码开发者和管理者,谁负责代码部署和设置的之间的界限会越来越模糊。

发表于 分类于

折腾了半天的hexo(时间肯定大于半天)终于搞定了。本人的博客是自己关于技术、生活，工作等等的感(tu)悟(cao)。所以想看就看，不想看就直接用Command + W 关闭本页面。

0%