Menu
CoddyTech
学习路径

MERN 技术栈开发学习路线

按 MERN 技术栈开发者真正需要的顺序排列的免费课程:用 HTML、CSS 和 JavaScript 搭页面,用 React 写界面,然后用 Node.js 和 Express 做服务器,用 MongoDB 存数据,再用登录功能保护数据安全。从第一个标签到最后一个 API 路由,只用 JavaScript 一门语言,每节课都在浏览器中运行。

603,442+ 名学习者已报名这些课程

755 节课845 个挑战3,290 道测验题

MERN 技术栈学习路线,一步一步来

5 门课程16 个单元755 节课845 个挑战3,290 道测验题

每一步都是 Coddy 现有课程中的一个单元。你可以按顺序学,也可以直接跳到你还缺的那一步:无论哪种方式,进度都会按课程分别保存。

  1. 1
    开始这一步开始元素、链接、表单和语义化标记,然后是选择器、盒模型、flexbox、grid 和响应式布局。之后 React 会替你生成 HTML,所以这就是它使用的语言。开始专属页面
  2. 2
  3. 3
  4. 4
    开始这一步开始组件、JSX、props、state、事件、列表和受控表单,最后一步一步做出一张小小的社交卡片。React 是你的 API 要服务的界面。开始专属页面
  5. 5
    开始这一步开始浏览器之外的 JavaScript:命令行参数、模块、读写文件、回调、Promise、async 和 await、事件循环和事件。你会做一个命令行笔记工具。开始专属页面
  6. 6
  7. 7
    开始这一步开始通过 Express API 操作文档和集合:插入、ObjectId、过滤条件、更新运算符、唯一索引、聚合和 $lookup。然后是谁可以查看数据:密码哈希、会话、JWT、所有者和管理员角色、安全响应头和限流。开始
  8. 8
你将获得
学编程所需的一切

在实践中学习

编写真实代码、查询数据库、搭建网站、掌握 AI 提示词。我们的互动课程涵盖现代开发者需要的每一项技能。

playground.js
代码编辑器
1const greeting = "Hello, Coddy!"
2function sayHi(name) {
3    return greeting + " " + name
4}
5
bottombar Collapse icon
测试 #1test Case Success icon
测试 #2test Case Success icon
测试 #3test Case Failure icon
输入
"Alex"
输出
"Hello, Coddy! Alex"

打造你的连胜

坚持下去,看着自己不断进步!记录每天的编程习惯,用冻结天数保护连胜,每天打卡都能赢取奖励。

12 天连胜

明天再来,保持你的连胜!

fire Filled icon
left icon

January 2026

right icon

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

21

22

23

24

25

26

27

28

29

30

product Double Or Nothing icon

加倍或归零

第 5 天,共 7 天

fire Freeze icon

连胜冻结

2 left

你并不孤单

在全球排行榜上一较高下,邀请好友赢取奖励,为彼此的成就喝彩。和好友一起编程更有趣!

挑战者联赛
挑战者联赛前 7 名晋级
leaderboard First icon1
avatar 1 icon
fire Filled icon
Alex7+ Days
2840
leaderboard Second icon2
avatar 2 icon
fire Filled icon
Jordan7+ Days
2650
leaderboard Third icon3
avatar 3 icon
fire Filled icon
Sam7+ Days
2420
4
avatar 4 icon
Casey
2180
5
avatar placeholder icon
fire Filled icon
Morgan7+ Days
1950
leaderboard Arrow Up icon晋级区leaderboard Arrow Up icon

多种学习方式

阅读、收听、自我测验、问 AI,或者查阅学过的任何内容。每节课都配合你的节奏。

变量入门
音频

变量是一个有名字的容器,用来存储值,方便你在程序后面引用。

在 Python 中,创建变量只需写下名字、一个等号,再写上要存储的值。

值可以随时间变化。给这个名字重新赋值,它就会指向新的值。

1xSarah

获得证书

每完成一门课程都能获得证书。把证书添加到你的 LinkedIn 个人资料和简历中,向雇主展示你的编程能力。

Coddy结业证书
兹证明张三已成功完成
python iconPython 基础
已验证
日期2026年1月
LinkedIn添加到 LinkedIn

为什么在 Coddy 学 MERN 技术栈

  • 每一层都在你的代码旁边运行。React 组件边写边渲染,Express 服务器会响应一个请求栏,你可以在里面选择方法、请求头和 JSON 请求体,MongoDB 查询则在一个可以从“数据”标签页打开的数据库上运行。什么都不用安装,学校的笔记本电脑也能用。
  • 整个技术栈只用一门语言。这条路径的前几步都在学 JavaScript 和浏览器,所以等到学 Node.js 时,服务器只是新概念,而不是一门新语言:同样的函数、对象和异步代码,现在用来响应请求。
  • 每个后端单元都有一个项目:命令行笔记工具、菜谱网站、任务追踪 API、基于 MongoDB 的图书评分 API,以及带账号系统的笔记应用。每个项目都一节课一节课地搭建起来,并通过向你的服务器发送真实请求的检查来批改。
  • 能读懂你代码的提示。当路由返回 404、查询什么都没返回,或者登录放进了不该进的用户时,AI 导师 Bugsy 会看你写的代码,把你指向出问题的那一行,但不会替你写好修复代码。

关于 MERN 技术栈的常见问题

MERN 技术栈是什么?

一种用四个工具、全程使用 JavaScript 构建完整 Web 应用的方式:MongoDB 以文档形式存储数据,Express 把 Node.js 程序变成 Web 服务器和 API,React 构建在浏览器中运行的界面,Node.js 在服务器上运行 JavaScript。浏览器中的 React 代码调用 Express API,而 Express API 负责读写 MongoDB。

MERN 的全称是什么?

MERN 代表 MongoDB、Express、React 和 Node.js。这个顺序是单词的字母顺序,而不是学习顺序:在这条路径上,你先学页面(HTML、CSS、JavaScript 和 React),然后转向服务器(Node.js 和 Express)和数据库(MongoDB)。

MERN 技术栈开发者做什么?

从数据库到屏幕构建功能:设计 MongoDB 文档,编写对它们进行增删改查的 Express 路由,用登录功能保护这些路由,再构建调用它们的 React 页面。因为四个工具都是 JavaScript,一个开发者就能跟着一个功能走完每一层。

MERN 技术栈还值得学吗?

值得。React 和 Node.js 是 Web 开发中使用最广泛的两个工具,Express 和 MongoDB 是它们最常见的搭档,所以即使团队用的是别的数据库或框架,这些技能也能直接用上。从头到尾学通一个技术栈,还能让你明白任何 Web 应用是怎样组合在一起的,而这正是面试要考的。

应该学 MERN 技术栈还是 MEAN 技术栈?

对现在入门的大多数人来说,学 MERN。这两个技术栈都用 MongoDB、Express 和 Node.js,区别只在前端:MERN 用 React,MEAN 用 Angular。React 是两者中使用更广泛、也更容易入门的那个,以后转向 Angular 也只是学一个新框架,而不是一整个新技术栈。

学 MERN 技术栈需要多长时间?

每天一小时,学完这条路径大约需要八到十个月。HTML 和 CSS 约六周,JavaScript 和浏览器两到三个月,React 约一个月,五个 Node.js 单元(Node.js、Express、REST API、MongoDB、登录)再要三个月。如果你已经会 JavaScript,从 React 这一步开始,大约四个月就够了。

可以不安装任何东西就学 MERN 技术栈吗?

在这条路径上可以。每节课都在浏览器中运行:React 在编辑器旁渲染,你的 Node.js 程序在终端中运行,你的服务器会响应请求栏,MongoDB 单元则使用一个支持 MongoDB 驱动 API 的内存数据库。以后做自己的应用时,再在电脑上安装 Node.js 和 MongoDB,代码可以直接沿用。

完成MERN 技术栈开发者路径能获得证书吗?

能。完成每一步,你就能获得整条MERN 技术栈开发者路径的一张免费证书。证书会列出你沿途完成的每门课程,并链接到每门课程各自的证书,任何人都能核实上面列出的每项技能。你可以把它添加到 LinkedIn 个人资料。这是 Coddy 颁发的结业证书,不是经过认证的学历资格。

其他学习路径

同样的课程,按不同职业方向编排。进度会保留:在一条路径上完成的课程,在所有包含它的路径上都算完成。

全部学习路径
Coddy 编程语言插图

免费开始MERN 技术栈开发者路径

开始学习