2020前端分阶段学习路线方法和资源汇总

前端分阶段学习路线和方法

第一个阶段（看看能不能学走）

  • 开发环境搭建

    • 开发工具
      • vscode
      • webstorm
      • hbuilder
    • 基础的计算机命令

  • html

    • 常用标签（不同刻意去背）
    • 表单
    • 语义化
    • 多媒体
      • audio
      • video
    • 一些常用的api
      • 文件读取
      • 网络状态
      • 本地缓存
      • 拖放
      • 定位
    • Dom（重点）
    • 自定义属性

  • css

    • 基础语法
    • 几种样式定义的区别和优先顺序
      • 行内
      • 行外
      • 外部样式
    • css层叠规则
    • 盒模型
    • 常见的布局方式
    • 响应式布局
      • 媒体查询
      • bootstrap
    • 动画和过渡效果

  • JavaScript（重中之重）

    • 基础语法

    • 常用的数据结构（必须先学）

    • JavaScript的执行机制（了解一下）

    • 面向对象（重点，多语言通用知识点）

    • 原型链

    • 实现继承的几个方式

    • 几个重点

      • 类型转换
      • 作用域
      • 闭包
      • 深浅拷贝

    • 正则表达式

    • 操作Dom和canvas绘制

    • 常见的工具库的使用（可以参考一下我上一期发的推荐视屏）

      • jquery（2020要学，花不了多少时间，了解一下链式编程和操作dom）
      • loadsh

  • 网络相关基础（重要）

    • 常见的通信
    • 常见的响应方式和状态码
      • Json
      • xml
      • 1xx 2xx 3xx
    • ajax通信（重要）
    • restful风格接口
    • rpc风格
    • GraphQL拓展
    • 使用postman调试接口
    • mock数据（重要）

  • 最好还是学一点设计和切图

  • 浏览器相关知识

  • 学习资料

第二个阶段（开始正式踏入前端）

第三阶段（前端的进阶和大前端）

  • 前端进阶
    • 性能优化‘
    • 框架的源码阅读
    • 浏览器原理
    • 造简单的轮子
    • 设计模式
  • 服务器相关
  • 服务端开发（你完全可以再学一门后端语言，但是成本较高，当然我们这里以JavaScript为例，学习其他可以看我前面的视屏）

拓展

需要注意的点

  • 学习资料不一定是最新的是最好的，特别是基础部分

  • 前期的学习可以看视屏入门，后期注重书籍阅读和自主文档的学习（提升一下自身的英语）

  • 前期的开发以实现需求为主，后期的开发就是注重优化和体验

  • 前端比较繁杂，框架更新很快，但是入门以后会发现其实是有共同点的，所以不要害怕

  • 技术的广度和深度都需要探索，但是入门以后一定要深入一个点，必须让自己有不可替代的点

  • 不可闭门造车，多阅读博客和GitHub优秀项目的源码设计

  • 编程语言的发展的不是技术问题，而是政治问题

posted @ 2020-06-28 18:13  lookroot  阅读(622)  评论(0)  编辑  收藏  举报