这是我参与「第四届青训营」笔记创作活动的的第3天
关于前端开发
起源、架构、变迁
- 计算机网络标志性通信协议：TCP/IP
- web标志性通信协议：HTTP 1989年诞生时，web由三种技术构成：
- HTML
- HTTP
- URL （css与JavaScript是几年后才出的）
三个时代
只读时代（1989-2004）
HTML/CSS/JavaScript
- 单向发布
- 静态只读
- 链接跳转
- 刷新页面
- 表格对齐元素
- CGI(公共网关接口)
体验时代(2005-2010)
Ajax/Web API/jQuery
- 动态交互
- 社交媒体
- 用户生成内容（UGC）
- 单页应用（SPA）
- jQuery
- YUI( Yahoo UI 库)
敏捷时代（2010-2021）
Fetch/Node.js/Webpack
- 模块化
- 组件化
- 转译（transpiling）
- 打包（bundling）
- React.js
- Vue.js
前端应用的领域
企业官方网站的开发与维护、门户类型网站的开发与维护、电商网站、后台管理系统、H5的活动营销页、红包落地页、明星投票页等等一系列与营销活动相关的移动端页面、移动端视频播放页面、微信小程序、造轮子写工具、写框架，搭建基础设施
浏览器
首先，浏览器，包括桌面浏览器和移动浏览器，以及移动App中的WebView，都属于浏览器直接渲染Web应用的范畴；
桌面浏览器包括Chrome、Edge、Firefox、Opera、Safari这五个主流浏览器，事实上随着谷歌Chromium开源项目的不断攻城掠地，也随着开源运动的不断属性，浏览器的多样性正在减少。因为Edge和Opera都已经选择站到了谷歌的阵营，所以事实上只有Chrome、Safari和Firefox三个浏览器。
移动浏览器主要是Chrome、Safari，还有国内小程序提供商定制的一些浏览器引擎。换句话说，前端不仅要开发在浏览器和WebView中运行的网页，也要开发在小程序运行时上跑的小程序。
5个常用浏览器以及内核
| 浏览器 | 内核 |
|---|---|
| Chrome谷歌 | Webkit---》Blink |
| Safari苹果 | Webkit |
| Firefox火狐 | Gecko |
| IE | Trident |
| Opera | Presto—>Blink |
服务端
服务端的开发目前主要还是依托于Node.js这个成熟的JS运行时，npm包管理平台已经成为世界最大的程序包管理平台。 当然，还有Express、Koa等Web开发框架的生态。
终端和跨端
终端和跨端，这个应用领域通常是开发者工具，比如命令行工具里的Webpack、Babel、React、Vue都有CLI（Command-Line Interface）版，而桌面跨端主要有Electron和NW.js，目前世界上最流行的编码环境VSCode就是基于Electron的一个Web应用。
-
命令行/终端
- Webpack CLI
- Babel CLI
- Vue CLI
- React CLI
-
桌面跨端
- Electron
- NW.js
-
移动跨端
- React Native
- Fluter
前端开发语言、框架、工具
- HTML（负责页面结构）
- CSS（负责页面样式）
- JavaScript（赋予页面动态与交互能力）
- WebAssembly
- C
- C++
- Rust
- ...低级源语言
(图源字节跳动青训营Web标准与前端开发.pptx)
前端代码运行环境
- 浏览器
- 网络
- 服务器
前端学习路线
网站:roadmap.sh/ 进入后点击Frontend
总结
只有制定更加规范的web标准，才能更有利于前端学习与开发。
以上内容是我对web标准与前端开发的部分笔记。
