【前端】学习路线

news2024/10/6 8:27:13

1、基础

1.1 HTML

菜鸟教程-主页：https://www.runoob.com/

可以学习：HTML、CSS、Bootstrap等
在这里插入图片描述

1.2 CSS

《通用 CSS 笔记、建议与指导》
在这里插入图片描述

1.3 JavaScript

1）入门：JavaScript 的基本语法
2）进阶：现代 JavaScript 教程：以最新的 JavaScript 标准为基准。通过简单但足够详细的内容，为你讲解从基础到高阶的 JavaScript 相关知识。

1.4 ECMAScript 6

ECMAScript 6.0（简称 ES6）是 JavaScript 语言的下一代标准，它的目标是让 JavaScript 可以用来编写复杂的大型应用程序，成为企业级的编程语言。
ES6 入门教程
在这里插入图片描述

1.5 TypeScript

TypeScript 是 JavaScript 的超集，也可以编译成普通的 JavaScript 代码
TypeScript 中文版

1.6 nodejs

七天学会NodeJS：http://nqdeng.github.io/7-days-nodejs/

2、框架

了解关于 HTML、CSS 和 JavaScript 的中级知识，就可以学习框架了

2.1 Vue

Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。

Vue 2 已于 2023 年 12 月 31 日达到终止支持时间，且不再维护，建议直接学习 Vue 3
Vue官网：https://cn.vuejs.org/

2.2 Angular

Angular适用于电子商务网站：https://angular.cn/start

前提条件：了解HTML、JavaScript、TypeScript

Angular教程将通过构建一个电子商务网站，介绍 Angular 的基本知识。该网站具有商品名录、购物车和结账表单。
本教程提供了一个已完成的应用，可以在 Stackblitz 上试验及互动，而不用建立本地开发环境。StackBlitz 是一个基于浏览器的开发环境，你可以在其中使用各种技术来创建、保存和共享项目。

2.3 React

React：用于构建 Web 和原生交互界面的库

官网主页：https://zh-hans.react.dev/
官网教程：https://zh-hans.reactjs.org/tutorial/tutorial.html

React 和 Vue 的区别：https://blog.csdn.net/itcast_cn/article/details/130411713

3、微信小程序开发资源汇总

https://github.com/justjavac/awesome-wechat-weapp
本文收集了微信小程序开发过程中会使用到的资料、问题以及第三方组件库。本文不是一篇关于如何学习微信小程序的入门指南，也非参考手册，只是一些资料的整理。

4、腾讯移动 Web 前端知识库

https://github.com/AlloyTeam/Mars
在这里插入图片描述

5、前端工程

5.1 Webpack

Webpack 是一个前端资源加载/打包工具，它根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源。

本质上，webpack 是一个用于现代 JavaScript 应用程序的静态模块打包工具。当 webpack 处理应用程序时，它会在内部从一个或多个入口点构建一个依赖图(dependency graph)，然后将你项目中所需的每一个模块组合成一个或多个 bundles，它们均为静态资源，用于展示你的内容。

Webpack 中文文档：https://www.webpackjs.com/concepts/