Skip to content

全栈学习路线图

TIP

以下是一个全栈学习路线图,涵盖了前端、后端、数据库和 DevOps 等方面的知识。

前端开发

Details
  • 前端开发
    • HTML
      1. HTML 基础
      2. HTML 语义化
      3. 表单和输入元素
      4. 可访问性
      5. SEO 优化
    • CSS
      1. CSS 基础知识
      2. 布局技术(Flexbox、Grid)
      3. 响应式设计
      4. CSS 预处理器(Sass、Less)
      5. CSS in JS(在JavaScript中应用CSS的方法)
      6. CSS Modules(模块化CSS样式,避免样式冲突)
      7. Styled Components(基于JavaScript的CSS样式库)
      8. Vanilla Extract(零依赖、类型安全的CSS工具库)
      9. Panda CSS(快速、可定制的样式工具库)
      10. CSS框架与组件库:
        • MUI (Material-UI)
        • daisyUI
        • Chakra UI
        • Mantine
        • Tailwind CSS
        • Radix UI
        • Shadcn UI
      11. BEM(块元素修饰符)
      12. CSS架构
        • Sass (CSS预处理器)
        • PostCSS(CSS后处理器)
    • JavaScript
      1. 学习DOM操作 (文档对象模型)
      2. 学习事件处理
      3. 学习AJAX和Fetch API(XHR)
      4. 版本控制系统
        • GitHub
        • GitLab
        • Bitbucket
    • TypeScript
      1. 类型系统
      2. 接口和类型
      3. 泛型
      4. 装饰器
    • git
      1. 学习版本控制
      2. 学习Git命令行
      3. 学习GitHub
      4. 学习Git Flow
      5. 学习GitLab
    • 前端框架
      1. React
      2. Vue.js
      3. Angular
      4. Svelte
      5. Solid JS
      6. Qwik
    • Node.js
      1. 包管理器
        • npm
        • pnpm
        • yarn
      2. 构建工具
        • Module Bundlers(模块打包器)
          • Vite
          • esbuild
          • Webpack
          • Rollup
          • Parcel
        • Task Runners(任务运行器)
          • npm scripts
          • Prettier
          • ESLint
        • Linters和Formatters(代码检查和格式化工具)
    • 网络基础
      1. 互联网如何工作
      2. HTTP/HTTPS
      3. 域名是什么
      4. 什么是托管
      5. 浏览器及其工作原理
      6. DNS及其工作原理
    • Web安全基础
      1. CORS(跨域资源共享)
      2. HTTPS
      3. 内容安全策略
      4. OWASP安全风险
      5. 认证策略(JWT、OAuth、SSO、Basic Auth、Session Auth等)
    • Web组件
      1. HTML模板
      2. 自定义元素
      3. Shadow DOM
    • 服务端渲染(SSR)
    • 测试
      1. Jest
      2. Vitest
      3. Playwright
      4. Cypress
      5. 了解Unit、Integration和Functional测试的区别
    • 静态站点生成器
      1. Astro
      2. Eleventy
      3. Hugo
      4. Jekyll
      5. Next.js
      6. Nuxt.js
      7. Remix
    • GraphQL
      1. Apollo
      2. Relay Modern
    • 渐进式Web应用(PWA)
    • 性能优化
      1. 使用Lighthouse
      2. 使用DevTools
      3. 计算、测量和优化性能
    • 移动应用开发
      1. React Native
      2. Flutter
      3. Ionic
      4. NativeScript
    • 桌面应用开发
      1. Electron
      2. Tauri
      3. Flutter

图片描述

后端开发

Details
  • 后端开发
    • 互联网基础
      1. 互联网如何工作
      2. 什么是HTTP/HTTPS
      3. 什么是域名
      4. 什么是托管
      5. 浏览器和它们如何工作
      6. DNS及其工作原理
    • 学习一门语言
      1. Rust
      2. Go
      3. Java
      4. JavaScript/TypeScript
      5. C#
      6. PHP
      7. Python
      8. Ruby
    • 版本控制系统
      1. GitHub
      2. GitLab
      3. Bitbucket
      4. 快速托管服务
    • 关系型数据库
      1. PostgreSQL
      2. MySQL
      3. MariaDB
      4. MS SQL
      5. Oracle
    • NoSQL数据库
      1. 文档数据库
        • MongoDB
        • CouchDB
      2. 时间序列数据库
        • InfluxDB
        • TimescaleDB
      3. 列式数据库
        • Cassandra
        • HBase
      4. 实时数据库
        • Firebase
        • RethinkDB
      5. 键值存储
        • Redis
        • DynamoDB
      6. 图数据库
        • Neo4j
    • 数据库进阶知识
      1. ORM工具
      2. ACID原则
      3. 事务处理
      4. N+1问题
      5. 数据库规范化
      6. 索引和优化
      7. 数据复制
      8. 分片策略
      9. CAP定理
    • 学习API开发
      1. REST API
      2. JSON API
      3. SOAP
      4. gRPC
      5. GraphQL
      6. 认证方式
        • Cookie Based
        • OAuth
        • Basic Auth
        • Token Auth
        • JWT
        • OpenID
        • SAML
    • 缓存
      1. 客户端缓存
      2. 服务器端缓存
      3. CDN(内容分发网络)
      4. Redis
      5. Memcached
    • Web安全知识
      1. HTTPS
      2. CORS
      3. SSL/TLS
      4. OWASP安全风险
      5. 内容安全策略
      6. 哈希算法家族
      7. MD5及为什么不使用它
    • 测试
      1. 集成测试
      2. 单元测试
      3. 功能测试
      4. 测试策略与方法论
      5. CI/CD(持续集成/持续部署)
    • 操作系统和通用知识
      1. 终端使用
      2. POSIX基础
        • stdin, stdout, stderr, pipes
      3. 进程管理
      4. 线程和并发
      5. 内存管理
      6. 进程间通信
      7. I/O管理
      8. 基本网络概念
      9. 基本终端命令
        • grep, awk, sed, lsof, curl, wget, tail, head, less, find等
    • 软件设计与架构
      1. 设计和开发原则
        • GOF设计模式
        • 领域驱动设计(DDD)
        • 测试驱动开发(TDD)
        • SOLID原则
        • KISS原则
        • YAGNI原则
        • DRY原则
      2. 架构模式
        • 单体应用
        • 微服务
        • SOA(面向服务架构)
        • 无服务架构
        • Serverless
        • 事件驱动
        • 十二要素应用
    • 消息队列与代理
      1. RabbitMQ
      2. Kafka
      3. 服务器发送事件(SSE)
      4. WebSockets
    • 搜索引擎
      1. Elasticsearch
      2. Solr
    • 容器化与虚拟化
      1. Docker
      2. Kubernetes
      3. LXC
    • GraphQL
      1. Apollo
      2. Relay Modern
      3. GraphQL查询
      4. GraphQL变更
    • Web服务器
      1. Nginx
      2. Apache
      3. Caddy
      4. MS IIS
      5. Tomcat
    • 构建可扩展系统
      1. 扩展策略
        • 迁移策略
        • 水平与垂直扩展
      2. 可观测性
        • 指标、日志和其他可观测项
        • 用于调试和解决问题
      3. 负载均衡
      4. 回压机制
      5. 限流
      6. 熔断器

图片描述

全栈开发

Details
  • 全栈开发
    • 基础阶段

      1. HTML
      2. CSS
      3. JavaScript
      4. 检查点 - 静态网页制作
    • 交互性开发

      1. JavaScript进阶
      2. npm包管理器
      3. 检查点 - 交互性功能
    • 协作与版本控制

      1. GitHub
      2. Git
      3. 检查点 - 协作工作
    • 前端框架

      1. React
      2. Tailwind CSS
      3. 检查点 - 前端应用
    • 后端开发

      1. Node.js(推荐作为后端语言,因为已经熟悉JavaScript)
      2. 检查点 - CLI应用
    • 数据库

      1. PostgreSQL
      2. 检查点 - 简单CRUD操作
    • API与认证

      1. RESTful APIs
      2. JWT认证
      3. Redis
      4. 检查点 - 完整应用
    • DevOps基础

      1. Linux基础
      2. 基础AWS服务
        • Route53
        • SES
        • EC2
        • VPC
        • S3
      3. 检查点 - 部署
    • 监控与自动化

      1. Monit
      2. GitHub Actions
      3. Ansible
      4. Terraform
      5. 检查点 - 自动化
      6. 检查点 - CI/CD
      7. 检查点 - 监控
      8. 检查点 - 基础设施
    • 学习路径建议

      1. 按照检查点顺序学习
      2. 每个检查点实践项目巩固知识
      3. 前端框架可在学习一些后端知识后再回头学习
      4. 完成基础路径后可继续深入专业前端、后端或DevOps路线

全栈开发路线图

学习过程中请使用检查点来验证你的学习进度,每个检查点都包含可以用来巩固知识的项目创意。

Last updated:

Released under the MIT License.