用Node.js和Express.js搭建网站

让我们开始搭建网站吧。

1. 安装Node.js和Express.js

首先，我们需要安装Node.js和Express.js。您可以从Node.js官网下载并安装Node.js。然后，您可以使用npm包管理器安装Express.js。打开命令行窗口，输入以下命令：

npm install express

2. 创建一个新的Express.js项目

接下来，我们需要创建一个新的Express.js项目。在命令行窗口中，输入以下命令：

mkdir my-app
cd my-app
npm init -y

这将创建一个新的文件夹名为“my-app”，并初始化一个新的npm项目。

3. 在Express.js项目中添加Express.js

现在，我们需要在我们的Express.js项目中添加Express.js。在命令行窗口中，输入以下命令：

npm install express --save

这将在我们的package.json文件中添加Express.js作为依赖项。

4. 创建一个新的Express.js应用程序

现在，我们需要创建一个新的Express.js应用程序。在my-app文件夹中，创建一个名为app.js的新文件。在app.js文件中，添加以下代码：

const express = require('express');

const app = express();

app.get('/', (req, res) => {
  res.send('Hello World!');
});

app.listen(3000);

这将创建一个新的Express.js应用程序，它将在端口3000上监听HTTP请求。

5. 运行Express.js应用程序

现在，我们可以运行Express.js应用程序。在命令行窗口中，输入以下命令：

node app.js

这将启动Express.js应用程序。

6. 访问Express.js应用程序

现在，我们可以通过在浏览器中输入http://localhost:3000来访问Express.js应用程序。您应该会看到“Hello World!”消息。

7. 添加路由

现在，让我们添加一些路由到我们的Express.js应用程序。在app.js文件中，添加以下代码：

app.get('/about', (req, res) => {
  res.send('About Page');
});

app.get('/contact', (req, res) => {
  res.send('Contact Page');
});

这将添加两个新的路由到我们的Express.js应用程序：/about和/contact。当用户访问这些路由时，Express.js应用程序将分别发送“About Page”和“Contact Page”消息。

8. 添加视图引擎

现在，让我们添加一个视图引擎到我们的Express.js应用程序。视图引擎允许我们使用模板来生成HTML页面。在app.js文件中，添加以下代码：

app.set('view engine', 'pug');

这将设置Pug作为我们的视图引擎。

9. 创建一个新的Pug模板

现在，我们需要创建一个新的Pug模板。在my-app文件夹中，创建一个名为index.pug的新文件。在index.pug文件中，添加以下代码：

h1 Hello World!

p This is the index page.

这将创建一个新的Pug模板，它将生成一个简单的HTML页面，包含“Hello World!”标题和“This is the index page.”段落。

10. 渲染Pug模板

现在，我们需要渲染我们的Pug模板。在app.js文件中，添加以下代码：

app.get('/', (req, res) => {
  res.render('index');
});

这将渲染index.pug模板，并将生成的HTML页面发送给用户。

11. 部署Express.js应用程序

现在，我们可以将我们的Express.js应用程序部署到生产环境。您可以使用Heroku、AWS或任何其他您喜欢的平台来部署您的应用程序。

12. 恭喜您！

您现在已经成功地构建了一个使用Node.js和Express.js的Web应用程序。