前端学习路线-目录

发表于 更新于

本系列关注前端部分,根据学习路线图达到学习Vue.js的目的

developer路线图developer-roadmap/translations/chinese at master · kamranahmedse/developer-roadmap

三个学习阶段

编程初学者的三个学习阶段

第一部分 前端基础知识

这个部分,介绍什么是互联网，以及补充一些必须的知识。

  1. 互联网是如何工作的-mdn-web-docs
    互联网是如何工作的-衍生阅读

  2. 什么是http

  3. 浏览器及其运行机制

  4. what-is-the-dns

  5. 网站托管

第二部分 HTML CSS JavaScript

学习要求

MDN推荐我们将HTML/CSS/JS三大件混合起来学习,这样,互相之间可以相互印证,互相间加深学习

HTML+CSS

首先快速的过一下HTML和CSS。

HTML中的大部分标签在现代前端开发都已经淘汰了，新手只需要：

  • 了解大部分常用标签。如H1、H2、列表、表单
  • 会用div、span

CSS对新手只要求理解盒子模型，对于其他内容要求有印象，能够随用随查即可。（去查mdn文档）

总的来说，要求对HTML+CSS做到：

  • 了解常见的一些基础概念
  • 能够在使用的时候查询mdn文档或者其他文档，随用随查

JS

要求对JS做到：

  • 动手实操写过所有JS基础语法
  • 对JS大部分基础语法熟练掌握
  • 理解JS中一部分难点，易错点

对于新手学习JS，建议跟着现代JS教程过一遍基础部分。

不选择mdn作为学习教程，是因为其对于新手来说有点乏味，mdn适合作为文档随用随查。

推荐视频

如果你的学习动力比较弱，可以跟随这个视频，过一遍HTML+CSS+JS部分，然后再回过头来看上面的学习要求和推荐教程。

mdn文档

MDN推荐我们将HTML/CSS/JS三大件混合起来学习,这样,互相之间可以相互印证,互相间加深学习。

建议新手阅读顺序如下：

  1. HTML入门:学习html基础

    1. 预科补充:html简介
    2. 随时学习:书写语义化的html

  2. CSS入门:学习CSS基础

  3. JS入门javascript-语法和基本构造

  4. HTML深入:表单验证

  5. HTML深入:前端-惯例和最佳实践

  6. CSS进阶:css-制作布局

  7. CSS深入:css-响应式设计和媒体查询

第三部分 学习前端框架–以vue.js为例

第四三部分 掌握工具链

这部分和你未来掌握的框架无关，而是前端开发者日常开发所需要掌握的。

  1. Node工具链:记录windows上nodejs版本管理器nvm安装配置