这是我参与「第五届青训营 」伴学笔记创作活动的第 11 天,以下是我根据课程内容整理的笔记。
课程介绍
本节课作为「前端入门 - 理论篇」的开篇,将立足前端开发这一行业的宏观视角,讲解前端开发职业的发展脉络和前端开发主要的工作职责,帮助大家在正式学习前端开发技术的之前,对行业整体情况有一个清晰的认知。
课程重点
- 前端的起源、架构及变迁
- 前端的应用领域
- 开发中常用的语言框架及工具
- 前端学习路线推荐
笔记内容
前端的起源、架构及变迁
起源
很多人分不清“上网”是上的哪个网?即使在互联网的诞生地也是如此。Web的普及和深入人心由此可见一斑。
上网指接入Internet,它是地球上相互连接的计算机构成的网络。计算机网络诞生于上个世纪的60年代标志性通信协议是TCP/IP。
架构
1989年诞生时,Web由三种技术构成:HTML、HTTP、URL
CSS和JavaScript是几年之后才出现的。
变迁
| 只读时代 | 体验时代 | 敏捷时代 |
|---|---|---|
| 1989-2004 | 2005-2010 | 2010-2021 |
| HTML/CSS/JavaScript | Ajax/Web APl/jQuery | Fetch/Node.js/Webpack |
| 单向发布 | 动态交互 | 模块化 |
| 静态只读 | 社交媒体 | 组件化 |
| 链接跳转 | 用户生成内容(UGC) | 转译(transpiling) |
| 刷新页面 | 单页应用(SPA) | 打包(bundling) |
| 表格对齐元素 | jQuery | React.js |
| CGI | YUI | Vue.js |
前端应用的领域
To Business、To Customer、To Developer
浏览器
服务器
node.js、express.js、koa
终端和跨端
| 命令行/终端 | 桌面跨端 | 移动跨端 |
|---|---|---|
| Webpack CLI | Electron | React Native |
| Babel CLI | NW.js | Flutter |
| Vue CLI | ||
| React CLI |
开发中常用的语言框架及工具
语言
| HTML | CSS | JavaScript |
|---|---|---|
| structure | presentation/appearance | dynamism/action |
框架
前端学习路线推荐
结语
通过本次课程的学习,真的收获到了许多,以前对一些比较模糊的知识点也逐渐的清晰了起来。