Node.js + Express教程

热血战士喵 2023-08-28 ⋅ 22 阅读

Node.js是一个基于Chrome V8引擎的JavaScript运行环境,可以在服务器端运行JavaScript代码。而Express则是Node.js的一个框架,可以帮助我们快速搭建Web应用。本教程将介绍如何使用Node.js和Express来创建一个简单的Web应用。

准备工作

在开始之前,我们需要先安装Node.js和Express。你可以通过官方网站(https://nodejs.org)下载并安装Node.js。安装完成后,打开命令行工具,输入以下命令安装Express:

npm install express

创建项目

在开始编码之前,我们需要创建一个项目目录。打开命令行工具,进入你想要创建项目的目录,并执行以下命令:

mkdir myapp
cd myapp

然后,创建一个名为index.js的文件,并在其中输入以下代码:

const express = require('express');
const app = express();
const port = 3000;

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

app.listen(port, () => {
    console.log(`Server is running at http://localhost:${port}`);
});

这段代码创建了一个基本的Express应用,监听在端口3000上,并对根路径进行了GET请求的处理,返回Hello World!

运行应用

保存文件后,在命令行工具中执行以下命令运行应用:

node index.js

应用将会启动,并在命令行中显示Server is running at http://localhost:3000。现在,打开浏览器,访问http://localhost:3000,你将会看到页面上显示Hello World!

添加更多路由

现在我们来为应用添加更多的路由。我们将为/about/contact路径分别创建GET请求的处理。

修改index.js文件,加入以下代码:

app.get('/about', (req, res) => {
    res.send('This is the about page.');
});

app.get('/contact', (req, res) => {
    res.send('This is the contact page.');
});

保存文件并重新运行应用。现在,当你访问http://localhost:3000/about,将会看到显示This is the about page.的页面;访问http://localhost:3000/contact,将会看到显示This is the contact page.的页面。

使用模板引擎

为了让页面更具吸引力和实用性,我们可以使用模板引擎来动态生成HTML。这里我们将使用EJS作为模板引擎。

首先,安装EJS:

npm install ejs

然后,修改index.js文件,加入以下代码:

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

app.get('/hello/:name', (req, res) => {
    const name = req.params.name;
    res.render('hello', { name });
});

在项目目录下创建一个名为views的文件夹,并在其中创建一个名为hello.ejs的文件,输入以下代码:

<!DOCTYPE html>
<html>
<head>
    <title>Hello <%= name %>!</title>
</head>
<body>
    <h1>Hello <%= name %>!</h1>
</body>
</html>

保存文件并重新运行应用。现在,当你访问http://localhost:3000/hello/yourname,将会看到显示Hello yourname!的页面。

结语

至此,我们已经学会了使用Node.js和Express创建一个简单的Web应用。当然,这只是冰山一角,Node.js和Express还可以做很多很强大的事情。希望本教程能给你带来帮助,欢迎继续深入学习和探索。


全部评论: 0

    我有话说: