自制chatroom_构建由Node.js驱动的Chatroom Web App：入门

自制chatroom

本文是Microsoft的Web开发技术系列的一部分。 感谢您支持使SitePoint成为可能的合作伙伴。

这个Node.js教程系列将帮助您构建完全部署在云中的由Node.js驱动的实时聊天室Web应用程序。在本系列中，您将学习如何在Windows计算机上设置Node.js （如果在Mac上则仅学习概念），如何使用Express开发Web前端，如何将节点Express应用程序部署到Azure ，如何使用Socket.IO添加实时层，以及如何一起部署所有实时层。

本教程将使用可选的Visual Studio和Visual Studio插件的Node.js工具作为开发环境-我提供了两个工具的免费下载的链接。这是一篇初学者到中级文章，您应该了解HTML5和JavaScript。

第1部分– Node.js简介

第2部分–欢迎使用带有Node.js和Azure的Express

第3部分–使用Node.js，Mongo和Socket.IO构建后端

第4部分–使用Bootstrap构建Chatroom UI

第5部分–将聊天室与WebSockets连接

第6部分–结局和调试远程Node.js应用

欢迎来到动手Node.js教程系列的第1部分。在这一期中，我将解释什么是Node.js ，为什么要注意Node.js以及如何设置计算机。

什么是Node.js？为什么要使用它？

Node.js是一个运行时环境和库，用于在浏览器外部运行JavaScript应用程序。 Node.js主要用于运行实时服务器应用程序，并通过使用非阻塞I / O和异步事件来提高其性能。围绕Node.js构建了一个完整的Web生态系统，其中包含多个Web应用程序框架和协议实现可供使用。无疑，这是当今在网络上开发实时应用程序的最简单，最快的方法之一。

为什么要使用Node.js？一句话：JavaScript。 JavaScript是一种非常流行的语言，并且被认为是使Web成为当今动态的仙境的驱动力之一。

JavaScript出现在前端，但由于有了V8 JavaScript引擎和Ryan Dahl的帮助，您现在可以在浏览器外部运行联网JavaScript应用程序，以精确地构建Web应用程序。 Node.js使您可以统一应用程序使用的编程语言。您的后端不再需要其他语言，您可以在整个过程中使用JavaScript。如果您的背景是使用HTML，CSS和JavaScript构建和设计网站和Web应用程序前端，则无需选择其他语言即可为应用程序开发复杂的数据驱动的后端。

Node.js在WebSockets的发展中起着至关重要的作用，WebSockets是一种用于前端和后端之间实时通信的方法。 WebSockets和基于该协议构建的库（例如Socket.IO）的使用确实推动了Web应用程序的发展，并使我们的开发人员能够探索创建Web的新方法。

如何在Windows 8上设置Node.js

首先，您需要一台相当新的计算机。我将向您展示如何在Windows 8.1上安装Node.js。

1.安装Node.js

首先，下载并安装Node.js运行时。选择Windows Installer是入门最简单的方法之一。

另外，如果您是Chocolatey （Windows的软件包管理器）的迷，可以通过运行以下命令安装Node.js：

choco install nodejs.install

2.确认设置

您应该仔细检查Node.js可执行文件是否已添加到PATH系统环境变量中。如果您想了解如何在Windows 8和Windows 8.1上更改环境变量，请观看此视频。您将要确保已将以下文件夹添加到PATH变量中：

C:\Program Files (x86)\nodejs\

如果转到命令提示符并输入节点–h，则应看到显示的node.js可执行文件的帮助文档。

免费学习PHP！

全面介绍PHP和MySQL，从而实现服务器端编程的飞跃。

原价$ 11.95 您的完全免费

免费获得这本书

与Node.js npm一起使用的用于管理node.js软件包的系统也应安装并在命令提示符下可用。只需键入npm –h ，您应该会看到显示的npm帮助文档。

发生错误时...

如果您遇到与此错误类似的错误…

Error: ENOENT, stat 'C:\Users\someuser\AppData\Roaming\npm'

…解决方法是在上述指定的路径上创建一个文件夹，如此StackOverflow问题所示。这只是最新的Node.js安装程序中的问题，下一个版本应解决。您可以这样创建文件夹：

mkdir -r C:\Users\someuser\AppData\Roaming\npm

选择开发工具

安装了Node.js之后，就该选择开发工具了。随意使用您想要的任何编辑工具。在这些教程中，我将使用Visual Studio开发，调试和部署聊天引擎。以及用于Visual Studio的Node.js工具（NTVS）–用于Visual Studio的免费开源插件，支持开发Node.js应用程序。

NTVS最酷的地方在于它添加了Node.js支持，可进行编辑，Intellisense，性能分析，npm，TypeScript，本地和远程调试（包括在Windows / MacOS / Linux上）。它还使快速创建网站并将其部署到Microsoft Azure网站或Cloud Services变得容易。

如果您没有Visual Studio，则可以下载Visual Studio 2013 Community Edition的免费副本。然后，下载免费的Visual Studio插件Node.js工具。您也可以使用Visual Studio 2012 Pro或更高版本（需要更新4）或Visual Studio 2013或更高版本（需要更新2）。 NTVS插件与两个版本都兼容。

在Visual Studio中启动一个新的Node.js项目

注意：屏幕截图显示了Visual Studio 2013 Ultimate。

开始一个新的Node.js项目非常简单。

启动Visual Studio。在“文件”菜单上，单击“ 新建” ，然后单击“ 项目” 。
在“新建项目”窗口中，展开“ 已安装”菜单选择，展开“ 模板” ，然后单击“ JavaScript” 。在主窗口中，选择Blank Node.js Web应用程序 。选择项目的位置和名称，然后单击确定。
将显示以下屏幕。此时随意探索Visual Studio。您将需要在解决方案资源管理器中打开生成的server.js文件（通常在右侧，但可能位于屏幕上的其他位置。）
现在，您可以在首选浏览器中调试node.js Web应用程序。

Node.js中的“ Hello World”应用程序

这是上面链接的server.js文件中使用的代码。

var http = require('http');
var port = process.env.port || 1337;
http.createServer(function (req, res) {
res.writeHead(200, { 'Content-Type': 'text/plain' });
res.end('Hello World\n');
}).listen(port);

与其他语言一样，生成的代码示例向您展示如何在浏览器中输出“ Hello World”。让我解释一下server.js生成的代码如何逐行工作。 如本教程系列说明中所述，我假设您已经了解JavaScript，HTML5以及HTTP / Internet的工作原理。

1号线

var http = require(‘http’);

Node.js有一个简单的模块和依赖项加载系统。您只需使用包含您要加载的模块的文件或目录路径调用function “require” ，然后返回包含该模块所有导出函数的变量。

2号线

var port = process.env.port || 1337;

在这行上，我们想确定服务HTML的HTTP服务器应在哪个端口上运行。如果在环境变量中指定了端口号，我们将使用该端口号，或者仅使用1337。

3号线

http.createServer(function (req, res) {

我们要创建一个服务器来处理HTTP请求。我们还将为createServer函数传递一个包含两个参数的函数回调，以处理每个单独的请求并返回响应。如果您从未遇到过JavaScript中的回调函数，请查看Michael Vollmer的文章。接收到的请求在req parameter传递，并且期望将响应写入res参数。

4号线

res.writeHead(200, { ‘Content-Type’: ‘text/plain’ });

任何HTTP响应都需要一个状态行和标头，以了解有关HTTP标头及其工作方式的更多信息，请参阅本文。在这种情况下，我们要返回200 OK作为状态响应，并将内容类型指定为纯文本。我们通过在响应对象上调用writeHead function来指定它。

5号线

res.end(‘Hello World\n’);

编写完响应后，我们要调用end function 。我们还可以通过end function传递最终内容，在这种情况下，我们希望以纯文本形式发送字符串“ Hello World”。

6号线

}).listen(port);

我们关闭回调，并在先前定义的端口上调用function listen ，这将启动服务器并开始接受发送到已定义端口的请求。

要查看结果，可以通过按上一个屏幕快照中显示的按钮开始调试。您可以在浏览器中看到“ Hello World”。

瞧！您现在已使用Visual Studio 2013在Windows 8.1上成功运行了Node.js应用程序。

敬请关注第2部分！

第2部分-如何部署的“Hello World”到云是在这里。通过关注我的twitter帐户，您可以了解有关本文和其他文章的最新信息。

有关Azure上Node的更多信息

要对节点进行更深入的学习，可以在Microsoft Virtual Academy上找到我的课程。

或一些类似节点主题的短格式视频：

六部分系列：使用node.JS构建应用
漫步节点（Coding4Fun）

本文是Microsoft的Web开发技术系列的一部分。我们很高兴与您分享Project Spartan及其新的渲染引擎。获取免费的虚拟机或者在你的Mac，iOS设备，Android或Windows设备上远程测试modern.IE 。

翻译自: https://www.sitepoint.com/build-node-js-powered-chatroom-web-app-getting-started/

自制chatroom