推荐软件

• Chrome浏览器：开发必备浏览器
• VSCode编辑器：开发推荐编辑器（编写代码）
• Xmind Zen思维导图：思维导图笔记
• Typora：markdown笔记软件

认识网页和网站

什么是网页？

网页的专业术语叫做 Web Page；

打开浏览器查看到的页面，是网络中的一“页”；

网页的内容可以非常丰富：包括文字、链接、图片、音乐、视频等等

网站是什么呢？

网站是由多个网页组成的

网页的显示过程 – 用户角度

1.用户在浏览器输入一个网站；

2.浏览器会找到对应的服务器地址，请求静态资源（可以存放在世界上任何一个地方）；

3.服务器返回静态资源给浏览器；

4.浏览器对静态资源进行解析和展示；

问题：静态资源来自哪里？

网页的显示过程 – 前端工程师

1.开发项目（HTML/CSS/JavaScript/Vue/React）

2.打包、部署项目到服务器里面

问题：服务器是什么？

服务器是什么？

客户端、前端：比如浏览器、微信、QQ、小程序；

那么服务到底是什么呢？

服务器本质上也是一台类似于你电脑一样的主机；

但是这个主机有几个特点：

• 二十四小时不关机的（稳定运行）；
• 没有显示器；
• 一般装的是Linux操作系统（比如centos）

那么我以后到公司是不是就看得见服务器了呢？

目前公司大部分用的是云服务器（比如阿里云、腾讯云、华为云）；

世界上第一个网页

上世纪90年代，Berners-Lee上线了世界上第一个网站：

http://info.cern.ch/hypertext/WWW/TheProject.html

网页的组成

阶段一：HTML元素；

阶段二：HTML元素 + CSS样式；

阶段三：HTML元素 + CSS样式 + JavaScript语言；

浏览器的作用

浏览器可以将枯燥的代码渲染成多彩的网页

浏览器最核心的部分其实是 “浏览器内核”；

浏览器的渲染引擎

浏览器最核心的部分是渲染引擎（Rendering Engine），一般也称为“浏览器内核”

负责解析网页语法，并渲染（显示）网页

常见的浏览器：

QQ浏览器、百度浏览器、UC浏览器、360浏览器、搜狗浏览器、猎豹浏览器、Chrome

不同浏览器的内核

常见的浏览器内核有：

Trident （ 三叉戟）：IE、360安全浏览器、搜狗高速浏览器、百度浏览器、UC浏览器；

Gecko（ 壁虎） ：Mozilla Firefox；

Presto（急板乐曲）-> Blink （眨眼）：Opera

Webkit ：Safari、360极速浏览器、搜狗高速浏览器、移动端浏览器（Android、iOS）

Webkit -> Blink ：Google Chrome