/front-end-world

Primary LanguageShellMIT LicenseMIT

前端的世界

提供前端入门的知识框架，由前端进击团队开发。

该项目使用开源的方式一起建设，由于学习 + 整理知识的方式可帮助大家获得不少成长，所以也希望大家能一起感受到知识建设带来的好处。

0. 非开发补充知识

  • Git 使用
  • TCP 与网络协议

1. 前端入门

前端基本技能

  • HTML
    • 基本语法
  • CSS
    • 盒子模型
    • 内联元素/块状元素
    • 文档流
    • 浮动 float
    • 元素堆叠
    • 块格式化上下文(BFC)
    • 响应式布局
    • Flex 布局
    • Grid 布局
    • CSS 动画
  • Javascript
    • 基本语法
    • 基本类型
    • Javascript 对象
    • 原型和继承
    • 作用域
    • 闭包
    • this
    • ES6+
    • 单线程与异步 Javascript
    • DOM/BOM API

前端基础知识

  • 浏览器
    • 浏览器 DOM 事件流/事件委托
    • 浏览器加载顺序
    • 浏览器渲染过程
    • 浏览器 EventLoop
    • 浏览器同源策略
    • 跨域方案/CORS
    • 浏览器缓存
    • 常见调试技巧
  • HTTP/Ajax
    • HTTP 请求过程
    • 常见 HTTP 协议
    • HTTP 1.0/HTTP 1.1/HTTP2/HTTP3
  • Node.js
  • Web 安全
    • XSS
    • CSRF
    • 其他（SQL 注入/DDoS 等）

2. 前端项目开发

项目基本知识

  • 开发流程（初始化 -> 开发 -> 编译 -> 提交 -> 部署 -> 测试 -> 发布）
  • 常见练手项目
    • 管理端
    • 商场/购物车
    • 个人博客搭建

项目技术栈

  • 前端框架
    • Vue
    • React
    • Angular
  • 小程序开发
  • 前端应用
    • 前端模块化
    • 单页应用
    • 多页应用
    • 前端路由
    • 页面布局/组件划分
  • 前端构建
    • Webpack
      • 功能
      • 原理
      • 插件开发
      • Loader 开发
    • Gulp

3. 前端项目优化/完善

  • 前端测试
    • 单元测试
    • 集成测试
    • e2e 测试
  • 前端发布
    • 灰度发布
    • 前端监控
  • 前端工程化
    • 脚手架
    • 自动化测试
    • CI/CD
  • 性能优化
    • 网络优化
    • 渲染优化
  • 开发效能提升
    • 组件封装
    • 公共库封装
    • 自动化工具开发
  • 前端设计模式
  • Web Workers/Service Workers
  • Typescript

4. 前端面试

  • 面试准备知识
  • 简历如何写
  • 面试题库

如何参与该项目

希望补充更多内容

你可以通过发起 issue 的方式，提出想要学习和补充进大纲的内容。

参与贡献

参与贡献参考。