一、Node.js到底是什麼?¶
簡單來說,Node.js是一個讓JavaScript能在服務器端運行的工具。它基於Chrome的V8引擎,用JavaScript語法就能寫後端代碼,處理文件、數據庫、網絡請求等任務。
爲什麼學Node.js?它的核心優勢是非阻塞I/O(可以理解爲“一邊做事一邊等”,不卡殼)和事件驅動(像服務員接訂單,不用一直盯着你,等訂單來了才處理),特別適合處理高併發的異步任務(比如同時處理100個用戶請求)。
二、Node.js能做什麼?¶
- Web應用開發:用Express、Koa等框架快速搭建網站(比如知乎、阿里巴巴的部分業務)。
- API接口開發:寫後端接口給前端調用(比如微信小程序、手機APP的後端)。
- 即時應用:用Socket.io實現即時通訊(比如在線聊天、彈幕)。
- 命令行工具:用Node寫腳本自動化工作(比如自動生成代碼、批量處理文件)。
- 數據分析/爬蟲:處理日誌文件、爬取網頁數據(比如統計網站流量)。
三、5個初學者必做實戰項目¶
項目1:個人博客網站(適合練手:Express + 模板引擎)¶
目標:搭建一個能顯示文章列表和單篇文章的靜態博客,用本地文件存文章。
技術:Express(Web框架)、EJS(模板引擎)、fs模塊(文件讀寫)。
步驟:
1. 安裝Express:npm init -y && npm install express ejs
2. 創建項目結構:
blog/
├─ views/
│ ├─ index.ejs # 文章列表頁
│ └─ post.ejs # 單篇文章頁
├─ app.js # 入口文件
└─ posts/ # 存放文章的文件夾(每個文章是一個.md或.txt文件)
- 寫入口文件
app.js:
const express = require('express');
const fs = require('fs');
const path = require('path');
const app = express();
app.set('view engine', 'ejs'); // 使用EJS模板
// 首頁:讀取posts文件夾裏的文章,渲染列表
app.get('/', (req, res) => {
fs.readdirSync(path.join(__dirname, 'posts')).forEach(file => {
const content = fs.readFileSync(path.join(__dirname, 'posts', file), 'utf8');
res.render('index', { posts: [{ title: file, content }] }); // 簡化示例
});
});
app.listen(3000, () => console.log('博客運行在 http://localhost:3000'));
- 在
views/index.ejs裏寫文章列表渲染代碼(簡單循環)。
爲什麼適合初學者:不用數據庫,純文件操作,熟悉路由和模板渲染,成就感強。
項目2:命令行待辦事項工具(適合練手:命令行交互 + 文件操作)¶
目標:用命令行添加、查看、刪除待辦事項,數據存在本地文件。
技術:commander(解析命令行參數)、fs模塊(JSON文件存儲)。
步驟:
1. 安裝依賴:npm init -y && npm install commander
2. 寫todo.js:
const { program } = require('commander');
const fs = require('fs');
const path = require('path');
const TODO_FILE = path.join(__dirname, 'todos.json');
// 初始化待辦事項數組
let todos = [];
if (fs.existsSync(TODO_FILE)) {
todos = JSON.parse(fs.readFileSync(TODO_FILE, 'utf8'));
}
// 添加待辦事項(命令:node todo.js add "學習Node.js")
program.command('add <content>').action(content => {
todos.push({ id: Date.now(), content, completed: false });
fs.writeFileSync(TODO_FILE, JSON.stringify(todos));
console.log('添加成功!');
});
// 查看待辦事項(命令:node todo.js list)
program.command('list').action(() => {
console.log(todos.map(t => `[${t.completed ? '✓' : '□'}] ${t.content}`).join('\n'));
});
program.parse(process.argv);
- 測試命令:
node todo.js add "寫博客",node todo.js list。
爲什麼適合初學者:零前端知識,純命令行操作,理解異步文件讀寫和JSON處理。
項目3:簡單RESTful API(適合練手:Express + 數據存儲)¶
目標:做一個用戶管理API,支持添加、查詢、刪除用戶信息。
技術:Express(路由)、fs模塊(JSON文件存數據)、Postman(測試)。
步驟:
1. 安裝Express:npm init -y && npm install express
2. 寫api.js:
const express = require('express');
const app = express();
app.use(express.json()); // 解析JSON請求體
const fs = require('fs');
const path = require('path');
const USER_FILE = path.join(__dirname, 'users.json');
// 初始化用戶數據(如果文件不存在)
if (!fs.existsSync(USER_FILE)) {
fs.writeFileSync(USER_FILE, JSON.stringify([]));
}
// 1. 獲取所有用戶
app.get('/users', (req, res) => {
const users = JSON.parse(fs.readFileSync(USER_FILE, 'utf8'));
res.json(users);
});
// 2. 添加用戶
app.post('/users', (req, res) => {
const newUser = { id: Date.now(), ...req.body };
const users = JSON.parse(fs.readFileSync(USER_FILE, 'utf8'));
users.push(newUser);
fs.writeFileSync(USER_FILE, JSON.stringify(users));
res.json(newUser);
});
app.listen(3000, () => console.log('API運行在 http://localhost:3000'));
- 用Postman測試:
POST /users,請求體傳{name: "小明"},查看用戶列表。
爲什麼適合初學者:理解HTTP請求方法(GET/POST),路由設計,後端數據邏輯。
項目4:即時聊天應用(適合練手:Socket.io + 即時通信)¶
目標:兩個瀏覽器窗口能互相發消息,實現簡單聊天。
技術:Express(服務器)、Socket.io(WebSocket即時通信)。
步驟:
1. 安裝依賴:npm init -y && npm install express socket.io
2. 寫server.js:
const express = require('express');
const http = require('http');
const { Server } = require('socket.io');
const app = express();
const server = http.createServer(app);
const io = new Server(server);
// 靜態文件服務(客戶端頁面)
app.use(express.static('public'));
// 監聽連接
io.on('connection', (socket) => {
console.log('新用戶連接');
// 接收消息
socket.on('chat message', (msg) => {
io.emit('chat message', msg); // 廣播給所有用戶
});
socket.on('disconnect', () => console.log('用戶斷開連接'));
});
server.listen(3000, () => console.log('聊天服務器運行在 http://localhost:3000'));
- 在
public/index.html裏寫聊天界面:
<script src="/socket.io/socket.io.js"></script>
<script>
const socket = io();
const input = document.getElementById('msg');
const button = document.getElementById('send');
button.onclick = () => {
socket.emit('chat message', input.value);
input.value = '';
};
socket.on('chat message', (msg) => {
const div = document.createElement('div');
div.textContent = msg;
document.body.appendChild(div);
});
</script>
- 打開兩個瀏覽器窗口訪問
http://localhost:3000,輸入消息測試。
爲什麼適合初學者:第一次接觸“即時通信”,理解WebSocket原理,不用寫複雜的HTTP請求。
項目5:天氣查詢工具(適合練手:第三方API調用)¶
目標:通過命令行輸入城市名,返回天氣信息(調用公開API)。
技術:axios(發HTTP請求)、process.argv(解析命令行參數)。
步驟:
1. 安裝axios:npm init -y && npm install axios
2. 寫weather.js:
const axios = require('axios');
const apiKey = '你的天氣API密鑰'; // 去和風天氣/高德天氣申請免費密鑰
// 獲取命令行參數(比如:node weather.js 北京)
const city = process.argv[2];
if (!city) {
console.log('請輸入城市名:node weather.js 北京');
process.exit();
}
// 調用天氣API(示例用和風天氣API)
axios.get(`https://devapi.qweather.com/v7/weather/now?location=${city}&key=${apiKey}`)
.then(res => {
const data = res.data;
if (data.code === '200') {
console.log(`天氣:${data.now.text}`);
console.log(`溫度:${data.now.temp}°C`);
} else {
console.log('查詢失敗,請檢查城市名或API密鑰');
}
})
.catch(err => console.log('請求錯誤:', err));
- 替換
apiKey,運行node weather.js 北京。
爲什麼適合初學者:理解“調用外部API”邏輯,處理異步請求,提升數據獲取能力。
四、總結¶
Node.js入門不難,但關鍵是動手實踐!從簡單的命令行工具開始,逐步過渡到Web應用,每個項目都能幫你掌握核心知識點(路由、文件操作、異步請求等)。遇到問題別慌,查文檔、看示例,堅持做5個項目,你就能熟練用Node.js解決實際問題啦!
現在就選一個項目開始動手吧~ 👇