一图看懂JavaScript全家桶
程序员八哥
2025-04-07 15:46:24
刚学编程时最痛苦的就是：
前端、后端、框架、混合开发到底都是什么鬼？
我当年也是靠这张图才终于搞清楚 JavaScript 的“门派分布”！
今天分享一张我私藏很久的图，让你一眼看懂 JS 的完整生态系统，不绕路、不踩坑！
⸻
一、基础三件套（Basic）：
• HTML / CSS / JS
网页的“骨架 + 皮肤 + 灵魂”，三者缺一不可。学会这三样，你就能做出静态网页了。
二、前端框架（Front-End）：
• React.js：我个人最爱，社区大、就业岗位最多
• Vue.js：语法更优雅，上手简单，特别适合初学者
• Angular.js：全家桶大哥，适合大型企业项目（不过我用得少）
三、后端开发（Back-End）：
• Node.js：JS 写后端的关键！一门语言走天下！
• Express.js：Node.js 的好搭档，快速搭建 API
• Nest.js：更像后端大型项目的“Spring Boot”，结构更规范
四、混合开发（Hybrid）：
• React Native：用 JS 写 iOS/安卓 App，我的第一款 app 就是用它写的
• Ionic Vue：适合 Vue 用户做 App，轻量、好看
• Electron：想做桌面软件？VSCode、Slack 都是它做的！
五、数据库（Database）：
• MongoDB：最适合 JS 的 NoSQL 数据库，轻巧灵活
• MySQL / PostgreSQL：传统 SQL 数据库，写 API 常用
如何使用这张图？
想转行开发、想做全栈项目、想创业写 App？
从第一行一路往下学，每一块都是一个技能点，组合起来就是“全栈开发”！
建议：
• 先学 React + Node + MongoDB，做一个 Todo App 练练手
• 熟练后可以挑战 Electron + PostgreSQL 做个桌面工具
• 想做 App？选 React Native 或 Ionic Vue 都行
0
阅读：0
