前端语言 | 青训营笔记

这是我参与「第六届青训营」伴学笔记创作活动的第 1 天

前言：

随着前端的不断探索和进化，传统的前端“三剑客”技术也是日新月异，而且彼此之间联系越来越紧密。本次课程帮助复习了前端的基本知识，“温故而知新”，同时也扩展交流一下周边有趣的小知识。

本节课的四个要点：

1. 前端语言的基本能力
2. 前端语言的协作配合
3. HTML5基础（重点）
4. 拓展分享

1）前端语言的基础

HTML（Hyper Text Markup Language超文本标记语言），是一种用来制作超文本文档地简单标记语言。超文本传输协议规定了浏览器在运行HTML文档时所遵循地规则和进行地操作。 创建一个HTML文档，需要两个工具，一个是HTML编辑器，一个web浏览器。 Web浏览器是用来打开web网页文件，提供给我妈查看web资源地客户端程序， 在文档地最外层，文档中地所有文本和HTML标签都包含在其中，它表示该文档是以超文本表示语言HTML编写的。

CSS（Cascading Style Sheet 层叠样式表）

JavaScript

2）前端语言的协作

CSS/JavaScript in HTML

HTML/CSS in JavaScript

3）HTML

标签分类

• 文档型
• 闭合型
  1. 闭合标签
  2. 空标签
• 换行型
  1. 块级标签
  2. 行内标签
• H5新元素
  1. 语义化标签
  2. 媒体标签
  3. 表单标签
  4. 功能标签

HTML5

HTML并非图灵完备，它只是一门标记语言。

了解ARIA并非只是为了共盲人阅读，它可以为我妈设计UI系统提供指导意义。

4）拓展交流

WebAssembly(WASM)是一种新的编码方式，可以直接在浏览器中运行

WEB的风靡

• 对用户友好 无需安装 无需强大硬件 容错率高 传播方便
• 对开发者友好 心智模型成熟 丰富的API能力 框架、工具标准化 开发、调试简单 具备跨平台能力
• 领域成熟度 浏览器产商整合 各类web应用风靡 商用平面设计标准化 全面组件化
• 未来的方向 效率工具 服务端容器化 大前端的统一 三维可视化

今日总结：

今天这节课虽然是基础课但还是有些许的难度，通过短短几十分钟的课程对于我这样刚入门的零基础的小白来说还是有收获的，即使还存在听不懂的地方，但还需要花费更多的时间与精力去学习。对于HTML的学习，最重要的还是标记的学习。