前端之路(一)——了解web

hello,大家好！好久没更新了，不知不觉一年又过去了。借此2022开年之际，开启自己的新篇幅，系统复习地总结一下前端基础，css,html,js。该专栏主要是根据MDN Web Docs文档进行学习，如果想自己总结或者学习的话，可以直接移步于此MDN。那么，让我们开始第一章。

什么是web?

web万维网，简单而言就是我们生活中常见的网站。当然建立起一个网站不是那么容易的，如果想要自己建立一个网站就要努力学习各种知识啦。网站上看到的网页是比较容易实现的，只要我们有对应编辑器与浏览器，那么我们写上一个html文件，浏览器会自动帮我们展示出来。这些后续我们一 一展示出来。

web工作原理

简单来说，当我们打开一个网页浏览的时候，我们要知道发生了什么。首先我们要先知道客户端和服务器。客户端就是我们用于连接上网的设备和软件，比如我们的手机。服务器是用来存储网页、站点和应用的计算机，就相当于存储文件的仓库。连接客户端与服务器的就是web，web就是两者之间的路，这条路不是光秃秃的，它是一条繁华的路，由各种各样的元素构成！

• 网络连接: 允许你在互联网上发送和接受数据。没有它两者就无法沟通。
• TCP/IP: 传输控制协议和因特网互连协议用来定义数据如何传输的通信协议。就相当于是沟通方式。
• DNS: 域名系统服务器像是一本网站通讯录。相当于路的地址，浏览器需要先通过域名，找到存放对应网页的服务器。
• HTTP: 超文本传输协议是一个定义客户端和服务器间交流的语言的协议（protocol ）。相当于通过到达目的地后你想说的话
• 组成文件: 一个网页由许多文件组成，就像商店里不同的商品一样。这些文件有两种类型：
  • 代码 : 网页大体由 HTML、CSS、JavaScript组成，不过你会在后面看到不同的技术。
  • 资源 : 这是其他组成网页的东西的集合，比如图像、音乐、视频、Word文档、PDF文件。

接下来的就是前端面试经典题目。在网址上输入url后，发生了什么？这里我们简单说一下。

首先浏览器根据我们前面说的域名，找到存放网页服务器的实际地址，接着发送http请求信息到服务器拷贝一份网页到客户端，之间的传递就是TCP/IP协议，经过“三次挥手，四次握手”，状态码返回200我们就能在客户端看到这个网页啦。

解析文件顺序

我们还需了解下组成文件的解析顺序，浏览器首先会解析HTML文件，通过文件中的link跟script指向外部的css和js文件，将解析的HTML文件生成一个DOM树，CSS生成CSSOM树，并且会编译和执行JS脚本文件。通过这些绘制出界面，用户也就可以跟网页进行交互啦。