这是我参与「第四届青训营 」笔记创作活动的的第5天
关于前端开发
- 起源、架构、变迁
- 前端应用的领域
- 语言、框架、工具
- 前端学习路线图
起源、架构、变迁
起源
1990 年,第一个web浏览器诞生,Tim 以超文本语言 HTML 为基础在 NeXT 电脑上发明了最原始的 Web 浏览器。
1991 年,WWW诞生,这标志着前端技术的开始。
架构
1989年诞生时,web由三种技术构成:HTML、HTTP、URL
CSS和JavaScript是几年之后才出现的。
变迁
- 只读时代(1989-2004)
主要语言:HTML/CSS/JavaScript
主要特点及应用框架:单项发布、静态只读、链接跳转、刷新页面、表格对齐元素、CGI - 体验时代(2005-2010)
主要语言:Ajax/Web API/jQuery 主要特点及应用框架:动态交互、社交媒体、用户生成内容(UGC)、单页应用(SPA)、jQuery、YUI - 敏捷时代(2010-2021)
主要语言:Fetch/Node.js/Webpack
主要特点及应用框架:模块化、组件化、转译(transpiling)、打包(bundling)、React.js、Vue.js
前端应用的领域
- 网站维护:例如 企业官方网站的/门户类型网站的开发与维护
- 电商网站:需要前端工程师拥有强大的知识储备及能力设计出功能性能和美观兼具的网站页面
- 后台管理系统:给管理人员使用,要确保数据的安全性,系统的可靠性。
- 移动端页面:随着移动端成为日常必须,移动端页面需求量也非常庞大。
- 搭建架构:搭建前端基础设施
语言、框架、工具
语言
主要基本语言:HTML、CSS、JavaScript、web Assembly
框架
- React : React是由Facebook开发和创建的开源框架。根据Stack Overflow Developer 的 2021 年调查,该框架是 2022 年最好的 UI 框架,被大多数前端开发人员使用。
- Angular : 最好的前端开发框架列表是不完整的,没有提到Angular 框架。它是一个基于 TypeScript 的简单直接的框架。Angular 于 2016 年正式发布,由Google建立,旨在将日益增长的技术需求与显示结果的传统概念之间的差距联系起来。与 React 相比,Angular 具有双向数据绑定特性。这意味着视图和模型之间存在实际的时间同步,模型中的任何更改都会在视图上迅速复制,反之亦然。
- Vue.js : 如今,最简单的框架之一是 Vue.js。它体积小,主要有两个好处——可视化 DOM 和基于组件的。
- Ember.js : 可以使用 Ember.js 构建多方面的 Web 和移动应用程序。
- jQuery : jQuery 不仅易于使用,而且还减少了编写广泛的 JavaScript 代码的需求。基本上,jQuery 用于在前端操作DOM 和 CSS 操作,并增强网站的交互性和功能。
工具
html,css,javascript是定义在浏览器中的脚本语言,通过HTTP网络协议与服务器端进行交互