​Node.js是一个JavaScript运行时环境，将其能力扩展到服务器端。它是建立在Chrome的V8 JavaScript引擎上。

Node是一个事件驱动的非阻塞I/O模型。这意味着它是异步的，不会因为一个请求而阻塞（而是立即移动到下一个请求），这使得Node异常快速和高效。

所谓事件驱动，是指一旦Node启动，它就会启动所有的变量和函数，并等待事件的发生。

NPM即Node包管理工具（Node Package Manager），辅助你管理Node包。NPX即Node包执行（Node Package Execute），它可以执行任何NPM包，甚至无需安装。

可以前往https://nodejs.org/en/download/下载NPM。

编写你的第一个Node.js项目（Hello World）

在你的项目文件中创建一个名为hello_world.js的文件。

然后在如VS Code这样的代码编辑器中打开文件。在编辑器中输入console.log(“Hello World”);。

打开终端，并且导航到文件所在的位置。

输入node hello_world.js。

如何导入Node核心模块

让我们从基础包开始，即fs（文件系统）。我们使用它来创建、读取和修改文件。

导入fs模块，输入命令：const fs = require(“fs”);。

使用这个模块中的函数，可以参考文档。

创建文件，可以使用fs.writeFileSync(filename, content);。

const fs = require(“fs”);
fs.writeFileSync(“file.txt”, “Hi there..”);

 

在同一个文件中添加内容可以：

fs.appendFileSync(filename, content);.

如何安装NPM包

我们将使用一个名为superheroes（超级英雄） 的基础NPM包（包含了一个随机的超级英雄清单）来帮助你理解NPM是如何运作的。

我们可以在cmd中使用这条命令来安装任意NPM包：

npm install superheroes

现在输入const sh = require(“superheroes”);导入这个安装好的包。

使用这条命令来随机展示超级英雄的名字：

console.log(sh.random());.

 

再来试一试另外一个包。让我们安装时下最流行的一个npm包——“chalk"，这个包可以改变终端字符串的样式。

使用以下命令安装chalk（我们将安装版本2.4.2，在这个版本中可以使用require方法）。

npm install chalk@2.4.2

现在我们可以通过命令改变文本字符串演示，使用这条命令来选择文本颜色：

chalk.color(text)

 

更多信息参考chalk包的文档。

如何在程序中初始化NPM

我们可以使用以下命令来初始化NPM：

npm init

然后输入回车并且回答相应的问题：

 

或者你可以直接通过npm init -y来完成初始化（相当于所有问题的答案都是回车）。

 

初始化完毕后会生成一个package.json文件：

所以，package.json是什么？

package.json是Nodejs项目的一部分。它包含了所有依赖项（NPM包）的记录和每一个项目的原数据。

如果其他人下载了这个项目，他们可以通过这个文件来安装所有运行程序需要的依赖项。

如何使用Moment.js — 一个NPM包

这是使用最多的NPM包之一，可以使用这个包来解析和验证日期。

使用以下命令安装包：

npm i moment

导入包：

const moment = require(“moment”);

通过创建一个Date对象来获取当前日期和时间（JavaScript方法），运行以下代码：

const time = new Date();

使用包里的moment方法来解析或者格式化日期：

const parsedTime = moment(time).format("h:mm:ss");

打印解析后的日期：

console.log(parsedTime);

 

该项目的package.json中包含的所有依赖项——这个例子中的依赖项就是moment。

 

在项目文件夹中也有node_modules文件夹。该文件夹包含了所有项目依赖的的依赖项，包含moment，以及moment依赖的依赖包。

 

package-lock.json是项目文件夹中另一个文件，包含了项目名称、依赖项、依赖项版本和锁定版本等信息。

该文件描述了项目生成的树，使后续安装可以生成相同的树。

如何使用Express JS——一个NodeJS框架

Express是Node.js的一个web应用框架，该框架提供了全面的功能来支持web和移动应用的开发。

如何安装Express

使用以下命令来创建Express：

npm install express

然后这样导入Express：

const express = require("express");

如何创建一个Express应用

使用以下命令来创建Express应用：

const app = express()

如何在端口3000启动服务器

app.listen(3000, () => { 
    console.log("Server running on port 3000");
}

 

你可以打开http://localhost:3000登录你创建的服务器。

 

这里的“cannot get /”意味着还没有定义路由“/” 。

可以使用 app.get()函数定义“/”路由。

app.get (route, callback function)函数被用于处理所有GET请求。

这个回调函数有两个参数，req和res，分别指代的是HTTP请求和期望的响应。参数名（req，res）并不是固定的，所以你可以重命名为其他值。

app.get("/", (req,res) => { 
    // app.get处理GET请求
    // req - http请求, res - 期望响应
    res.send("Hello World"); // 给这个路由发送Hello World
}

如何使用Express来创建Hello World程序

在这个部分中我们将使用Express创建基本的Hello World程序：

const express = require("express");
const app = express();
app.get("/", (req, res) => {  
    res.send("hello world");
});
app.listen(3000, () => {  
    console.log("Server running on 3000");
});

输出如下：

如何在Express中渲染静态文件

这部分介绍如何使用Express来渲染静态文件的概念。

首先，创建一个新的项目文件夹，并且使用 npm init -y来初始化npm。

使用 npm i express来安装Express，并创建一个名为app.js的文件。

创建一个app，并在端口3000监听：

const express = require("express);
const app = express();
app.listen(3000, () => {  
    console.log("Server running on 3000");
}

在根目录创建一个名为public的文件夹，来渲染静态web页面，如：HTML、CSS和JS。

由于本教程重点在后端，所有我们不会花时间在前端部分，在public文件夹中，我们仅创建HTML文件。

 

我们将导入path模块，并将特定路径合并到一起：

const path = require(“path”);

并使用以下命令来渲染这些文件：

app.use(express.static(path.join(__dirname, “/public”)));

__dirname →返回当前目录

const express = require("express");
const path = require("path");
const app = new express();
app.use(express.static(path.join(__dirname, "/public")));
app.listen(3000, () => {  
    console.log("Server running on 3000");
});

输出如下：

如何在Express中渲染动态文件

在这个部分我们将学习如何使用一个输入对象的值来渲染动态文件。

有一些，如：pug、handlebars、ejs等模板用于动态页面的渲染。这些模板使得我们可以在运行时注入动态数据、if条件和循环。

在这里我们将讨论handlebars。

安装包（express和hbs）：

npm i hbs express

创建文件名为app.js的文件，并且导入包：

const express = require(“express”);
const hbs = require(“hbs”);
const path = require(“path”);

创建Express，并在端口3000监听：

const app = express();
app.listen(3000, (req,res) => {  
    console.log("Server running on 3000");
}

将视图引擎（view engine）设置为hbs，使得handlebars生效：

app.set(“view engine”, “hbs”);

视图引擎使得我们可以使用特定模板来渲染动态页面。

基本上，视图引擎会在根目录里寻找“视图（views）”文件夹。但为了避免报错，我们将“views”的路径包含在参数中：

app.set(“views”, path.join(__dirname,“/views”);

然后在根目录中创建 views 文件夹，并在文件夹中创建index.hbs文件（.hbs是handlebars的扩展名）并插入以下HTML代码：

index.hbs

<html>  
    <head> 
        <title>Dynamic Rendering</title> 
    </head>
    <body>  
      <h1>Dynamic Rendering</h1>   
      <p>{{author}}</p> <!--由服务器接受到的动态数据-->
    </body>
</html>

{{author}} — 是插入动态数据的语法。

我们再创建一个app.get函数来处理路由"/"上的GET请求，并且发送动态数据author。

app.get("/", (req, res) => { 
    res.render("index", {    
        author: "Arash Arora", 
    });
});

res.render 是一个渲染视图的函数，在这里我们传入了两个参数。第一个是去掉扩展名的文件名，第二个是本地变量对象，比方说author。

app.js文件

const express = require("express");
const hbs = require("hbs");
const path = require("path");
const app = express();
app.set("view engine", "hbs");
app.set("views", path.join(__dirname, "/views"));
app.get("/", (req, res) => {  
    res.render("index", {    
        author: "Arash Arora", 
    });
});
app.listen(3000, (req, res) => { 
    console.log("Server listening on 3000");
});

文件夹结构

 

输出如下：

如何使用Handlebars创建高级模板

在这一部分我们将学习可复用组件。在前面的章节我们给每一个页面的header和footer创建了相同的组件。

这里的重复性工作就可以通过高级模板来简化。也就是说我们创建一个组件，并在需要的地方反复使用。

Handlebars引入部分（Partials）的概念

Partials是可被其他模板调用的handlebar文件。Partials是一个被广泛应用的模板类概念，所以不仅限于Handlebars。

想要构建可以复用的模板，可以将它们单独放在同一个文件夹内（Partial），然后在不同的模板中使用。可以将Partial理解为模块化模板的一种简单技术。

可以通过以下步骤创建partial：

• 初始化npm → npm init -y
• 安装必要的包、Express以及hbs → npm i express hbs
• 创建文件夹模板
• 在文件夹模板内部创建另外两个文件夹：partials和views
• 创建文件app.js

文件结构类似

 

让我们创建两个partial文件：header.hbs和footer.hbs。同时也创建两个视图：index.hbs和about.hbs。

 

index.hbs

<html lang="en">  
    <head>   
        <title>Advanced Templating</title>  
    </head>  
    <body>    
        {{>header}} <!--包含header组件-->
        <p>I'm a savior</p>    
        {{>footer}} <!-- 包含footer组件-->
    </body>
</html>

about.hbs

<html lang="en">  
    <head>    
        <title>Advanced Templating -- About</title> 
    </head>
    <body>   
        {{>header}}   
        <p>Handlebars</p>    
        {{>footer}} 
    </body>
</html>

header.hbs

<header>  
    <h1>Advanced Templating</h1> 
    <h3>{{title}}</h3><!--服务器传来的动态数据-->
    <a href="/">Home</a> 
    <a href="/about">About</a>
</header>

footer.hbs

<footer>  
    <p>Created by {{name}}</p> <!--name -> 动态数据 -->
</footer>

app.js

const express = require("express");
const hbs = require("hbs");
const path = require("path");
const app = express();
app.set("view engine", "hbs");
app.set("views", path.join(__dirname, "/templates/views"));
hbs.registerPartials(path.join(__dirname, "/templates/partials"));
app.get("/", (req, res) => {  
    res.render("index", {    
        title: "Home",    
        name: "Arash Arora",  
    });
});
app.get("/about", (req, res) => {  
    res.render("about", {    
        title: "About",    
        name: "Arash Arora",  
    });
});
app.listen(3000, () => {  
    console.log("Listening on port 3000");
});

这里基本和在Express中渲染动态数据章节类似，除了使用partial的时候我们需要注册partials。

如何注册partials

hbs.registerPartials(path_to_partials)

由于我们在模板文件夹中创建了partials目录，这里是 partials 的路径：

hbs.registerPartials(path.join(__dirname, "/templates/partials"));

总结

在这篇文章中，我们从理论到实践讲解了Node.js。虽然我们不能从一篇简短的文章中习得Node.js所有内容，但是我已经尽我所能地在这篇文章中涵盖了重要的知识点，来辅助你开启Node.js之旅。

简言之，我们讨论了什么是Node.js，即一个非阻塞、事件驱动的JavaScript运行时环境，它是异步的、可以使用单线程来执行操作。我们还讨论了使用最广泛的短小、灵活的Node.js的web应用框架——Express。

我们还讲解了Node.js的NPM、 NPX以及静态和动态渲染。

总而言之，Node.js是一项令人惊叹的技术，而且由于其庞大的社区，其可能性是无穷无尽的。