文章目錄

• • 導讀
  • • 立個flag
  • 各種高質量資料
  • • 程序員前端知識圖譜（來自技術胖）
    • 前端pdf集合
    • 黑馬Java后臺視頻集合
    • 黑馬前端視頻集合
    • 尚硅谷前端視頻集合
  • 前端代碼規范
  • 參考資料

導讀

一個小白的自述：

現在的前端無所不能，從網頁到框架，從前端到后端，再到移動互聯網，APP、小程序，數據可視化，甚至最近火的一塌糊涂的元宇宙，只要你能想到的，前端都已經滲透了。

小編一直從事C++相關的開發。20年開始，做了一些項目，這才發現，大前端的便利。因為技術上的要求，也開始寫起前端代碼，當時可以說是0基礎，然后海量的看B站的教學視頻，一上來，看的就是vue-element-amdin，當時是真的一臉蒙圈，收集了大量的視頻，看了個把月，功能也算寫了出來，原理基本不動，也就是最頂層代碼的搬運。

20年開始，到現在，一直用前端寫些工具，也做些后臺功能，大大小小的項目做了五六個，不過依然一知半解的，看過的視頻也是看的懂，很少去練習，過個小半年，基本也就忘完了。

立個flag

今天（2022-1-25），電視劇《開端》完結了，然后又隨便點開了之前看過的視頻程序員前端知識圖譜+B站自學資源整合 新手自學無憂 老手查缺補漏 實現完全自學，忽然感覺，這就是我一直想做的，整理最近所學。說干就干，先立個flag（也算挖坑吧，埋不埋的……盡量……），2022，總結前端知識，系統的學習和做筆記。

各種高質量資料

技術胖，是之前學習前端的UP主，有很多免費視頻，質量很高。之后就跟著這份地圖跑起來。

程序員前端知識圖譜（來自技術胖）

視頻里面對這個圖譜說的優點說的很明白了，gitee上更是有詳細的說明，https://gitee.com/jishupang/web_atlas，打開鏈接即可使用。

這里就只放一張大綱圖片和圖譜的開頭，等看完了再補充一些其他內容吧。

前端pdf集合

• https://github.com/mynane/PDF.git

黑馬Java后臺視頻集合

2022版java最新最全學習路線圖

• 2022黑馬程序員Java學習路線圖

如何下載資料

• 黑馬程序員教程資源下載指南

Java SE基礎-打好JavaSE基礎才能成為開發高手

• Java基礎：Java入門基礎視頻教程，java零基礎自學首選黑馬程序員Java入門教程（含Java項目和Java真題）

Java Web-能制作中小型網站 企業管理系統

• Javaweb：黑馬程序員最新版JavaWeb基礎教程，Java web從入門到企業實戰完整版
• Java開發框架-Java企業級服務端開發必會技能
• Maven：黑馬程序員Maven全套教程，maven項目管理從基礎到高級，Java項目開發必會管理工具maven
• Git：黑馬程序員Git全套教程，完整的git項目管理工具教程，一套精通git
• SSM框架：黑馬程序員最全SSM框架教程|Spring+SpringMVC+MyBatis全套教程(spring+springmvc+mybatis)
• MybatisPlus：黑馬程序員MybatisPlus深入淺出教程，快速上手mybatisplus
• Spring Boot：黑馬程序員SpringBoot2全套視頻教程，springboot零基礎到項目實戰（spring boot2完整版）
• 傳智健康：黑馬程序員Java項目《傳智健康》，超完整的企業級醫療行業項目（基于SSM+Zookeeper+Dubbo+Spring Security技術棧）

中間件 微服務框架-中級程序員必備的熱門技術

• Springcloud：SpringCloud+RabbitMQ+Docker+Redis+搜索+分布式，史上最全面的springcloud微服務技術棧課程|黑馬程序員Java微服務
• Dubbo：黑馬程序員Dubbo快速入門，Java分布式框架必會的dubbo教程
• Zookeeper：黑馬程序員Zookeeper視頻教程，快速入門zookeeper技術
• RabbitMQ：黑馬程序員RabbitMQ全套教程，rabbitmq消息中間件到實戰
• RocketMQ：黑馬程序員RocketMQ系統精講，電商分布式消息中間件，硬核揭秘雙十一
• Docker：黑馬程序員Docker容器化技術，從零學會Docker教程
• Redis：黑馬程序員Redis入門到精通，深入剖析Redis緩存技術，Java企業級解決方案必看的redis教程
• MongoDB：黑馬程序員MongoDB基礎入門到高級進階，一套搞定mongodb
  搜索技術：java中級教程-ELK高級搜索，全面的講解ElasticStack技術棧

項目實戰-企業級項目開發，掌握行業3年開發經驗

• 人力資源：黑馬程序員Java項目SaaS移動辦公完整版《iHRM 人力資源管理系統》，跨行業SaaS辦公整合性解決方案
• 好客租房：黑馬程序員Java項目《好客租房》，Java企業級解決方案（Spring全家桶+分布式解決方案+微信授權+爬蟲解決方案等）
• 權限管理一體化解決方案：黑馬程序員Java品達通用權限項目，基于SpringCloud SpringBoot 的微服務框架的權限管理解決方案

黑馬前端視頻集合

2022版前端最新最全學習路線圖

• 2022年前端學習路線圖

資源下載問題

• 黑馬程序員教程資源下載指南

web 入門

• Html5+css：最新前端開發入門教程，web前端零基礎html5 +css3+前端項目視頻教程
• web 進階：黑馬程序員web前端進階教程，前端html5+css3+移動端項目實戰（含華為新聞，b站移動端等）

技術進階

• JavaScript：黑馬程序員JavaScript全套教程，Web前端必學的JS入門教程，零基礎JavaScript入門
• DOM BOM：黑馬程序員JavaScript核心教程，前端基礎教程，JS必會的DOM BOM操作
• jQuery：黑馬程序員前端基礎必備教程|jQuery網頁開發案例精講
• Ajax：黑馬程序員AJAX零基礎到精通_整合Git核心內容全套教程

Vue 開發

• Node.js: 黑馬程序員Node.js全套入門教程，nodejs最新教程含es6模塊化+npm+express+webpack+promise等_Nodejs實戰案例詳解
• Vue2+Vue3全套：黑馬程序員Vue全套視頻教程，從vue2.0到vue3.0一套全覆蓋，前端必會的框架教程

React 小程序開發

• React：黑馬程序員前端React視頻教程，react零基礎入門原理詳解到好客租房項目實戰
• 零基礎玩轉微信小程序：黑馬程序員前端微信小程序開發教程，微信小程序從基礎到發布全流程_企業級商城實戰(含uni-app項目多端部署)

教程學習可能遇到的問題答疑（非技術型）：黑馬程序員學習常見問題答疑

尚硅谷前端視頻集合

前端學習路線圖【2021版】

• 全網最全Web前端學習路線

前端核心–扎好馬步——》》

• HTML5+CSS3:【尚硅谷】Web前端零基礎入門HTML5+CSS3基礎教程丨初學者從入門到精通
• JS核心:【尚硅谷】JavaScript基礎&實戰丨JS入門到精通全套完整版
• JS高級:尚硅谷JavaScript高級教程(javascript實戰進階)
• jQuery:尚硅谷jQuery教程(jquery從入門到精通)
• Bootstrap: 尚硅谷Bootstrap教程(bootstrap框架講解)
• AJAX: 【尚硅谷】3小時Ajax入門到精通

必備技術–修煉內功——》》

• ES6-ES11: 尚硅谷Web前端ES6教程，涵蓋ES6-ES11
• AngularJS: 尚硅谷AngularJS實戰教程(angular.js框架精講)
• Node.js: 【尚硅谷】最經典Node.JS全套完整版教程(快速入門nodejs)
• Zepto.js: 尚硅谷Zepto教程(zepto.js框架精講)
• MongoDB: 尚硅谷MongoDB入門基礎教程（一天搞定mongodb）
• Webpack: 尚硅谷新版Webpack5實戰教程(從入門到精通)
• Git: 尚硅谷Git教程全套完整版（12h深入掌握git）

前沿框架–習得絕學——》》

• TypeScript: 尚硅谷TypeScript教程（李立超老師TS新課）
• React: 尚硅谷React技術全家桶全套完整版（零基礎入門到精通/男神天禹老師親授）
• Vue全家桶: 尚硅谷Vue2.0+Vue3.0全套教程丨vuejs從入門到精通
• Vue3新特性: 尚硅谷Vue.JS教程快速入門到項目實戰（Vue3/VueJS技術詳解）
• Promise: 尚硅谷Web前端Promise教程從入門到精通
• axios: 尚硅谷Web前端axios入門與源碼解析

項目實戰–身經百戰——》》

• Vue硅谷外賣: 尚硅谷Vue實戰教程(企業級vue項目，Vue項目硅谷外賣)
• Vue尚品匯: 尚硅谷VUE項目實戰，前端項目-尚品匯(大型\重磅)
• React谷粒后臺: 尚硅谷React項目教程(react實戰全棧谷粒后臺)
• 硅谷直聘: 尚硅谷React項目實戰，全棧開發Web前端項目《硅谷直聘》
• 谷粒音樂: 尚硅谷前端項目教程_HTML5項目實戰《谷粒音樂》
• 微信小程序: 尚硅谷小程序開發，微信小程序開發
• 公眾號開發: 尚硅谷微信小程序開發（零基礎小程序開發入門到精通）
• 前端面試題: 尚硅谷經典前端面試題精講第一季(web前端大咖總結)

前端代碼規范

參考視頻《9個前端代碼規范秘籍 讓你也能寫出詩一樣的代碼》https://www.bilibili.com/video/BV19P4y147Jz的內容：

• https://guide.aotu.io/docs/
• http://tgideas.qq.com/doc/index.html
• https://github.com/ecomfe/spec/blob/master/javascript-style-guide.md
• https:// github.com/standard/standard
• https://eslint.bootcss.com/
• https://cn.vuejs.org/v2/style-guide/index.html
• http://es6.ruanyifeng.com/#docs/style

參考資料

• B站技術胖視頻地址： https://www.bilibili.com/video/BV1ub4y1h7ZY
• gitee地址： https://gitee.com/jishupang/web_atlas
• qq群：夜貓逐夢技術交流裙/953949723
  

總結

以上是生活随笔為你收集整理的[前端之旅] - 01 开端 （持续更新各种资料）（夜·猫之使徒·哮喘征服者·被光选中的人·逐梦）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。