WEB 前端进阶路线图(持续更新)

大约 3 分钟

# WEB 前端进阶路线图(持续更新)

前言

  1. 本文章不定时更新
  2. 本文定级为笔者经验总结,不代表行业标准,相关建议可以加我微信(c91374286)交流
  3. 等级判断,主要依据 2 个方面进行判断
    1. 解决问题的能力(栗子:某某公司前端负责人,技术总监,一般能够处理大部分前端问题,管理问题,为公司创造效益)
    2. 所做的工作,能够影响到的行业内范围和人数多少(栗子:尤雨溪写业务,写 CSS 可能没有一般人厉害,但是人家就是国际顶尖前端工程师)
  4. 更多有用的编程技巧,欢迎访问 陈随易的网站 (opens new window)
  • 入门(切页面)
    • 入门前期
      • 了解前端基本概念,知道基本标签、样式的含义和作用
      • 了解 html、css 是什么,知道什么是 html 标记,什么是 css 样式
      • 能够说出基本的常用 html 标记的区别和用途
    • 入门中期
      • 熟悉 html、css 基本使用,会使用其写出简单页面
      • 会根据不同的情况,使用不同的布局模式
      • 知道行内元素和块级元素的概念,熟悉各种定位的特点和应用场景
      • 能够写出垂直居中对齐以及水平居中对齐的多种方式
    • 入门后期
      • 熟练切页面,俗称切图仔,能写简单的前端特效,如 tab 切换、轮播图
      • 能考虑到页面的组件布局
      • 熟悉 vue.js 项目开发模式,能基于 vue 进行页面开发
  • 初级(接功能)
    • 初级前期
      • 能根据接口文档,进行页面数据对接和功能逻辑处理
      • 能够基于某个框架生态脚手架(如:vue-cli),进行完整项目开发
    • 初级中期
      • 能够独立处理和解决问题,基本报错和性能优化可以搞定
      • 能够对 axios 进行二次封装,让其更便于项目的业务逻辑操作
    • 初级后期
      • 积累了大量实战经验,针对功能逻辑,能有自己的思考和方案
  • 中级(写工具)
    • 中级前期
      • 具备自定义组件的能力,能够封装出较为通用的前端组件
      • 熟悉 webpack,能够针对项目进行专门的配置和定义
      • 在某个生态领域<比如 vue 生态>,拥有如鱼得水的熟悉度
      • 使用并可以独立配置 gulp/webpack/grant/vite 相关工具进行项目定制化开发
      • 具备基本的项目责任感,用心尽力完成项目进度,提高项目质量
    • 中级中期
      • 基本掌握某个后端语言进行简单的功能开发
      • 基于 gulp/webpack/grant/vite 等,能够封装通用开发模板
    • 中级后期
      • 熟练某个前端框架生态,能够在此生态基础上,总结出提效方案
  • 高级(定规范)
    • 高级前期
      • 基本没有解决不了的前端问题
      • 能够熟练使用 java/php/nodejs/golang/python/ruby 等任一语言进行后端功能开发
    • 高级中期
      • 改变开发方式,基于经验实践,能够开发出受欢迎的,让项目开发大为加速的产品或工具
      • 能够不错地管理团队,并合理分配任务,管控进度
    • 高级后期
      • 制定行业规范,开源项目或技能水平,能够影响行业内部分前端程序员