All Projects → front-end-fighting → front-end-world

front-end-fighting / front-end-world

Licence: MIT license
前端入门知识框架

Programming Languages

shell
77523 projects

Projects that are alternatives of or similar to front-end-world

Portfolio
Front-end developer portfolio website
Stars: ✭ 53 (+12.77%)
Mutual labels:  front-end, front-end-development
Roadmap Web Developer 2017
Front-end (HTML5/CSS3/Javascript related) technologies to learn in 2017
Stars: ✭ 142 (+202.13%)
Mutual labels:  front-end, front-end-development
Dev Practice
Practice your skills with these ideas.
Stars: ✭ 1,127 (+2297.87%)
Mutual labels:  front-end, front-end-development
frontend-starter-kit-with-gulp
Frontend Starter Kit with Gulp for either Themeforest Projects or customizable projects.
Stars: ✭ 34 (-27.66%)
Mutual labels:  front-end, front-end-development
frontie
Frontie is a front-end boilerplate. Gulp | Twig.js | Sass | Autoprefixer | Browsersync | Bootstrap 4 Grid System & Responsive Breakpoints
Stars: ✭ 28 (-40.43%)
Mutual labels:  front-end, front-end-development
Front End Interview Handbook
⚡️ Front End interview preparation materials for busy engineers
Stars: ✭ 32,265 (+68548.94%)
Mutual labels:  front-end, front-end-development
Fast
Develop, build, deploy, redeploy, and teardown frontend projects fast.
Stars: ✭ 126 (+168.09%)
Mutual labels:  front-end, front-end-development
Snapchat Clone
👻 A SnapChat clone built with React, Redux and Typescript. Styled with SASS. Tested with Cypress, Jest and Enzyme. Linted with Eslint and formatted with Prettier!
Stars: ✭ 770 (+1538.3%)
Mutual labels:  front-end, front-end-development
composer-asset-compiler
Composer plugin that installs dependencies and compiles assets based on configuration.
Stars: ✭ 19 (-59.57%)
Mutual labels:  front-end, front-end-development
100 Days Of Code Frontend
Curriculum for learning front-end development during #100DaysOfCode.
Stars: ✭ 2,419 (+5046.81%)
Mutual labels:  front-end, front-end-development
The Front End Architect Resource List
Front End Architecture resources
Stars: ✭ 21 (-55.32%)
Mutual labels:  front-end, front-end-development
ta-gallery
You can use the light-weight, responsive and mobile first gallery, carousel, slide show or rotator for images, texts and every kind of content.
Stars: ✭ 87 (+85.11%)
Mutual labels:  front-end, front-end-development
Easy Dom
EASYDOM-可能是最适合你的 DOM 课程
Stars: ✭ 21 (-55.32%)
Mutual labels:  front-end, front-end-development
Spionio
Lightweight focus group management platform that can capture and replay user interaction on your site and improve the UX in everything you build
Stars: ✭ 40 (-14.89%)
Mutual labels:  front-end, front-end-development
Slim.js
Fast & Robust Front-End Micro-framework based on modern standards
Stars: ✭ 789 (+1578.72%)
Mutual labels:  front-end, front-end-development
Patternfly Design
Use this repo to file all new feature or design change requests for the PatternFly project
Stars: ✭ 82 (+74.47%)
Mutual labels:  front-end, front-end-development
Front End Handbook 2019
[Book] 2019 edition of our front-end development handbook
Stars: ✭ 3,964 (+8334.04%)
Mutual labels:  front-end, front-end-development
Front End Handbook 2018
2018 edition of our front-end development handbook
Stars: ✭ 4,172 (+8776.6%)
Mutual labels:  front-end, front-end-development
Portfolio
📰 Meu portfólio criado com o objetivo de mostrar meus projetos recentes e futuros ao longo da minha carreira.
Stars: ✭ 178 (+278.72%)
Mutual labels:  front-end, front-end-development
frontend-tips
Super tiny, quick tips, tricks and best practices of front-end development
Stars: ✭ 511 (+987.23%)
Mutual labels:  front-end, front-end-development

前端的世界

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

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

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 的方式,提出想要学习和补充进大纲的内容。

参与贡献

参与贡献参考

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].