0
0
0

Node.js新手教程：从零开始学习服务器端JavaScript

山月写前端
2025-06-13 23:12
阅读 534

一、开篇：什么是Node.js？它用来做什么？

一、开篇：什么是Node.js？它用来做什么？

你可能已经听说过“前端开发”这个词，比如用 HTML、CSS 和 JavaScript 写网页。这些代码通常在浏览器里运行，比如 Chrome 或 Edge。
但其实，除了在浏览器中写 JavaScript，我们还可以用它来写服务器上的程序——这就是 Node.js 的作用。

通俗点说：Node.js 是一个能让你用 JavaScript 在电脑（或服务器）上运行程序的工具。

这有什么好处呢？
最棒的地方在于：你可以只学一门语言（JavaScript），就能同时写出网页界面和处理数据的服务端功能，不用再学 Java、PHP 等别的语言。

常见的使用场景包括：

  • 构建网站后端
  • 搭建 API 接口服务
  • 实时聊天应用
  • 自动化脚本工具
  • 命令行工具（CLI 工具）

现在，我们就从零开始，搭建环境，动手写第一个 Node.js 程序！

二、环境准备：安装与配置 Node.js 开发环境

二、环境准备：安装与配置 Node.js 开发环境

我们需要先准备好你的电脑，让它能够运行 Node.js 程序。

步骤1：下载并安装 Node.js

前往官网：https://nodejs.org

你会看到两个版本选项：

  • LTS（长期支持版）：推荐给新手使用，更稳定
  • Current（最新版）：适合有经验的开发者尝试新特性

点击 LTS 版本下的 "Windows Installer" 或者 macOS/Linux 的对应版本进行下载安装。

下载完成后双击安装程序，一路下一步即可完成安装（默认配置即可）。

步骤2：验证安装是否成功

安装完成后，打开 命令行工具（终端）：

  • Windows：按 Win + R → 输入 cmd
  • Mac/Linux：打开 “终端”

输入以下命令查看是否安装成功：

node -v

如果出现类似这样的内容（具体数字可能不同），说明安装成功了：

v18.16.0

同样可以检查 npm 是否安装：

npm -v

输出类似于：

9.5.1

✅ 小提示：npm 是 Node.js 的包管理器，相当于 App Store，我们可以从中下载各种有用的库或工具。

三、核心概念讲解（带实例）

三、核心概念讲解（带实例）

1. 第一个 Node.js 程序

新建一个文件夹，比如叫 my-node-project，在里面创建一个文件 app.js，内容如下：

console.log("Hello, Node.js!");

然后回到命令行，在当前目录下运行：

node app.js

你将看到输出：

Hello, Node.js!

✅ 成功啦！你写出了人生第一个 Node.js 程序！

2. Node.js 里的模块系统（module）

Node.js 使用一种叫做 模块化 的方式组织代码。每个 JS 文件就是一个模块，默认不会自动共享变量。

举个例子：

utils.js

function add(a, b) {
    return a + b;
}

// 导出函数
module.exports = add;

app.js

// 引入 utils.js 中导出的内容
const add = require('./utils');

console.log(add(3, 4)); // 输出 7

运行一下：

node app.js

你应该会看到输出结果为：

7

3. 使用内置模块：fs（文件系统）

Node.js 提供了许多内置模块，比如 fs 用来读写文件。

例如，我们想把一段文字写入文件中：

writeFile.js

const fs = require('fs');

fs.writeFile('hello.txt', '这是一个Node.js生成的文本！', function(err) {
    if (err) throw err;
    console.log('文件写入成功！');
});

运行这个脚本后，你会发现项目目录里多了一个 hello.txt 文件，里面内容就是上面那段话。

4. HTTP 服务器入门：构建简单的网页服务器

接下来我们来做一个最简单的 Web 服务器。

server.js

const http = require('http');

const server = http.createServer((req, res) => {
    res.writeHead(200, {'Content-Type': 'text/plain'});
    res.end('Hello World\n');
});

server.listen(3000, () => {
    console.log('服务器正在监听端口 3000...');
});

保存好文件后运行：

node server.js

访问浏览器地址栏输入：

http://localhost:3000

你将看到页面显示：“Hello World”。

这就意味着你成功地用 Node.js 创建了一个网站服务器！

四、实战项目：打造一个简易留言板（完整示例）

四、实战项目：打造一个简易留言板（完整示例）

CSS动画效果展示-2

我们要创建一个最基础的留言页面，用户可以在网页上提交留言，留言会被存储到服务器内存里并展示出来。

💡 本次项目目标：

  • 创建一个简单的网页界面
  • 接收 POST 请求提交留言
  • 显示所有收到的留言信息

1. 目录结构

message-board/
├── server.js
└── public/
    └── index.html

2. 创建 HTML 页面

在 public/index.html 中写入以下内容：

<!DOCTYPE html>
<html>
<head>
    <title>我的留言本</title>
</head>
<body>
    <h2>欢迎来到我的留言本</h2>

    <form method="POST" action="/submit">
        <input type="text" name="message" placeholder="输入留言内容" />
        <button type="submit">提交</button>
    </form>

    <hr />

    <div id="messages"></div>

    <script>
        fetch('/get-messages')
            .then(res => res.json())
            .then(data => {
                let html = '';
                data.forEach(msg => {
                    html += `<p>${msg}</p>`;
                });
                document.getElementById('messages').innerHTML = html;
            });
    </script>
</body>
</html>

3. 编写 Server.js（重点！）

我们将编写一个可以接收表单请求，并保存留言的服务器。

server.js

const http = require('http');
const fs = require('fs');
const url = require('url');
const path = require('path');

let messages = [];

const server = http.createServer((req, res) => {
    const parsedUrl = url.parse(req.url, true);

    // 处理静态资源（加载HTML）
    if (req.method === 'GET' && parsedUrl.pathname === '/') {
        fs.readFile(path.join(__dirname, 'public', 'index.html'), (err, data) => {
            if (err) {
                res.writeHead(500);
                res.end('Server Error');
                return;
            }
            res.writeHead(200, { 'Content-Type': 'text/html' });
            res.end(data);
        });
    }

    // 获取留言
    else if (parsedUrl.pathname === '/get-messages') {
        res.writeHead(200, { 'Content-Type': 'application/json' });
        res.end(JSON.stringify(messages));
    }

    // 提交留言
    else if (parsedUrl.pathname === '/submit' && req.method === 'POST') {
        let body = '';
        req.on('data', chunk => {
            body += chunk.toString();
        });

        req.on('end', () => {
            const msg = new URLSearchParams(body).get('message');
            if (msg) messages.push(msg);
            res.writeHead(302, { 'Location': '/' });
            res.end();
        });
    }

    else {
        res.writeHead(404);
        res.end('Not Found');
    }
});

server.listen(3000, () => {
    console.log('服务器已启动：http://localhost:3000');
});

4. 运行并测试

进入项目根目录，运行：

node server.js

然后访问：

http://localhost:3000

尝试输入留言，并提交看看效果。

是不是感觉很酷？这就是你自己编写的第一个服务器端 Web 应用！

五、常见问题解答（FAQ）

Q1：为什么执行 node 文件没反应？

A：请确认你是否真的写好了 console.log() 语句，并正确运行命令；也可以检查文件名是否拼写错误。

Q2：控制台报错 TypeError: Cannot set properties of undefined?

A：通常是访问了一个未定义的变量属性，比如 undefined.name，请检查对象引用是否为空。

Q3：为什么不能在浏览器访问 localhost:3000 ?

A：请确保 Node.js 脚本确实在运行状态，并关闭防火墙或杀毒软件干扰。

Q4：如何停止服务器？

A：在命令行中按下 Ctrl + C，两次确认即可退出。

Q5：Node.js 支持 ES6 吗？能不能用 import/export ?

A：默认 Node.js 使用的是 CommonJS 规范（也就是 require）。如果想使用 ES6 的 import/export，需要使用 .mjs 扩展名或者启用 experimental modules 功能，对初学者建议先掌握 CommonJS。

六、下一步的学习路径建议

恭喜你完成了本教程的第一步！你现在已经掌握了 Node.js 的基本使用，接下来你可以继续拓展以下方向：

🧰 工具类扩展

  • 学习使用 NPM 管理第三方库
  • 掌握 Node.js 脚本的调试技巧（Node Inspector / VS Code 配置）
  • 使用 Nodemon 自动重启服务器（开发效率利器）
npm install -g nodemon
nodemon server.js

🔧 框架进阶

  • Express.js（轻量级 Web 开发框架）
  • Koa.js （新一代轻量框架，由 Express 原班人马开发）
  • Fastify （高性能 Node.js 框架）

🛠 实战进阶项目

  • 用户注册登录系统
  • 博客系统搭建
  • 文件上传/下载服务
  • 微信公众号接口对接
  • 实时聊天室

结语

移动端适配方案-1

Node.js 不是一门编程语言，而是一个让我们可以在服务器上运行 JavaScript 的强大工具。通过本教程的学习，你已经掌握了它的基础使用和一些关键概念。

记住一句话：学会 Node.js 最快的方式，就是动手写一个小项目。

保持热情，不断尝试，很快你就能用 JavaScript 写出属于自己的网站后台啦！

如需后续学习资料、电子书、视频课程链接，欢迎留言告诉我，我会为你整理一份专属学习清单 👇

标签:React前端面试题挑战

评论 0

最热最新
暂无评论

为你推荐

暂无相关推荐
匿名用户Lv.1
0
影响力
0
文章
0
粉丝

相关推荐

暂无相关推荐

精选内容

暂无精选内容