这是我参与「第四届青训营 」笔记创作活动的第5天
学习前端也有两个礼拜了，但其实投入的有效时间却并不多，经常性处于迷茫状态，不知该做些什么，对前端的概念其实还是处于一个做网页的模糊状态，李松峰老师这节课并没有实际讲解技术细节，却为继续学习点明一个方向。
1.起源、架构、变迁
1989年诞生时，Web 由三种技术构成，即 HTML、HTTP、URL，而 CSS，JavaScript是几年后才出现的。
2.前端应用的领域
To Business ：面向企业或特定用户群体，通常为面向企业，为企业提供相关的服务、产品、平台，其建设成果不会向大众公开，为企业内部所用。
To Customer ： 面向终端客户，直接向消费者提供产品或服务，往往承担引流和转化的任务。
To Developer ： 面向开发者自己，自产自销，是为了解决开发痛点，自己提出解决方案。
浏览器
- 渲染引擎（浏览器内核）：用来解析 HTML 和 CSS。
- JS 引擎：浏览器本身并不会执行JS代码，而是通过内置 JavaScript 引擎(解释器) 来执行 JS 代码。
具体可参考：主流浏览器内核及JS引擎 - 掘金 (juejin.cn)
服务器
随着 Node.js 的出现，使 JavaScript 同时胜任前后端开发的工作成为了可能。Node.js 是 JavaScript 在服务器端的运行环境，在这个意义上，Node.js 的地位其实就是 JavaScript 在服务器端的虚拟机，类似于 Java 语言中的 Java 虚拟机。
终端和跨端
3.语言、框架和工具
语言
前端三剑客：HTML、CSS、JavaScript。
WebAssembly：WebAssembly 是一门不同于 JavaScript 的语言，它被设计为和 JavaScript 一起协同工作，从而使得网络开发者能够利用两种语言的优势：
- JavaScript 是一门高级语言。对于写网络应用程序而言，它足够灵活且富有表达力。它有许多优势——它是动态类型的，不需要编译环节以及一个巨大的能够提供强大框架、库和其他工具的生态系统。
- WebAssembly 是一门低级的类汇编语言。它有一种紧凑的二进制格式，使其能够以接近原生性能的速度运行，并且为诸如 C++和 Rust 等拥有低级的内存模型语言提供了一个编译目标以便它们能够在网络上运行。
推荐阅读WebAssembly 概念 - WebAssembly | MDN (mozilla.org)
框架和工具
学习一个框架，可以去试着了解他的作者，知道作者设计他的初衷。
4.学习路线
经典基石：HTML、CSS、JavaScript 。
版本控制工具：Git、Github 。
计算机基础：计算机网络。
包管理工具：npm/yarn.
框架：React、Vue 。
数据结构与算法
推荐查阅网站Roadmap.sh
5.最后总结
关于自己的学习，无论怎么规划，最终落到实处才是自己的，否则便是自我感动，毫无意义。技术总是在更新换代的，人也总该要往前走的。
