Web 入门 - 学习路线图

主要是提供一个学习方向，教会你成为一名 Web 前端开发所需要了解的一切。

框架和工具不属于入门的内容，这里不会进行专门的介绍。

目录一、什么是 Web 前端开发

前端 是指面向用户的表现层，也就是用户可以直观感受和操作的界面。

而 Web 前端开发 主要指使用 web 技术，也就是通过 HTML，CSS 和 JavaScript，以及衍生的各种技术，进行 客户端产品 的开发。

所以 Web 前端开发 也可以被称为 客户端开发，与之相对应的是使用 原生技术（android 和 ios）进行的 app 开发。

目前 前端 遇到的挑战 是 工具 和 技术 的不断变化，开发人员需要不断了解该领域的发展情况；同时因为涉及技术面的不断扩大，需要许多技术领域的专业能力，所以前端也慢慢的出现了很多细化的岗位。

二、安装基础软件

如果你才刚刚起步，你可能会在各种各样的代码编辑器、框架以及测试工具中困惑不已。

但对于初学 Web 开发并不需要面面俱到，最主要的是选择一款文本编辑器和几款现代 Web 浏览器，这将会在很长一段时间中陪伴着你。

1）安装文本(代码)编辑器

推荐使用 vscode ，免费且提供实时预览和代码提示；vscode 是一个由微软开发，同时支持 Windows 、 Linux 和 macOS 等操作系统的免费代码编辑器。

其他推荐的编辑器有：

2）安装现代 Web 浏览器

推荐使用 谷歌浏览器，火狐浏览器 或基于谷歌内核的浏览器，比如 QQ 浏览器，360 浏览器 等进行开发和预览。

但因工作原因，需要做浏览器兼容，所以需要多下一些浏览器。之所以要这样，是因为浏览器兼容导致的，这个后面有讲。

三、学习专业知识

你可以通过在线视频等方式学习到这些知识，但依然推荐你回过头来认真仔细的阅读下面的内容。

1）文件处理

当你建立一个网站，你需要给这些文件安排一个合理的结构，并确保它们能够相互联系。

一个网站包含很多文件：文本内容、代码、样式表、媒体内容等。文件处理 这块内容将向你解释如何给你的网站建立一个合理的文件结构以及一些你应该要注意的问题。

2）学习 web 技术

通过阅读 Web 和 Web 标准，你将深刻的了解到关于 web 方面的知识。

同时通过阅读 HTML 基础，CSS 基础 和 理解什么是 web 技术。

你在 学习 Web 开发 可以获得完整的入门指引，而 面向 Web 开发者的教程 提供了初中高级的课程。

四、跨浏览器兼容

通过阅读 Web 和 Web 标准 我们了解到了 web 的知识，但很可惜的是，并不是所有浏览器都按照规范来实现的，比如 ie 浏览器。

1）早期的浏览器兼容

这个最早可以追溯到 1995 年的 浏览器大战，大战的结果以微软的 ie 获胜，但此次大战也产生了一些不好的后果。

在大战中，两者在浏览器开发上，为压倒对手，做出了以下两大行为：

把加入新功能的重要性放在修正错误之前。

使用专属格式，不尊重公开标准。

兼容主要是以 IE 为主，为了解决这个兼容性问题，前端发明了很多的手段，如：

2）现在的浏览器兼容问题

现在随着标准的统一和谷歌一家独大，现在的兼容性问题，主要是以兼容不同的 JS 版本为主。

比如在以前 JavaScript 不支持常量定义，但在 es6 里支持了，而常量是使用关键字 const 来定义的，这也就导致常规的手段无法解决这一问题。

所以前端才有了 babeljs 这个工具，它可以让我们开发的时候，使用最新的 api，当我们编译后，也就降级成低版本的 js 代码，这样也就不存在兼容性的问题了。

五、前端涉及到的领域

Atwood 定律：“任何可以使用 JavaScript 来编写的应用，最终会由 JavaScript 编写。”

Atwood's Law 是 Jeff Atwood 在 2007 年提出的: "any application that can be written in JavaScript, will eventually be written in JavaScript."

现在前端的发展，也正在慢慢的证实这一观点的真实性，只要你会 JS，你就可以进行全平台开发。

六、学习渠道

你可以通过下方的网站进行学习，如果是初学者，你可以和我一样，从 李炎恢 老师哪里学习前端知识，瓢城 Web® 俱乐部 是他自己的网站，里面的视频经过一段时间后，会免费开放。

在线视频

社区学习

推荐牛人

附录

参考手册

推荐书籍