Skip to content

1.md

Latest commit

 

History

History
648 lines (359 loc) · 37.4 KB

1.md

File metadata and controls

648 lines (359 loc) · 37.4 KB

一、基础

我认为每个人都应该学习如何给电脑编程，因为它教会你如何思考。我认为计算机科学是一门文科，是每个人都应该学会的。—史蒂夫·乔布斯

在本章中，我们将讨论以下主题:

  • HTML、CSS 和 JavaScript 语法概述
  • 敏捷方法简介
  • 云计算、Node.js 和 MongoDB 的优势
  • HTTP 请求/响应和 RESTful API 概念的描述

如果你是一个有经验的 web 开发人员，我不推荐，但是可以跳过这一章。在继续之前，温习一下基本概念是很重要的。为什么呢？也许你听说过并熟悉一些术语，但想知道它们实际上是什么意思。另一个很好的原因是，本章将以一种非常初学者友好的方式介绍 RESTful API。REST 在几乎所有现代 web 架构中都有使用，我们会在书中大量使用它。还有最后一个原因:在鸡尾酒会上，或者在你的同事和老板面前，你会显得很聪明。

前端定义

前端是浏览器应用的术语。在某些对话中，这可能意味着服务器首先面对请求。然而，对于这本书，我们假设所有的前端仅限于浏览器和移动应用及其代码。

前端开发，或前端 web 开发，意味着各种技术的使用。它们中的每一个单独来说都不太复杂，但是它们的数量之多让初学者感到胆怯。例如，有级联样式表(CSS)、超文本标记语言(HTML)、可扩展标记语言(XML)、JavaScript、JavaScript 对象标记法(JSON)、统一资源标识符(URI)、超文本传输协议(HTTP)和许多其他缩写。

除了底层技术，还有许多框架、工具和库；比如 jQuery，Backbone.js，Angular.js，Grunt 等等。请不要混淆前端框架和后端框架:后者运行在服务器上，而前者运行在浏览器上。

前端 web 开发由以下组件组成:

HTML or templates that compile to HTML   Stylesheets to make HTML pretty   JavaScript to add interactivity or some business logic to the browser app   Some hosting (AWS, Apache, Heroku, etc.)   Build scripts to prepare code, manage dependencies, and do pretty much anything that’s needed   Logic to connect to the server (typically via XHR requests and RESTful API)  

现在你知道前端开发人员这个头衔意味着什么了。掌握这个大杂烩的最大回报是通过构建漂亮有用的应用来表达你的创造力。

在我们开始构建之前，让我们鸟瞰一下 web 请求周期。

Web 请求周期

这对于刚接触 web 开发的人来说很重要。整个万维网或互联网是关于客户端和服务器之间的通信。这种通信通过发送请求和接收响应来实现。通常浏览器(最流行的 web 客户端)向服务器发送请求。在后台，服务器向其他服务器发送自己的请求。这些请求类似于浏览器请求。请求和响应的语言是 HTTP(S)。让我们更详细地研究浏览器请求。

web 请求由以下步骤组成:

A user types a URL or follows a link in his or her browser (also called the client).   The browser makes an HTTP request to the server.   The server processes the request, and if there are any parameters in a query string or body of the request, it takes them into account.   The server updates, gets, and transforms data in the database.   The server responds with an HTTP response containing data in HTML, JSON, or other formats.   The browser receives the HTTP response.   The browser renders an HTTP response to the user in HTML or any other format (e.g., JPEG, XML, JSON).  

移动应用的行为方式与普通网站相同，只是没有浏览器，而是有一个本地应用。移动应用(原生或 HTML5)只是另一个客户端。手机和网络之间的其他微小差异包括运营商带宽导致的数据传输限制、更小的屏幕和更有效地使用本地存储。很可能你，我的读者，是一个渴望在移动中使用你的网页印章的网页开发者。有了 JavaScript 和 HTML5，这是可能的，因此有必要更深入地讨论 web 开发。

移动开发

手机会超越网络和桌面平台吗？也许吧。目前，移动开发领域还非常不成熟，还是一个新领域。如果你是先锋，那很好，但我们大多数人都不是。与 web 相比，这在工具和库方面是一个更大的差距。差距正在缩小。使用 HTML5，您可以编写一次代码并在移动设备上重用代码。还有其他方法。

这些是移动开发的方法，每种都有自己的优点和缺点:

Native: Native iOS, Android, Blackberry apps built with Objective-C and Java.   Abstracted native: Native apps built with JavaScript in Appcelerator ( http://www.appcelerator.com ), Xamarin, ( https://xamarin.com ), Smartface ( http://www.smartface.io ) React Native or similar tools, and then compiled into native Objective-C or Java.   Responsive: Mobile web sites tailored for smaller screens with responsive design, CSS frameworks like Twitter Bootstrap ( http://twitter.github.io/bootstrap/ ) or Foundation ( http://foundation.zurb.com/ ), regular CSS, or different templates. You might use some JavaScript frameworks for the development like Backbone.js, Angular.js, Ember.js, or React.js.   Hybrid: HTML5 apps that consist of HTML, CSS, and JavaScript, and are usually built with frameworks like Sencha Touch ( http://www.sencha.com/products/touch ), Trigger.io ( https://trigger.io ), JO ( http://joapp.com ), React Native ( https://facebook.github.io/react-native ), or Ionic ( http://ionicframework.com ) and then wrapped into a native app with PhoneGap ( http://phonegap.com ). As in the third approach, you probably will want to use a JavaScript framework for the development, such as Backbone.js, Angular.js, Ember.js, or React.js.  

我个人最喜欢的是第二和第四种方法。第二种方法不需要不同的代码库。只需向 CSS 库添加一个链接，就可以构建一个最小可行产品(MVP)。第四种方法更强大，提供了更具可伸缩性(从开发的角度来看)的 ui。这更适合复杂的应用。跨平台移动和 web 之间的代码重用很容易，因为大多数时候你是用 JavaScript 编写的。

超文本标记语言

HTML 本身不是一种编程语言。它是一组标记标签，描述内容并以结构化和格式化的方式呈现。HTML 标签由尖括号(<>)内的标签名称组成。在大多数情况下，标签包围着内容，结束标签在标签名称前有一个正斜杠。

在本例中，每一行都是一个 HTML 元素:

<h2>``Overview of HTMLT2】

<div>``HTML is a ...T2】

<link``rel="stylesheet" type="text/css" href="style.css"T2】

HTML 文档本身是<html>标签的一个元素，所有其他元素都是该<html>标签的子元素:

<!DOCTYPE html>

<html``lang="en"T2】

<head>

<link``rel="stylesheet" type="text/css" href="style.css"T2】

</head>

<body>

<h2>``Overview of HTMLT2】

<p>``HTML is a ...T2】

</body>

</html>

HTML 有不同的风格和版本，比如 DHTML、XHTML 1.0、XHTML 1.1、XHTML 2、HTML 4 和 HTML 5。这篇文章很好地解释了不同之处:误解标记:XHTML 2/HTML 5 漫画( http://coding.smashingmagazine.com/2009/07/29/misunderstanding-markup-xhtml-2-comic-strip/ )。

任何 HTML 元素都可以有属性。其中最重要的是class, id, style, data-name, onclick，还有其他事件属性比如onmouseover, onkeyup等等。

class

属性定义了一个类，用于 CSS 或域对象模型(DOM)操作中的样式化；例如:

<p``class="normal"``>``...T4】

id

属性定义了一个 ID，其目的类似于元素类，但是它必须是唯一的；例如:

<div id="footer">...</div>

style

属性定义内联 CSS 来样式化一个元素；例如:

<font style="font-size:20px">...</font>

title

属性指定了大多数浏览器通常在工具提示中显示的附加信息；例如:

<a title="Up-vote the answer">...</a>

data-name

属性允许元数据存储在 DOM 中；例如:

<tr data-token="fa10a70c-21ca-4e73-aaf5-d889c7263a0e">...</tr>

onclick

当点击事件发生时，onclick属性调用内联 JavaScript 代码；例如:

<input``type="button" onclick="validateForm();"``>``...T4】

onmouseover

除了鼠标悬停事件，onmouseover属性类似于onclick;例如:

<a``onmouseover="javascript: this.setAttribute(’css’,’color:red’)"``>``...T4】

内联 JavaScript 代码的其他 HTML 元素属性如下:

  • onfocus:当浏览器聚焦于一个元素时
  • onblur:当浏览器焦点离开一个元素时
  • onkeydown:当用户按下键盘按键时
  • ondblclick:当用户双击鼠标时
  • onmousedown:当用户按下鼠标按钮时
  • onmouseup:当用户释放鼠标按钮时
  • onmouseout:当用户将鼠标移出元素区时
  • oncontextmenu:当用户打开上下文菜单时

事件兼容性表( http://www.quirksmode.org/dom/events/index.html )中提供了此类事件的完整列表和浏览器兼容性表。

我们将在 Twitter Bootstrap framework 中广泛使用类，但是使用内联 CSS 和 JavaScript 代码通常不是一个好主意，所以我们将尽量避免。然而，知道 JavaScript 事件的名称是有好处的，因为它们在 jQuery、Backbone.js 以及普通 JavaScript 中随处可见。要将属性列表转换成 JS 事件列表，只需去掉前缀on；例如，onclick属性表示click事件。

更多信息可在示例中找到:捕捉鼠标点击( https://developer.mozilla.org/en-US/docs/JavaScript/Getting_Started#Example:_Catching_a_mouse_click )、维基百科( http://en.wikipedia.org/wiki/HTML )和 MDN ( https://developer.mozilla.org/en-US/docs/Web/HTML )。

级联样式表

CSS 提供了一种格式化和显示内容的方法。一个 HTML 文档可以通过一个<link>标记包含一个外部样式表，如前面的例子所示，或者它可以在一个<style>标记中直接包含 CSS 代码:

<style>

body {

padding-top:``60px``;T3】

}

</style>

每个 HTML 元素可以有id属性、class属性，或者两者都有:

<div``id="main" class="large"T2】

Lorem ipsum dolor sit amet,

Duis sit amet neque eu.

</div>

在 CSS 中，我们通过元素的id、class、标签名来访问元素，在某些边缘情况下，通过父子关系或元素属性值来访问元素。

这会将所有段落的颜色(<p>标签)设置为灰色(#999999):

p {

color:``#999999T2】

}

这会用main的id属性设置<div>元素的填充:

div#main {

padding-bottom:``2emT2】

padding-top:``3emT2】

}

这将类large的所有元素的字体大小设置为 14 像素:

.large {

font-size:``14ptT2】

}

这隐藏了<div>，它是<body>元素的直接子元素:

body > div {

display:``noneT2】

}

对于name属性为email的输入，这将宽度设置为 150 像素:

input[name="email"] {

width:``150pxT2】

}

更多信息可查阅维基百科( http://en.wikipedia.org/wiki/Cascading_Style_Sheets )和 MDN ( https://developer.mozilla.org/en-US/docs/Web/CSS )。

CSS3 是对 CSS 的升级，包括一些新的处理方式，如圆角、边框和渐变，这些在常规 CSS 中只有借助 PNG/GIF 图像和使用其他技巧才能实现。

更多信息请参考 CSS3.info ( http://css3.info )、w3school ( http://www.w3schools.com/css3/default.asp )，以及 CSS3 与 CSS 关于扣球的对比文章( http://coding.smashingmagazine.com/2011/04/21/css3-vs-css-a-speed-benchmark )。

Java Script 语言

JavaScript (JS)于 1995 年在网景公司以 LiveScript 的名字出现。它与 Java 的关系就像仓鼠与火腿的关系一样，所以请不要混淆两者。

如今，JavaScript 被用于客户端和服务器端 web，以及桌面应用开发、无人机、物联网(IoT)和其他事物。这是本书的主要焦点，因为使用 JavaScript 你可以跨所有层进行开发。你不需要任何其他语言！

让我们从 HTML 中的 JavaScript 开始。将 JS 代码放入<script>标签是在 HTML 文档中使用 JavaScript 最简单的方法:

<script``type="text/javascript" language="javascript"T2】

alert("Hello world!")

//simple alert dialog window

</script>

请注意，混合 HTML 和 JS 代码并不是一个好主意，所以为了将它们分开，我们可以将代码移动到一个外部文件，并通过在script标签上设置 source 属性src="filename.js"来包含它，例如，对于app.js资源:

<script``src="js/app.js" type="text/javascript" language="javascript"T2】

</script>

请注意，结束标签</script>是强制的，即使是像我们包含外部源文件的空元素。由于 JavaScript 的压倒性优势，Type和language属性多年来在现代浏览器中成为可选属性。

运行 JavaScript 的其他方式包括:

  • 内联方法已经介绍过了
  • WebKit 浏览器开发工具和 FireBug 控制台
  • 交互式Node.js外壳

JavaScript 语言的优势之一是它是松散类型的。与 C 和 Java 等语言中的强类型( http://en.wikipedia.org/wiki/Strong_typing )相反，这种松散或弱类型使 JavaScript 成为更好的原型开发编程语言。下面是 JavaScript 对象或类的一些主要类型(本质上没有类；对象继承自对象)。

数字原语

数字原语是数值；例如:

var num = 1

数字对象

这是数( https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Number )对象及其方法；例如:

var numObj = new Number(’123’) //Number object

var num = numObj.valueOf()     //number primitive

var numStr = numObj.toString() //string representation

字符串原语

字符串原语是单引号或双引号内的字符序列；例如:

var str = ’some string’

var newStr = "abcde".substr(1,2)

为方便起见，JavaScript 自动用String对象方法包装字符串原语，但又不太一样( https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/String#Distinction_between_string_primitives_and_String_objects )。

字符串对象

String对象有很多有用的方法，像length, match等等；例如:

var strObj = new String("abcde") //String object

var str = strObj.valueOf()       //string primitive

strObj.match(/ab/)

str.match(/ab/) //both call will work

RegExp 对象

正则表达式是用于查找匹配、替换和测试字符串的字符模式。

var pattern = /[A-Z]+/

’ab’.match(pattern) // null

’AB’.match(pattern) // ["AB"]

match()方法返回一个匹配数组(["AB"])。如果你需要的只是一个布尔型的true/false，那么只需使用pattern.test(str)。例如:

var str = ’A’

var pattern = /[A-Z]+/

pattern.test(str) // true

特殊类型

有疑问的时候(调试的时候)随时可以调用typeof obj。以下是 JS 中使用的一些特殊类型:

  • NaN:不是数字
  • null:空无一物，zip
  • undefined:未声明的变量
  • function:功能

数据

JSON 库允许我们解析和序列化 JavaScript 对象；例如:

var obj = JSON.parse(’{a: 1, b: "hi"}’)

var stringObj = JSON.stringify({a: 1, b: ’hi’})

数组对象

数组( https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array )是基于零索引的列表。例如，要创建数组:

var arr = new Array()

var arr = [’apple’, ’orange’, ’kiwi’]

Array对象有很多好的方法，比如indexOf、slice和join。确保你熟悉它们，因为如果使用正确，它们会节省很多时间。

数据对象

var obj = {name: ’Gala’, url: ’img/gala100x100.jpg’, price: 129}

或者

var obj = new Object()

稍后我们将提供更多关于继承模式的内容。

布尔原语和对象

就像String和Number，Boolean ( https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Boolean )可以是原语，也可以是对象。

var bool1 = true

var bool2 = false

var boolObj = new Boolean(false)

日期对象

Date ( https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Date )对象允许我们处理日期和时间；例如:

var timestamp = Date.now() // 1368407802561

var d = new Date()         // Sun May 12 2013 18:17:11 GMT-0700 (PDT)

数学对象

这些用于数学常数和函数()https://developer。mozilla。org/en-US/docs/JavaScript/Reference/Global _ Objects/Math)；例如:

var x = Math.floor(3.4890)

var ran = Math.round(Math.random()*100)

浏览器对象

浏览器对象让我们能够访问浏览器及其属性，如 URLs 例如:

window.location.href = ’http://rapidprototypingwithjs.comT2】

console.log(’test’)

DOM 对象

DOM 对象或 DOM(https://developer . Mozilla . org/en/docs/Web/API/Node)Node 是页面上呈现的 DOM 元素的浏览器接口。它们有宽度、高度、位置等属性，当然还有内部内容，可以是另一个元素或文本。要获得一个 DOM Node，可以使用它的 ID；例如:

var transactionsContainer = document.createElement(’div’)

transactionsContainer.setAttribute(’id’, ’main’)

var content = document.createTextNode(’Transactions’)

transactionsContainer.appendChild(content)

document.body.appendChild(transactionsContainer)

var main = document.getElementById(’main’)

console.log(main, main.offsetWidth, main.offsetHeight)

全球

除了像String、Array、Number和Math这样有很多有用方法的类之外，您还可以调用以下称为全局的方法，这意味着您可以从代码中的任何地方调用它们:

约定

JavaScript 使用了许多样式约定。其中一个是 camelCase，你可以把多个单词打成一个单词，从第二个单词开始把每个单词的第一个字母大写。

分号是可选的。以下划线开头的名称是私有方法或属性，但不是因为它们受语言保护。我们使用_只是为了提醒开发人员不要使用它们，因为它们可能会在未来发生变化。

JavaScript 只支持最大 53 位的数字。如果你需要处理比大数更大的数，请查阅大数库。

JavaScript 和 DOM 对象的完整参考可从Mozilla Developer Network(https://developer . Mozilla . org/en-US/docs/JavaScript/Reference)和w3school(http://www . w3schools . com/jsref/default . ASP)获得。

对于 JS 资源，比如 ECMA 规范，请查看位于JavaScript Language Resources ( https:// developer 的列表。mozilla。org/en-US/docs/JavaScript/Language _ Resources。在撰写本文时，最新的 JavaScript 规范是 ECMA-262 5.1 版。ECMA-国际。org/publications/files/ECMA-ST/Ecma-262。pdf )和 HTML(http://www . ECMA-international . org/ECMA-262/5 . 1/)。

JS 的另一个重要区别是它是一种函数式的原型语言。函数声明的典型语法如下所示:

function Sum(a,b) {

var sum = a + b

return sum

}

console.log(Sum(1, 2))

JavaScript 中的函数是一等公民(http://en . Wikipedia . org/wiki/First-class _ function)由于语言的函数编程(http://en . Wikipedia . org/wiki/Functional _ programming)性质。因此，函数可以用作其他变量或对象；例如，函数可以作为参数传递给其他函数:

var f = function (str1){

return function(str2){

return str1 + ’ ’ + str2

}

}

var a = f(’hello’)

var b = f(’goodbye’)

console.log((a(’Catty’))

console.log((b(’Doggy’))

知道有几种方法可以在 JS 中实例化一个对象是有好处的:

要进一步了解继承模式，请查看 JavaScript 中的继承模式(http://bolin fest . com/JavaScript/Inheritance . PHP)和继承再访( https:// developer)。mozilla。org/en-US/docs/JavaScript/Guide/Inheritance _ Revisited。

有关浏览器运行 JavaScript 的更多信息，请访问 Mozilla 开发者网络( https:// developer。mozilla。org/en-US/docs/JavaScript/Reference)、维基百科(http://en . Wikipedia . org/wiki/JavaScript)、w3schools(http://www . w3schools . com/js/default . ASP)。

敏捷方法

敏捷软件开发方法的发展是由于传统方法如瀑布在高度不可预测的情况下不够好；也就是在解未知的时候( http:// www。startuplessonsle 学到了。结合-敏捷-开发-与。html 。敏捷方法包括 Scrum/sprint、测试驱动开发、持续部署、成对编程和其他实用技术，其中许多都是从极限编程借鉴来的。

混乱

关于管理，敏捷方法使用 Scrum 方法。关于 Scrum 的更多信息可以从以下来源获得:

Scrum 方法是一系列短周期，每个周期被称为一次冲刺。一次冲刺通常持续一到两周。一个典型的 sprint 以一个 sprint 规划会议开始和结束，在这个会议上，新的任务被分配给团队成员。无法将新任务添加到正在进行的 sprint 中；它们只能在 sprint 会议上添加。

scrum 方法论的一个重要部分是每天的 Scrum 会议，因此得名。每次 scrum 是一个 5 到 15 分钟长的会议，通常在走廊上进行。在 scrum 会议中，每个团队成员都要回答三个问题:

What have you done since yesterday?   What are you going to do today?   Do you need anything from other team members?  

灵活性使得敏捷成为瀑布方法的一个改进，特别是在高度不确定的情况下(例如，在创业中)。

Scrum 方法的优势在于，它在很难提前计划的情况下是有效的，在反馈循环被用作主要决策权威的情况下也是有效的。

测试驱动开发

测试驱动开发(TDD)由以下步骤组成:

Write failing automated test cases for new features, tasks, or enhancement by using assertions that are either true or false.   Write code to successfully pass the test cases.   Refactor code if needed, and add functionality while keeping the test cases passed.   Repeat until all tasks are complete.  

测试可以分为功能测试和单元测试。后者是指系统测试单个单元、方法和功能，并模拟出依赖关系，而前者(也称为集成测试)是指系统测试一部分功能，包括依赖关系。

TDD 有几个优点:

  • 更少的错误和缺陷
  • 更高效的代码库
  • 确信代码能够工作，并且不会破坏旧的功能

持续部署和集成

持续部署(CD)是一套快速向客户交付新特性、缺陷修复和增强的技术。CD 包括自动化测试和自动化部署。使用 CD，减少了人工开销，并最大限度地缩短了反馈循环时间。基本上，开发人员越快从客户那里获得反馈，产品就能越快转向，从而在竞争中获得更多优势。许多初创公司在一天内部署多次，相比之下，大公司和大公司通常需要 6 到 12 个月的发布周期。

CD 方法的优点包括减少反馈循环时间和人工开销。

CD 和持续集成的区别在文章Continuous Delivery vs. Continuous Deployment vs. Continuous Integration - Wait huh? ( http:// blog。安培拉。com/assembly blog/tabid/12618/bid/92411/连续交付-连续部署-连续集成-等等。aspx

一些最流行的持续集成解决方案包括:

结对编程

结对编程是两个开发人员在一个环境中一起工作的一种技术。其中一个开发人员是司机，另一个是观察员。驱动编写代码，观察者通过观看和提出建议来辅助。然后他们交换角色。司机有一个更注重当前任务的战术角色。相比之下，观察者具有更具战略性的角色，监督“更大的画面”并发现错误和改进算法的方法。

以下是成对编程的优点:

  • 结对产生更短更有效的代码库，并引入更少的错误和缺陷。
  • 作为一个额外的奖励，知识在程序员们一起工作时传递。然而，开发人员之间的冲突是可能的，而且并不罕见。

后端定义

后端是服务器的另一个名称。是浏览器之后的一切。包括 PHP、Python、Java、Ruby，当然还有 Node.js 这样的服务器平台，以及数据库等技术。

幸运的是，借助现代后端即服务解决方案，您可以完全绕过后端开发。只需包含一个<script>标签，您就可以获得一个实时数据库，能够将一些逻辑放入其中，如访问级别控制(ALC)、验证等等。我说的是 Firebase.com 和 Parse.com。

在那些仍然需要自己的定制服务器代码的情况下，Node.js 是首选的武器！

Node.js

Node.js 是一种开源的、事件驱动的异步 I/O 技术，用于构建可伸缩的、高效的 web 服务器。Node.js 由 Google 的 V8 JavaScript 引擎( http:// en。维基百科。org/wiki/V8 _(JavaScript _ engine))。它由云公司 Joyent 维护。com )，而是转移到技术指导委员会治理。

Node.js 的用途和用法类似于 Python 的 Twisted(http://Twisted matrix . com/TRAC/)和 Ruby 的 event machine(http://Ruby event machine . com/)。Node 的 JavaScript 实现是继尝试使用 Ruby 和 C++编程语言之后的第三个。

Node.js 本身并不是像 Ruby on Rails 那样的框架；它更像是 PHP 和 Apache 的组合。我将提供一个顶级 Node.js 框架的列表第 6 章。

以下是使用 Node.js 的优点:

  • 开发人员很可能熟悉 JavaScript，因为它是 web 和移动开发的事实标准
  • 使用一种语言进行前端和后端开发可以加快编码过程。开发人员的大脑不必在不同的语法之间切换，也就是所谓的上下文切换。方法和类的学习进行得更快。
  • 有了 Node.js，你可以快速制作原型，并尽早进入市场进行客户开发和客户获取。这是相对于其他使用不太灵活的技术(例如 PHP 和 MySQL)的公司的一个重要的竞争优势。
  • Node.js 通过利用 web 套接字来支持实时应用。

更多信息可以去维基百科(http://en . Wikipedia . org/wiki/Nodejs)、Nodejs.org(http://Nodejs . org/about/)和读写文章( http:// readwrite)。com/2011/01/25/wait-whats-nodejs-good-for-aga)和 O ' Reilly(http://radar . oreilly . com/2011/07/what-is-node . html)。

关于 Node.js 目前的状态(截至本文撰写时)，请参考 Node.js 官方博客(https://nodejs . org/en/blog/)。

NoSQL 和蒙古 b

来自 huMONGOus 的 MongoDB 是一个高性能、无关系的海量数据数据库。当传统的关系数据库管理系统(RDBMSs)无法应对海量数据的挑战时，NoSQL 概念应运而生。

以下是使用 MongoDB 的优势:

  • 可伸缩性:由于分布式的特性，多个服务器和数据中心可以有冗余数据。
  • 高性能:MongoDB 对于存储和检索数据非常有效，部分原因是数据库中的元素和集合之间没有关系。
  • 灵活性:键值存储是原型开发的理想选择，因为它不需要开发人员了解模式，也不需要固定的数据模型或复杂的迁移。

云计算

云计算由以下组件组成:

  • 基础设施即服务(IaaS)，包括 Rackspace 和 Amazon Web Services
  • 平台即服务(PaaS)，包括 Heroku 和 Windows Azure
  • 后端即服务(BaaS)，最新、最酷的产品，包括 Parse.com 和 Firebase
  • 软件即服务(SaaS)，包括谷歌应用和 Salesforce.com

云应用平台具有以下优势:

  • 可扩展性；例如，它们可以在几分钟内产生新的实例
  • 易于部署；例如，要推送至 Heroku，您只需使用$ git push
  • 按需付费计划，用户根据需求添加或删除内存和磁盘空间
  • 用于简化数据库、应用服务器、软件包等的安装和配置的附加组件
  • 安全和支持

PaaS 和 BaaS 是原型开发、构建最小可行产品(MVP)和早期创业公司的理想选择。

以下是最受欢迎的 PaaS 解决方案列表:

HTTP 请求和响应

每个 HTTP 请求和响应都由以下组件组成:

  • Header:关于编码、正文长度、来源、内容类型等信息
  • 主体:传递给服务器或发送回客户端的内容，通常是参数或数据

此外，HTTP 请求包含以下元素:

  • 方法:有几种方法，最常见的有GET、POST、PUT和DELETE
  • URL:主机、端口、路径。例如， https://graph.facebook.com/498424660219540
  • 查询字符串:URL 中问号后面的所有内容(例如，?q=rpjs&page=20)

约定接口规范

RESTful(表述性状态转移)API 因分布式系统中的需求而变得流行，其中每个事务都需要包括关于客户端状态的足够信息。从某种意义上来说，这个标准是无状态的，因为服务器上没有存储关于客户机状态的信息，这使得不同的系统为每个请求提供服务成为可能。

以下是 RESTful API 的一些独特特征:

  • 由于不同的组件可以独立部署到不同的服务器上，因此它具有更好的可扩展性支持。
  • 因为更简单的动词和名词结构，它取代了简单对象访问协议(SOAP)。
  • 它使用的 HTTP 方法有GET、POST、DELETE、PUT、OPTIONS等等。

表 1-1 是一个用于消息收集的简单创建、读取、更新和删除(CRUD) RESTful API 的例子。

表 1-1。

An Example of a CRUD RESTful API

| 方法 | 统一资源定位器 | 意义 | | --- | --- | --- | | 得到 | /messages.json | 以 JSON 格式返回消息列表 | | 放 | /messages.json | 更新/替换所有消息并返回 JSON 中的状态/错误 | | 邮政 | /messages.json | 创建新消息并以 JSON 格式返回其 ID | | 得到 | /messages/{id}。数据 | 以 JSON 格式返回 ID 为{id}的消息 | | 放 | /messages/{id}。数据 | 更新/替换 ID 为{id}的消息，如果{id}消息不存在，请创建它 | | 删除 | /messages/{id}。数据 | 删除 id 为{id}的消息，以 JSON 格式返回状态/错误 |

休息不是一个协议；它是一种比 SOAP 更灵活的架构，SOAP 是一种协议。因此，如果我们想要支持这些格式，REST API URLs 可能看起来像/messages/list.html或/messages/list.xml。

PUT和DELETE是幂等方法( http:// en。维基百科。org/wiki/Hypertext _ Transfer _ Protocol # Idempotent _ methods _ and _ web _ applications)，也就是说如果服务器收到两个或两个以上类似的请求，最终结果是一样的。GET是无效的，而POST不是幂等的，可能会影响状态并产生副作用。

关于 REST API 的进一步阅读可以在维基百科上找到。维基百科。org/wiki/presentation _ state _ transfer)以及 REST 文章简介(http://www . infoq . com/articles/REST-Introduction)。

摘要

第一章到此结束。在这一章中，我们已经讨论了一些网络开发的核心概念。它们将成为本书其余部分的坚实基础。我相信有些概念你很熟悉:

  • 超文本标记语言
  • 半铸钢ˌ钢性铸铁(Cast Semi-Steel)
  • JavaScript 类型和对象
  • 敏捷
  • Node.js
  • NoSQL
  • HTTP 请求
  • 约定接口规范

尽管如此，重温一下还是有好处的，因为它们数量众多，范围广阔。如果不理解理论如何应用并有益于实际代码，理论就没有那么有用或有趣。因此，我们将快速进入技术设置，让您快速进入编码项目。