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

大家好，我是一名从培训班出来的前端开发者。刚入行时，我也曾被“后端”“Node.js”这些词搞得晕头转向。当时我以为 JavaScript 只能在浏览器里跑，直到有一天老师说：“其实你用的 React 项目，背后可能就是 Node.js 在支撑。”这句话让我恍然大悟，也激起了我对后端的兴趣。

今天写这篇教程，就是想用最接地气的方式，带完全零基础的你，一步步走进 Node.js 的世界。无论你是不是计算机专业，有没有编程经验，只要会用电脑、愿意动手敲代码，就能学会！

---

一、Node.js 到底是什么？能用来做什么？

简单来说：

Node.js = 能在电脑上直接运行 JavaScript 的工具

你可能知道，平时我们写的 JavaScript（比如操作网页按钮、弹窗）只能在浏览器里运行。但 Node.js 让 JavaScript 跑到了你的电脑（或服务器）上，从而可以做“后端”的事情。

什么是“后端”？

想象一个餐厅：

• 前端 = 服务员（负责点菜、上菜，和顾客打交道）
• 后端 = 厨房（负责炒菜、管理食材、处理订单）

在网站中：

• 前端（比如用 React 写的页面）负责展示内容、接收用户点击
• 后端（比如用 Node.js 写的服务）负责读取数据库、处理登录、保存数据等

所以，Node.js 就是让你用熟悉的 JavaScript 来写“厨房”——也就是后端服务！

💡 我当初学的时候以为后端必须用 Java 或 Python，结果发现 JavaScript 也能干，简直像捡到宝！

---

二、环境准备：5 分钟搭建开发环境

别担心，安装非常简单，只需要两步：

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

1. 打开官网：https://nodejs.org
2. 点击 LTS 版本（长期支持版，最稳定，适合新手）
3. 下载后双击安装，一路“下一步”即可

✅ 安装完成后，打开终端（Windows 用 PowerShell 或 CMD，Mac 用 Terminal），输入：

node -v

如果看到类似 v20.12.0 的版本号，说明安装成功！

再输入：

npm -v

也会显示版本号（比如 10.5.0）。npm 是 Node.js 自带的“包管理器”，相当于 App Store，可以下载别人写好的代码模块。

步骤 2：准备一个代码编辑器

推荐使用 VS Code（免费、轻量、对 JavaScript 支持极好）：

• 官网：https://code.visualstudio.com
• 安装后打开即可，不需要额外配置

🛠️ 避坑指南：不要用记事本写代码！它没有语法高亮和错误提示，你会疯的。

---

三、核心概念：用大白话讲清楚关键术语

1. 什么是“服务器”？

服务器其实就是一台 24 小时不关机的电脑。你的 Node.js 程序就运行在这台电脑上，随时响应用户的请求。

但在本地学习时，你的电脑就是服务器！所以我们先在自己电脑上模拟。

2. 什么是“API”？

API（Application Programming Interface）可以理解为“前后端沟通的语言”。

• 前端（React 页面）说：“我要用户列表！”
• 后端（Node.js）回答：“给你：[{name: '小明'}, {name: '小红'}]”

这个“问答过程”就是通过 API 实现的。

3. 为什么 React 和 Node.js 经常一起出现？

• React：负责做漂亮的前端页面（运行在浏览器）
• Node.js：负责提供数据接口、处理业务逻辑（运行在服务器）

它们通过 API 对话，各司其职。很多全栈项目都是 “React + Node.js” 组合！

💬 我当初做的第一个项目，就是用 React 写页面，Node.js 写接口，感觉像打通了任督二脉！

---

四、实战项目：手把手写一个“待办事项”后端

我们将用 Node.js 写一个简单的后端服务，支持：

• 查看所有待办事项
• 添加新待办事项

不需要数据库，用内存数组临时存储（够新手用了）。

第 1 步：创建项目文件夹

在电脑上新建一个文件夹，比如叫 my-todo-backend，然后在 VS Code 中打开它。

第 2 步：初始化项目

在 VS Code 的终端中执行：

npm init -y

这会生成一个 package.json 文件，记录项目信息。

第 3 步：安装 Express 框架

Express 是 Node.js 最流行的 Web 框架，能让我们快速搭建服务器。

npm install express

🔍 为什么用 Express？因为原生 Node.js 写服务器太麻烦，Express 帮我们封装好了常用功能。

第 4 步：编写服务器代码

在项目根目录新建一个文件 server.js，输入以下代码：

// 引入 express
const express = require('express');

// 创建应用实例
const app = express();

// 允许前端发送 JSON 数据
app.use(express.json());

// 模拟数据库（实际项目会用 MySQL、MongoDB 等）
let todos = [
  { id: 1, text: '学习 Node.js', done: false },
  { id: 2, text: '写 React 页面', done: true }
];

// 路由 1：获取所有待办事项
app.get('/api/todos', (req, res) => {
  res.json(todos);
});

// 路由 2：添加新待办事项
app.post('/api/todos', (req, res) => {
  const newTodo = {
    id: Date.now(), // 简单生成 ID
    text: req.body.text,
    done: false
  };
  todos.push(newTodo);
  res.status(201).json(newTodo);
});

// 启动服务器，监听 3001 端口
const PORT = 3001;
app.listen(PORT, () => {
  console.log(`服务器运行在 http://localhost:${PORT}`);
});

第 5 步：运行服务器

在终端执行：

node server.js

你会看到输出：

服务器运行在 http://localhost:3001

第 6 步：测试 API

测试 GET 请求（获取数据）

打开浏览器，访问：
http://localhost:3001/api/todos

你会看到 JSON 格式的待办列表！

测试 POST 请求（添加数据）

因为浏览器不能直接发 POST，我们用 curl（终端命令）或 Postman（推荐新手用 Thunder Client 插件，VS Code 里免费安装）。

用 curl 的话，在另一个终端窗口输入：

curl -X POST http://localhost:3001/api/todos \
  -H "Content-Type: application/json" \
  -d '{"text":"买牛奶"}'

返回结果应该是你刚添加的任务。

✅ 恭喜！你已经写出了第一个 Node.js 后端服务！

---

五、常见问题解答（新手必看）

❓ 问题 1：为什么我的 node server.js 报错 “Cannot find module ‘express’”？

原因：你没安装 Express，或者安装在了别的文件夹。

解决：

1. 确保你在项目文件夹里（有 package.json 的那个）
2. 执行 npm install express
3. 如果还不行，删除 node_modules 文件夹和 package-lock.json，重新 npm install

❓ 问题 2：修改代码后要重启服务器吗？

是的！ 默认情况下，Node.js 不会自动重启。每次改完代码都要：

1. 按 Ctrl + C 停止当前进程
2. 重新运行 node server.js

💡 进阶技巧：可以用 nodemon 工具实现自动重启。安装方法：

npm install -g nodemon
nodemon server.js

这样改代码后会自动重启，超方便！

❓ 问题 3：React 怎么调用这个 Node.js 接口？

在 React 项目中（比如用 create-react-app 创建的），你可以这样调用：

// 获取待办列表
useEffect(() => {
  fetch('http://localhost:3001/api/todos')
    .then(res => res.json())
    .then(data => setTodos(data));
}, []);

// 添加新任务
const addTodo = (text) => {
  fetch('http://localhost:3001/api/todos', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ text })
  });
};

⚠️ 注意：如果 React 运行在 http://localhost:3000，而 Node.js 在 3001，会遇到 跨域问题。解决方法是在 Node.js 服务器加 CORS 支持：

npm install cors

然后在 server.js 中：

const cors = require('cors');
app.use(cors()); // 加在 app.use(express.json()) 下面

❓ 问题 4：数据重启就没了，怎么办？

因为我们用的是内存数组 todos，程序一关数据就消失。真实项目要用数据库，比如：

• MongoDB（NoSQL，适合 JS 开发者）
• MySQL（关系型数据库）

但新手阶段，先用内存模拟没问题！重点是理解流程。

---

六、学习建议与下一步路线

✅ 你现在掌握了什么？

• Node.js 是什么、能做什么
• 如何搭建开发环境
• 用 Express 写简单 API
• 前后端如何通信（React + Node.js）

🔜 接下来该学什么？

阶段	学习内容	推荐资源
基础巩固	HTTP 协议、RESTful API 设计	MDN Web Docs
数据库	MongoDB + Mongoose	官方文档 + YouTube 教程
身份验证	JWT 登录、密码加密	Auth0 免费课程
部署上线	将 Node.js 部署到云服务器	Render / Vercel / Railway
全栈整合	用 React + Node.js 做完整项目	GitHub 上找开源项目模仿

🧭 给新手的三条忠告

1. 不要死记代码：理解“为什么这么写”比背代码重要 100 倍。
2. 多动手，少看视频：看十遍不如自己敲一遍。
3. 遇到报错别慌：把错误信息复制到 Google，90% 的问题都有人解答过。

🌟 我当初学的时候，光是“端口被占用”就卡了两天。后来才知道只要换一个端口号就行。所以，每个坑都是成长的机会！

---

结语

Node.js 并没有想象中那么可怕。它只是让你用 JavaScript 做更多事情——从前端延伸到后端，成为真正的全栈开发者。

今天你写的这个小服务，虽然简单，但已经具备了真实项目的核心逻辑：接收请求 → 处理数据 → 返回结果。

下一步，试着给它加上“删除任务”、“标记完成”等功能，或者连接一个真实的数据库。你会发现，编程的乐趣就在于“让它跑起来”的那一刻。

加油！我在前端的路上等你，一起成为更厉害的开发者！

—— 一名从培训班走出来的前端讲师