【前端】学习路线

news2024/12/25 12:34:25

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/

5.2 Nginx

nginx是一个高性能的HTTP和反向代理服务器,也是一个通用的TCP/UDP代理服务器,最初由俄罗斯人Igor Sysoev编写。

nginx现在几乎是众多大型网站的必用技术,大多数情况下,我们不需要亲自去配置它,但是了解它在应用程序中所担任的角色,以及如何解决这些问题是非常必要的。

Nginx知识:https://juejin.cn/post/6844903793918738440

5.3 浏览器

图解浏览器的基本工作原理

6、性能

1)《高性能网站建设指南》,这本书介绍了网站性能问题的现状、产生的原因,以及改善或解决性能问题的原则、技术技巧和最佳实践

2)深入了解前端监控原理,这篇文章主要讲了如何进行数据采集和数据上报。
https://juejin.cn/post/6899430989404045320

3)5 分钟撸一个前端性能监控工具,这篇文章主要对两个指标进行了监控:页面加载时间和资源请求时间。
https://juejin.cn/post/6844903662020460552

4)常见六大Web安全攻防解析,这篇文章分析了 XSS、CSRF、点击劫持、URL跳转漏洞、SQL注入、OS命令注入攻击等 6 种常见的攻击类型和防御方法,来更好的保护我们的数据。
https://github.com/ljianshu/Blog/issues/56

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1581444.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

react-静态组件,动态组件

react09- 组件 静态组件 动态组件 静态组件: 函数组件,在第一次渲染完成后,组件中的内容,不会根据组件内的某些操作再次进行更新,页面并不会跟着改变 过程: 第一次渲染时,执行函数方法&#x…

二、Docker部署Jenckins(详细步骤)

Docker部署Jenckins、初始化(详细步骤) 一、拉取镜像二、启动Jenkins三、访问Jenkins四、安装插件1.配置源2.插件安装 一、拉取镜像 docker安装教程:https://qingsi.blog.csdn.net/article/details/131270071 - 查询镜像 docker search jen…

【配电网故障定位】基于二进制蝗虫优化算法的配电网故障定位 12节点配电系统故障定位【Matlab代码#75】

文章目录 【获取资源请见文章第5节:资源获取】1. 配电网故障定位2. 二进制蝗虫优化算法3. 部分代码展示4. 仿真结果展示5. 资源获取 【获取资源请见文章第5节:资源获取】 1. 配电网故障定位 配电系统故障定位,即在配电网络发生故障的时候&am…

python基础——python包【创建和导入,下载第三方包】

📝前言: 在上一篇文章python基础——模块中,我们讲解了有关python模块的相关知识,这篇文章我们进一步讲解用于储存多个模块文件的python包: 1,什么是python包 2,如何创建和导入python包 3&#…

Windows系统上运行appium连接iOS真机自动化测试

步骤: 1、windows安装tidevice工具 2、Mac系统打包安装WebDriverAgent(WDA)工具 3、安装Appium 4、连接iOS手机 iOS自动化的实现和执行都依赖Mac系统,因为需要通过Xcodebuild编译安装WDA (WebDriverAgent)到iOS设备中,通过WDA实现对被测应用进行操作。而Windows系统无…

【LAMMPS学习】八、基本知识的讨论(1.8)键的断裂

8. 基本知识的讨论 此部分描述了如何使用 LAMMPS 为用户和开发人员执行各种任务。术语表页面还列出了 MD 术语,以及相应 LAMMPS 手册页的链接。 LAMMPS 源代码分发的 examples 目录中包含的示例输入脚本以及示例脚本页面上突出显示的示例输入脚本还展示了如何设置和…

FreeRtos入门-10 裸机程序的不足

裸机的程序的框架 1) 经典单片机程序 // 经典单片机程序 void main() {while (1){任务1();任务2();} } 缺点:任务1和任务2之间的互相影响 2)前后台结构,前台:中断处理函数,后台main函数 void main()//后…

【oracle数据库安装篇一】Linux5.6基于LVM安装oracle10gR2单机

说明 本篇文章主要介绍了Linux5.6基于LVM安装oracle10gR2单机的配置过程,比较详细,基本上每一个配置部分的步骤都提供了完整的脚本,安装部分都提供了简单的说明和截图,帮助你100%安装成功oracle数据库。 安装过程有不明白的地方…

VBA 实现outlook 当邮件设置category: red 即触发自动创建jira issue

1. 打开: Outlook VBA(Visual Basic for Applications) 方法一: 在邮件直接搜索:Visual Basic editor 方法二: File -> Options -> Customize Ribbon-> 打钩 如下图: 2.设置运行VBA 脚本: File -> Options -> Trust center -> Trus…

Input DropDown 拼接成 select组件(基于antd和react)

前言:为什么不直接用select,还要舍近求远搞inputdropdown这种缝合怪,是因为antd的select不支持选中项再编辑,效果如图 选中的closed文案变成了placeholder不能再编辑了 封装此组件虽然比较简单,但还是有弊端的&#x…

低代码ARM计算机在IIoT中的采集控制生产面板

工业4.0的大潮下工业物联网(IIoT)已成为推动制造业转型升级的重要动力。其中,低代码ARM嵌入式计算机凭借其出色的性能、灵活的配置以及高度集成化的特点,在工业设备远程监控、维护与诊断方面发挥着关键作用。 一、远程监控与维护 …

基于javassmJSP的教学质量评价系统

开发语言:Java 框架:ssm 技术:JSP JDK版本:JDK1.8 服务器:tomcat7 数据库:mysql 5.7(一定要5.7版本) 数据库工具:Navicat11 开发软件:eclipse/myeclip…

2024 抖音欢笑中国年(三):编辑器技巧与实践

前言 本次春节活动中,我们大部分场景使用内部的 SAR Creator互动方案来实现。 SAR Creator 是一款基于 TypeScript 的高性能、轻量化的互动解决方案,目前支持了Web和字节内部跨端框架平台,服务于字节内部的各种互动业务,包括但不限…

4.9学习总结

一.File类 (一).概述: File 类的对象代表操作系统的文件(文件、文件夹),File 类提供了诸如:创建文件对象代表文件,获取文件信息(大小、修改时间)、删除文件、创建文件(文件夹)等功…

JUC-线程的创建、运行与查看

创建和运行线程 Thread创建线程 Thread 创建线程方式:创建线程类,匿名内部类方式 start() 方法底层其实是给 CPU 注册当前线程,并且触发 run() 方法执行线程的启动必须调用 start() 方法,如果线程直接调用 run() 方法&#xff…

SVM向量支持机

1.通俗理解 svm:support vector machine目标:利用超平面将两类数据分割开来,这个超平面就是我们要设计的对象 如何设计?我们设计之后会有间隔,间隔越大分类效果就越好;距离决策边界最近的点我们成为支持向…

云平台和云原生

目录 1.0 云平台 1.1.0 私有云、公有云、混合云 1.1.1 私有云 1.1.2 公有云 1.1.3 混合云 1.2 常见云管理平台 1.3 云管理的好处 1.3.1 多云的统一管理 1.3.2 跨云资源调度和编排需要 1.3.3 实现多云治理 1.3.4 多云的统一监控和运维 1.3.5 统一成本分析和优化 1.…

Armadillo库:用于线性代数和科学计算的快速C/C++库下载及vs环境下的使用方法

armadillo库的下载及使用 一. armadillo库的下载二. vs2022环境下armadillo库的基本使用方法 一. armadillo库的下载 armadillo库的官方下载连接: https://arma.sourceforge.net/download.html 选择网页中最新版本的armadillo库压缩包文件进行下载。 解压armadillo-12.8.2.ta…

GitHub 仓库 (repository) Branch - SSH clone URL - Clone in Desktop - Download ZIP

GitHub 仓库 [repository] Branch - SSH clone URL - Clone in Desktop - Download ZIP 1. Branch2. SSH clone URL3. Clone in Desktop4. Download ZIPReferences 1. Branch 显示当前分支的名称。从这里可以切换仓库内分支,查看其他分支的文件。 2. SSH clo…

小程序解析二维码:jsQR

1.了解jsQR jsQR是一个纯javascript脚本实现的二维码识别库&#xff0c;不仅可以在浏览器端使用&#xff0c;而且支持后端node.js环境。jsQR使用较为简单&#xff0c;有着不错的识别率。 2.效果图 3.二维码 4.下载jsqr包 npm i -d jsqr5.代码 <!-- index.wxml --> &l…