网络埋伏纪事的头像

网络埋伏纪事

  • 译文
    48
  • 积分
    4940
  • 粉丝
    5

IT 培训师

最新译文

函数式编程的兴衰(组合软件)

注:这是从头开始学习 JavaScript ES6+ 中函数式编程和组合软件技术的 “组合软件” 系列教程的第一部分。请继续关注。后面会有更多部分出来! 我 6 岁的时候,花了很多时间与最好的哥们一起玩电脑游戏。他家里有一个满是电脑的房间。它们对于我来说是无法抵...

函数式 JavaScript:将方法从对象中解耦

在项目中我一直做的一件事情就是把方法从其对象中解耦。map、filter 以及 reduce 并非是全部,但是它们肯定是首先获得自由的。 解耦方法可以让方法摆脱父对象所施加的限制,同时在表示代码的方式上给了我们更多的自由。 那么这到底是啥玩意呢? 为简便起见,我...

用彩色动画 GIF 大图解释弹性盒工作机制

弹性盒(Flexbox)承诺要将我们从普通 CSS 的罪恶(比如垂直对齐)之中解救出来。 不错,弹性盒确实兑现了这一目标。不过,掌握它的新心智模型可能是个挑战。 所以我们用动画来看看弹性盒的工作机制,这样就可以用它来创建更好的布局。 弹性盒的基本原则是让布局变得灵活而...

理解弹性盒:必知必会

本文将涵盖玩转 CSS 弹性盒模型所需的所有基本概念。文章有点长,请做好准备。 如果你更愿意在一个 PDF 文档中阅读整个教程,这里是下载链接 - 随便下,没有附加条件。 关于弹性盒学习曲线的备注 如下是我很尊重的一个开发者 Philip Roberts 发的一个推...

JavaScript 简史

JavaScript 毋庸置疑是当今最重要的语言之一。Web 的兴起已经把 JavaScript 带到一个前所未有的地步。下面我们来看看 JavaScript 在其短短历史中是如何演变的,以及它在走向何处。请继续读下去! 这一切都开始于九十年代 一切都发生在 199...

2016 年最流行的前端链接

我们每周会给 70,000 多名前端 Web 开发者发送新闻邮件。 因此,我们认为值得回顾一下 2016 年我们发送的所有期刊,并强调一下我们分享的一些最流行的文章。 如下是 2016 年中前端开发者点击最多的文章: 1: Google 的 HTML & C...

用 Electron 创建跨平台桌面应用

今年早些时候,Github 发布了其知名开源编辑器 Atom 的核心 Atom-Shell,并在这个特殊时刻,将其重新命名为 Electron。 对于基于 Node.js 的桌面应用程序来说,Electron 与其它竞争对手有所不同。它通过将 Node.js(直到最近...

征服 JavaScript 面试:什么是纯函数?

图像: Pure — carnagenyc (CC-BY-NC 2.0) 对于函数式编程、可靠的并发以及 React + Redux 应用程序等用途来说,纯函数是必不可少的。不过,纯函数到底是什么意思呢? 我们打算用 “Eric Elliott 教你学 JavaSc...

征服 JavaScript 面试:什么是函数组合

Google 数据中心管道 — Jorge Jorquera — (CC-BY-NC-ND-2.0) “征服 JavaScript 面试”是我写的一系列文章,来帮助面试者准备他们在面试 JavaScript 中、高级职位中将可能会遇到的一些问题。这些问题我自己在面...

关于渐进式 Web 应用,你应该知道的一切

演示 下载 渐进式 Web 应用是利用现代浏览器的特性,可以添加到主屏幕上,表现得像原生应用程序一样的 Web 应用程序。 本教程将用实例和一个演示应用程序,一步一步向你展示关于渐进式 Web 应用程序你应该知道的一切。为了不从零开始,我们打算用我们最近做过的一个自拍...

实例讲解 JS 函数式编程 (第二部分)

在第一部分中,我们通过两个示例讨论了:函数式编程基础知识、柯里化、纯函数、Fantasy-land 规范、Functor、Monad、Maybe Monad 以及 Either Monad。 在本部分,我们将涉及:Applicative、curryN 函数 和 Val...

实例讲解 JS 函数式编程 (第一部分)

函数式编程(FP)可以改善编程的方式。但是它很难学,很多文章和教程并没有深入讲解 Monad、Applicative 等,也没有用实例来帮助我们在日常使用强大的函数式编程技术。这就是为什么我考虑写一篇文章让使用函数式编程技术变得更容易的原因。 请注意:本博客的重点放...

JavaScript 2015 特性概述

本文中将重温 JavaScript/ECMAScript 2015 的新特性,该版本是对 JavaScript 语言的重大更新。我们会特别重视这些特性是如何有助于更大系统的开发,以及如何与过去的方法比较。还会向你展示如何用 ECMAScript 2015,加上 asy...

Node Hero - 12. 如何部署 Node.js 应用程序

本教程将学习如何将 Node.js 应用程序部署到 PaaS 提供者(Heroku)或者用 Docker 部署。 将 Node.js 部署到 PaaS 平台即服务(Platform-as-a-Service,Paas)非常适合于想有零操作或者创建小应用程序的团队。...

Node Hero - 11. Node.js 安全教程

本教程将学习如何让应用程序防御常用的攻击途径。 Node.js 安全威胁 当今我们几乎每周都可以看到一些严重的安全漏洞,比如 LinkedIn 或 MySpace 的案例。在这些攻击期间,大量的用户数据被泄露 - 企业声誉也受损。 研究还表明,在某些行业,平均 18...

Node Hero - 9. Node.js 单元测试

本教程将会学习 Node.js 中的单元测试是什么,以及如何正确地测试你的应用程序。 测试 Node.js 应用程序 你可以把测试当作你创建的应用程序的保障措施。他们将不仅运行在你的本机上,还会在 CI 服务上,这样失败的构建就不会推送到产品系统中。 你也许会问:我的...

Node Hero - 8. 使用 Passport.js 进行 Node.js 身份验证

本教程中将学习如何使用 Passport.js 和 Redis 实现一个本地 Node.js 身份验证策略。 要使用的技术 在一头扎进实际代码之前,我们先看看本章中要用到的新技术。 Passport.js 是什么? 简单、 不花哨的 Node.js 身份验证 - p...

Node Hero - 7. Node.js 项目结构

大多数 Node.js 框架不会提供固定的目录结构,并且从开始就做对可能就是一个挑战。本教程会学习如何正确组织一个 Node.js 项目的结构,从而在应用程序开始增长时避免混乱。 Node.js 项目结构的五个基本规则 组织 Node.js 项目有不少可能的方式 -...

Node Hero - 6. Node.js Request 模块

在如下教程中,将学习 HTTP 协议的基础知识,以及如何使用 Node.js 的 request 模块从外部源获取资源。 什么是 HTTP? HTTP 代表超文本传输协议(Hypertext Transfer Protocol)。HTTP 作为在客户机-服务器计算模型...

Node Hero - 5. Node.js 数据库教程

如下的 Node.js 数据库教程将展示如何设置 Node.js 应用程序的数据库,并且教你使用它的基础知识。 将数据存储在一个全局变量中 正如在上章所学,为用户提供静态页面,可能适合着陆页或者个人博客。但是,如果想交付个性化的内容,就必须将数据存在某个地方。 举个例...

Node Hero - 4. 第一个 Node.js HTTP 服务器

本章我会指导你启动一个简单的 Node.js HTTP 服务器,并开始为请求服务。 Node.js 服务器的 http 模块 当开始在 Node.js 中构建基于 HTTP 的应用程序时,内置的 http/https 模块就是你要与之交互的模块。 现在,我们开始创建第...

Node Hero - 3. 理解异步编程

本章我将指导你学习异步编程的原理,并向你展示如何在 JavaScript 和 Node.js 中实现异步编程。 异步编程 在传统编程实践中,大多数 I/O 操作都是同步发生的。如果想想 Java,想想如何用 Java 读取一个文件,你会得到下面这样的代码: try(F...

Node Hero - 2. 使用 NPM

本章将学习什么是 NPM,以及如何使用它。我们开始吧! NPM 概述 NPM 是 Node.js 应用程序所用的包管理器 - 你可以在 NPM 中找到大量模块,这样你就不用重新造轮子了。它就像 Java 的 Maven 或者 PHP 的 Composer。与 NPM...

Node Hero - 1. 开始使用 Node.js

这是 Node.js 系列教程 Node Hero 的第一篇文章。在这些章节中,将学习如何上手 Node.js 以及如何使用它交付软件产品。 本教程从基础开始 - 不需要以前有 Node.js 知识。本教程的目标是让你入门 Node.js,确保你可以理解如何用它来编写...

原生应用将死

从现在起,我将不再创建原生应用,我的所有应用都会是渐进式 Web 应用。渐进式 Web 应用(Progressive web apps,简称 PWA)是被设计为用于移动设备的 Web 应用程序,这种 Web 应用甚至比原生移动应用能更无缝地用于移动设备。 这里的“更无...

如何以及为什么应该内联关键 CSS

在互联网早期年代,网站主要是用来显示基于文本的信息。慢慢地,连接速度提升了,用户已经能相当快地下载高分辨率的图像和视频了。现在网站就不仅仅是以文本的形式提供所需信息了。网站正变得越来越复杂,带有 CSS 和 JavaScript 框架,以及大量的插件等等,加载这些东西...

展示性组件和容器组件

Bismuth 在编写 React 应用程序时候,我发现有一个简单模式非常有用。如果你已经用过 React 一段时间,可能你已经发现它了。有篇文章已经很好地解释了它,但是我还是想加点东西。 如果你将组件分为两类,你会发现组件更容易重用和推理。我称它们为容器(Con...

一个治愈 JavaScript 疲劳的学习计划

像其他人一样,我最近偶然看到 Jose Aguinaga 的文章《在 2016 年学 JavaScript 是一种什么样的体验》”。 译者注:中文翻译在此。 很显然,这篇文章触到了很多人的痛点:我看到它两次荣登 Hacker News 的榜首。它也是 /r/ja...

如何组织真正的 Redux/React 应用程序

最近我在用 Redux/React 重写 Web 应用程序 Flow,这个工具用于帮助开发者更好地理解他们的应用程序的结构和行为。它提供了一个交互式的 Web 界面,将 Java 程序的执行流可视化。我面临如何组织工程的问题。 是按文件性质组织,还是按功能/数据域组织...

JavaScript 模块简史

砖模块和依赖 你是否是 JavaScript 新手,搞不清楚模块、模块加载器和模块打包器?或者你已经写了 JavaScript 一段时间,但是没法掌握模块的一些行话?你是否听过像 CommonJS、AMD、Browserify、SystemJS、Webpack、JS...

React 初学者教程 15:设置 React 开发环境

概述:学习如何配置 Node、Babel 和 Webpack 来高效创建 React 应用。 最后要学习的是如何设置创建 React 应用的开发环境。 迄今为止,我们都是通过包含几个 JS 文件来创建 React 应用的: <script src="h...

React 初学者教程 14:在 React 中访问 DOM 元素

有时我们需要直接访问 HTML 元素上的属性和方法。在 React 的缤纷世界里,JSX 代表纯粹的标记,那么为什么你会想要直接处理可怕的 HTML 呢?因为你会发现,很多时候直接通过 JavaScript DOM API 处理 HTML 元素,比用 React 的方...

React 初学者教程 13:用 React 创建一个简单的 Todo List 应用

概述:通过学习如何创建经典的 Todo List 应用,将所有学过的 React 技巧投入到实战中。 如果说创建 “Hello, World!” 示例是庆祝你开始涉足 React,那么创建一个经典的 Todo List 应用是庆祝你接近掌握 React!在本教程中,我...

React 初学者教程 12:在 React 中用 React Router 创建单页应用

概述:通过学习如何使用 React Router 来创建一个单页应用,来提升 React 技能。 现在我们已经熟悉了 React 的基础知识,该提升几个档次了。下面我们要用 React 创建一个单页应用程序(即 SPA)。如同我们在 React 介绍中所言,单页应用程...

React 初学者教程 11:组件的生命周期

概述:学习生命周期方法,从而更好地理解组件能做和不能做什么。 在开始,我们以一个很简单的视图组件以及他们要做什么开始。随着我们对 React 更多,做了更酷以及更复杂的事情,结果发现组件并非那么简单。它们帮助处理属性、状态、事件,并且经常负责其它组件的幸福。跟踪组件做...

React 初学者教程 10:React 中的事件

概述:通过学习如何处理事件,学习如何将无趣的 React 应用变为有趣而具互动性的应用。 迄今为止,我们所有的示例都是只在页面加载时执行。你可能会猜到,这是不正常的。在很多应用中,特别是重 UI 类型的应用中,应用程序要做的很多事情只是对某种事情的响应。这里,某种事情...

React 初学者教程 9:从数据到 UI

简介:利用 JSX 的灵活性,将烦人的数据转化为甜蜜的 UI 元素。 在创建应用时,术语 props、state、组件、JSX 标记、render 方法以及其它 React 主义也许是你脑袋中最后考虑的事情。大部分时间,你是处理 JSON 对象、数组以及其它数据结构形...

React 初学者教程 8:处理状态

到目前为止,我们已经创建的组件都是无状态的(stateless)。它们有从它们的父组件传递进来的属性(亦称 props),但是一旦组件活跃起来,就没有什么能改变它们。一旦属性被设置了,就被当作是不可修变的(immutable)。对于很多交互场景来说,你肯定不想这样子。...

React 初学者教程 7:深入 JSX

你可能已经注意到,在前面的教程中我们用到很多 JSX。但是我们确实还没有认真看看 JSX 到底是什么。它实际上是如何工作的呢?为什么我们不就把它叫 HTML 呢?它到底有哪些怪癖?在本教程中,我们将回答所有这些问题。我们将做一些严肃的回溯(以及一些前溯),来深入看看为...

React 初学者教程 6 :传递属性

处理属性有令人沮丧的一面,在前一个教程中我们已经看到了一点。在只处理一层组件时,将属性从一个组件传递到另一个很简单。但是如果你想将一个属性在多层组件之间传递,事情就开始变得复杂了。 事情变得复杂从来不是一件好事情,所以在本教程中,我们来看看我们怎么做才能让在多层组件之...

React 初学者教程 5 :创建复杂的组件

简介:通过学习如何识别和创建依赖于其它组件的组件,从而轻松创建复杂 UI。即根据组件可组合性,来创建复杂的组件。 在前一教程中,我们学习了组件以及组件可以做的很棒的一些事情。我们知道组件是主要的方式,React 允许我们的界面元素像可重用的砖块一样,组件包含自己要运行...

React 初学者教程 4: 在 React 中设置样式

长期以来,我们都是用 CSS 格式化 HTML 内容。用 CSS,可以很好地分离内容和表现形式。CSS 的选择器语法给我们很大的灵活性,来选择哪个要格式化,哪个会略过。你甚至找不到太多的问题来憎恨 CSS 的层叠。 好了,不要告诉 React 这些。React不会积极...

React 初学者教程 3: React 中的组件

组件是让 React 变得美好的事情之一,它是定义人们在使用应用程序时所看到的视觉和交互的主要方式之一。假如我们要完成的 app 是下面这个样子: 这是完成了的界面。在开发期间,从 React 项目的角度看,就不那么动人了。这个应用的视觉的几乎每一个部分都被封装在在...

React 初学者教程 2: 创建第一个 React 应用

通过前面一章的学习,我们已经了解了有关 React 的基本信息,以及它是如何帮助我们轻松创建即使是最复杂的用户界面。但是对于 React 提供的所有精彩来说,刚开始学习它可不是最简单的事情。React 的学习曲线相当陡峭,里面大大小小的障碍不少。 本章会从创建一个简...

React 初学者教程 1:React 简介

今天的 Web 应用程序除了外观比过去更好看以外,应用程序的架构和创建方式已经和过去有很大的不同。为突出这点,我们来看看如下的应用: 这是一个简单的商品目录浏览应用程序,它和这种类型的其它应用程序一样,通常包含一个主页、一个搜索结果页、一个详情页等等。 老式的多页设...

React 进阶: Redux

本文是 Brad Westfall 的 React 三篇系列教程的最后一篇。我们将学习如何以高效而并非超级复杂的方式管理整个应用程序的状态。在 React 的旅程中,我们已经走了这么远,该在这里穿过终点线,并从这种开发方法中获得最大的回报了。 系列文章 第一部分:...

React 进阶: 容器组件

本文是 Brad Westfall 编写的 React 系列三篇教程中的第二篇。本系列讲授的都是基础 React 技能之上的晋级内容,用来创建更大的事情,比如完整的单页应用(SPA)。本文是上篇 React Router 的继续。 系列文章 第一部分: React...

React 进阶: React Router

本文是 Brad Westfall 编写的 React 系列三篇教程中的第一篇。Brad 将本文投递给我时指出: React 初级教程有很多,但是晋级教程却不多。如果你是 React 新手,我推荐你观看这个介绍视频。本系列教程在这个视频的基础上继续。 系列文章 第...