零基础自学转前端学习路线

1、HTML+CSS（1个月）

（1）视频：B站李立超老师（[前端基础入门教程 HTML CSS 李立超_哔哩哔哩_bilibili](https://www.bilibili.com/video/BV18T411S71R/?spm_id_from=333.999.0.0&;vd_source=fe7716d1fb7f47158157be0a5684fb46)）

（2）官网：[w3school 在线教程](https://www.w3school.com.cn/)

（3）学完检测方法：自己找一个官网模仿写出一个静态网页（eg：京东、小米等）

2、Javascript（2个月）

（1）视频：B站李立超老师（[JavaScript核心基础_讲师（李立超）_JS教程_哔哩哔哩_bilibili](https://www.bilibili.com/video/BV1mG411h7aD/?spm_id_from=333.999.0.0&;vd_source=fe7716d1fb7f47158157be0a5684fb46)）

 （2）官网：[JavaScript - 学习 Web 开发 | MDN (mozilla.org)](https://developer.mozilla.org/zh-CN/docs/learn/JavaScript)

（3）学完检测方法：

 方法一：将上述静态网页变成一个动态网页

方法二：刷题：

- 1）求职刷题神器：[趣IT官网-互联网求职刷题神器 (funit.cn)](https://www.funit.cn/)  

- 2）Leetcode刷题：配合以下资料

- 微信公众号：labuladong

- YouTube：Back To Back SWE

- B站：花花酱LeetCode + 小Q刷题 + 绵羊教授

- 3）刷题：https://www.funit.cn/

 3、Git（4天）

 （1）视频：B站李立超老师（[Git和GitHub视频教程-李立超_哔哩哔哩_bilibili](https://www.bilibili.com/video/BV1124y117Dr/?spm_id_from=333.999.0.0&;vd_source=fe7716d1fb7f47158157be0a5684fb46)）

（2）官网：[快速入门 - GitHub 文档](https://docs.github.com/zh/get-started/quickstart)

 （3）学完检测方法：多练熟悉这些命令即可，同时可以创建GitHub或Gitee账号

 4、WebPack（3天）

 （1）视频：B站李立超老师（[前端构建工具（webpack&vite）教程 李立超_哔哩哔哩_bilibili](https://www.bilibili.com/video/BV1Kd4y147gg/?spm_id_from=333.999.0.0&;vd_source=fe7716d1fb7f47158157be0a5684fb46)）

 （2）官网：[webpack | webpack 中文文档 | webpack 中文网 (webpackjs.com)](https://www.webpackjs.com/)

 （3）学完检测方法：多练习视频中的命令和代码

 5、Ajax（4天）

 （1）视频：B站李立超老师（[REST和AJAX（包含Fetch和Axios）李立超_哔哩哔哩_bilibili](https://www.bilibili.com/video/BV1Gg411z7fA/?spm_id_from=333.999.0.0&;vd_source=fe7716d1fb7f47158157be0a5684fb46)）

 （2）官网：[Ajax - Web 开发者指南 | MDN (mozilla.org)](https://developer.mozilla.org/zh-CN/docs/Web/Guide/AJAX)

 （3）学完检测方法：多练习视频中的命令和代码

 6、Nodejs（10天）

 （1）视频：B站李立超老师（[REST和AJAX（包含Fetch和Axios）李立超_哔哩哔哩_bilibili](https://www.bilibili.com/video/BV1Gg411z7fA/?spm_id_from=333.999.0.0&;vd_source=fe7716d1fb7f47158157be0a5684fb46)）

 （2）官网：[Nodejs官网 - 搜索 (bing.com)](https://cn.bing.com/search?q=Nodejs%E5%AE%98%E7%BD%91&qs=n&form=QBRE&sp=-1&lq=0&pq=nodejs%E5%AE%98%E7%BD%91&sc=10-8&sk=&cvid=6BACD20BD1DF458B931F860875CA7604&ghsh=0&ghacc=0&ghpl=)

 （3）学完检测方法：多练习视频中的命令和代码

7、Vue（1个月）

 （1）视频：B站尚硅谷（[尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通_哔哩哔哩_bilibili](https://www.bilibili.com/video/BV1Zy4y1K7SH/?spm_id_from=333.337.search-card.all.click&;vd_source=fe7716d1fb7f47158157be0a5684fb46)）

 （2）官网：[Vue.js - 渐进式 JavaScript 框架 | Vue.js (vuejs.org)](https://cn.vuejs.org/)

（3）学完检测方法：写项目

 8、其它工具

 （1）Obsidian做笔记

 （2）Vscode写代码