黑马程序员技术交流社区

标题: 2023新版HTML&JS+前端学习路线图（视频+工具+书籍+资源） [打印本页]
作者: 播妞    时间: 2018-3-8 15:46
标题: 2023新版HTML&JS+前端学习路线图（视频+工具+书籍+资源）
更新日志
2018年12月20日，前端与移动开发大纲知识点及配套工具，进行更新；
2019年1月21日，前端与移动开发学习路线图配套资源进行更新，删减不完整商城资源，新增大纲配套资料；
2019年6月19日，前端与移动开发部分失效网盘已经恢复，如有未恢复资源，QQ联系播妞3414556270；
2019年12月20日，前端与移动开发部分失效网盘已经恢复，如有未恢复资源，QQ联系播妞3414556270；2020年6月30日，前端与移动开发部分失效网盘已经恢复，如有未恢复资源，QQ联系播妞3414556270；写在前面：（本帖干货较多耐心阅读收获颇丰，图片点击可放大）
传智播客黑马程序员作为一个IT学习平台，历经13年的成长，免费分享视频教程长达10万余小时，累计下载量超3000万次，受益人数达千万。2020年我们不忘初心，继续前行！路线图的宗旨就是分享，专业，便利，让更多想要学习IT的人都能系统的学习！从今天起不要再找借口，不要再说想学却没有资源，赶快行动起来，前端与移动开发等你来探索，高薪距你只差一步！注：新版前端与移动开发学习大纲于2018年12月20日完成升级，本学习路线图依据最新升级后的规划制作！
一、2023新版前端与移动开发学习路线图---每阶段可掌握的能力及各阶段覆盖的关键字
点击可看高清大图
二、2023新版前端与移动开发学习路线图---学习大纲及各阶段知识点
点击可看高清大图
三、2023新版前端与移动开发学习路线图--升级后新增知识点

四、2023新版前端与移动开发学习路线图---各阶段配套视频推荐
2023年前端与移动开发学习各阶段配套视频推荐
所处阶段配套教程网盘链接
第一阶段html5https://pan.baidu.com/share/init?surl=V679Tyv_ArPOxNm5e7EKGA（提取码：0jh0）
HTML5&CSS3css3
梅兰商城页面开发https://pan.baidu.com/s/1B2mohMLdZ-XbklsxewN_cg  提取码：p6rw
第二阶段：H5C3 进阶https://pan.baidu.com/share/init?surl=7B187RZYzk1hCWiAH6Wq2g（提取码：04t3）
移动 Web 网页开发移动端开发https://pan.baidu.com/share/init?surl=ZX5MdsyJeyPMMIKAbhZQ1Q（提取码：h7vw）
第三阶段：JavaScript基础https://pan.baidu.com/share/init?surl=yG0Er7vxlYpVowcoGjr1rg 提取码：pevg
JavaScript 网页编程JavaScript精讲（知识点精讲+贪吃蛇项目）https://pan.baidu.com/s/1nRKisPm8vRAh58AwRD7S1w
Web APIs编程待更新
JavaScript进阶ES6https://pan.baidu.com/s/1AVNgcRF_zVftsOU6nL21CQ   提取码：ys1q
jQuery网页开发案例精讲https://pan.baidu.com/s/1yV7ARuB-LeK77-_XHm-5CA    提取码：4d71
jquery进阶实用教程https://pan.baidu.com/s/10AofMwLyq-2VmneHHlsHZA      提取码：bfhp
第四阶段：Node.js 基础https://pan.baidu.com/s/1dvkNTcHhEpMvY7-4aWggBg
Node.js 与 AJAXAJAX 编程https://pan.baidu.com/share/init?surl=64MRyodpDzauYt4TNi96NA（提取码：qqvp）
利用jQuery+Ajax+HighCharts打造项目图表https://pan.baidu.com/s/1iBaYGZEMU33T8sLMjVXUag    提取码：oppu
第五阶段：Vue.js 基础https://pan.baidu.com/share/init?surl=3atUZ-IMONSokHRO9O1PVA（提取码：0xd3）
vue.js实战项目Vue.js 项目https://pan.baidu.com/s/1uze2UPaK36q_J8yctVtyjA     提取码：8hm8
Vue.js 移动端项目待更新
Vue.js PC端项目待更新
第六阶段：一天教你打造企业级微信小程序https://pan.baidu.com/s/1yH-o9QUAZO9NGjesXnfP2Q    提取码：dinu
微信小程序零基础玩转微信小程序https://pan.baidu.com/s/1QAlEanZbl74B-IPuwB43PA     提取码：q5x5
带你用vue开发微信小程序（uni-app）https://pan.baidu.com/s/1_wIL3rQqdZ_OZg58mtuH7g      提取码：i2gh
第七阶段：react.js基础https://pan.baidu.com/s/1JCmAQfCvk9EInrVJxp9eOg     提取码：vlyh
react.js项目实战react.js项目实战待更新


五、2023新版前端与移动开发学习路线图---配套工具篇所用软件（2018.12.20更新）

工具篇-学前端所用软件（学前端必备软件全都有）
资源名称
百度网盘一键下载
密码
Chrome浏览器https://pan.baidu.com/s/1G2HyBdIzHIq_EFmACRANtg
360f
简易版编辑器Sublime
https://pan.baidu.com/s/1lmqLOtFkKGmkxNaIGEQjSg
lug4
WebStorm编辑器
https://pan.baidu.com/s/19siWkfpC2ha9wj5t9RGN6g
iopd
Visual Studio Code编辑器https://pan.baidu.com/s/1J0AuxhzltdYwdPkhHdGsGg
niz6
PShttps://pan.baidu.com/s/19TlbxU7rQRHYmUYiGP3m2A
3mtu
MarkManhttps://pan.baidu.com/s/1mP_t4_RqoHVZZeuvW0g4Eg
xi6z
Adobe Fireworks CS6 Ansifa精简版https://pan.baidu.com/s/17IvXzXvnjpAYOiyFBFkRDQ
1865
X-mindhttps://pan.baidu.com/s/1c049MlsG7ZA5qbq1DZezzQ
awe2
Typora
https://pan.baidu.com/s/1Nb36Lpg_S3OWnWBZ9pGKBw
uczh
Git开源的分布式版本控制系统https://pan.baidu.com/s/1EOjCMziILtitm_MVFx781g
nrvf
GitLab
https://pan.baidu.com/s/1Ea8TXe68VAsylOo7_UZe2g
f1yw
SVNhttps://pan.baidu.com/s/1s7S7YvHOi7J1G6LhEcZhYQ
ql19
集成环境软件WampServer
https://pan.baidu.com/s/1BLS4J6FOnDb2KdaUKONmIw
tboh
MySQL
https://pan.baidu.com/s/1yq6WSQVZIXbu07U-Vi0VMg
g2em
Navicat
https://pan.baidu.com/s/1JGc-fiURzWjZu0Nr9IZ_BA
ashb
phpStudy
https://pan.baidu.com/s/1yCInenpqIOuPDddLc9KK_A
jvf1
Node.js
https://pan.baidu.com/s/17v3plvLsZ2O8j6O9MfNEOg
ojx0
微信开发者工具https://pan.baidu.com/s/1FiyYMwIppYXKFb-sHH4moA
wr9c
Postman
https://pan.baidu.com/s/1MfNllXqvkV8FHpsswfJIIg
djes
Httpwatch
https://pan.baidu.com/s/1fvQjpNKjUwhdwfimbL4P0Q
6pjh
六、工具篇-学前端所用手册及书籍（学前端必备手册全都有）

工具篇-学前端所用手册及书籍（学前端必备手册全都有）
资源名称
百度网盘一键下载
密码
html手册https://pan.baidu.com/s/1idtCfccls7G74it4hzBLCg
mdv0
css手册https://pan.baidu.com/s/1rlWo-DLNw_u9Nu7tuflw1A
gg6z
Javascript手册https://pan.baidu.com/s/1SnTDwePBv9TnMqwrZ7o8KA
wxtt
DOM手册https://pan.baidu.com/s/1BS6krawx3TuBg-XRKRxbKg
rc8a
Jquery手册https://pan.baidu.com/s/18CvsJRGxJaeTliZLsHYcvw
myyk
W3Cschool手册https://pan.baidu.com/s/19TS07KPax6WDg73gtWhO7Q
jm9v
CSS权威指南https://pan.baidu.com/s/15X5WgWnMErMm9LFlG6JiXQ
m6d6
深入浅出JavaScripthttps://pan.baidu.com/s/1JHxbzxdpmKkqwFzLLS2xUQ
v58l
JavaScript语言精粹https://pan.baidu.com/s/1_6C0nACXBdNN-kgSccs2tw
mbmg
JavaScript权威指南(第6版)(中文版)https://pan.baidu.com/s/1c98GsUvxXUXkSgN88G5Lrg
uv7g
JavaScript高级程序设计(第3版)https://pan.baidu.com/s/1Lt2wejs_1xmPyJ7DNpOnzg
hrab
JQuery权威指南https://pan.baidu.com/s/1MV0UgAdxiZl7kg29zkbUpg
wi3w
JQuery源码详细中文注释https://pan.baidu.com/s/1mXXe2pKKOyPUN8HPtn7Fxw
t81t
《锋利的jQuery》(高清扫描版)https://pan.baidu.com/s/1I_Hz1fWRjf_zZRoFCupZ1g
77kf
精通正则表达式https://pan.baidu.com/s/1qlZjzsy3d9Be-OlZks_RbQ
64o3
Ajax从入门到精通https://pan.baidu.com/s/1Op6ahC_QDbDDgHLqPkEBPg
ef58
html5权威指南https://pan.baidu.com/s/1DaiTFbZdX4CG5iE40xvhZw
yo6k
HTML5高级程序设计https://pan.baidu.com/s/1C95diPzFb4uAZvFku04dOQ
fzor
HTML5 WebSocket权威指南https://pan.baidu.com/s/134K5_0oR7PTM8WdDL1LM2w
y6s4
Node.js的深入浅出https://pan.baidu.com/s/1BenCZfyA-ZL0KG6xD_UrKg
5nx7
Node.js开发指南https://pan.baidu.com/s/1_dXs3LZtjq1QmjCBNxoePQ
pprw
AngularJS权威教程https://pan.baidu.com/s/17MS_bMEg0WlpVZPu1Ha3eg
nx7u
Vue.js权威指南https://pan.baidu.com/s/1iIGJ7qEOXRJIkOy2ERds7w
scbz
七、技术篇-前端项目源码：前端案例和 demo 源码

技术篇-前端项目源码（前端案例和 demo 源码）
资源名称
百度网盘一键下载
密码
jQuery的仿淘宝商品展示https://pan.baidu.com/s/1ueQx7A6F2M8J_uMnkuZMFA  
n5bf
jQuery的图片放大展示https://pan.baidu.com/s/1L2bF26aNsQT5Tr4XNwPxvQ  
vck7
TodoMVC（js、vue、angular）https://pan.baidu.com/s/1SFHmODL0QNfkYcETAiP8cw  
umm9
vue留言板https://pan.baidu.com/s/1cgYjllMZOUXJzROB6AbSuQ  
5xy7
品优购电商项目静态页面https://pan.baidu.com/s/1Lx6jaGYUrkLoR9MY8xHyDg  
8p1z
vue 后台管理系统https://pan.baidu.com/s/1dIgJ3JGnDNyWoxAydT4JFA  
2aax
微信小程序（TodoMVC 等5个源码）https://pan.baidu.com/s/14FlO31H-gBDT4QTxfbLIkg  
9avl
React_爱租房https://pan.baidu.com/s/18YBx5vNDfj44lA4vqXPEbw  
ge8o
React实战项目_cNodehttps://pan.baidu.com/s/1G3iwLuuDQ0fkEqyT-clDSg  
rs08
换肤效果https://pan.baidu.com/s/1Rr1RlHXimSwGnVmrOC8Lcw  
i6wa
京东商品展示效果https://pan.baidu.com/s/1OcrkijBSekqPVuAyheN4QQ  
a3s3
tab栏切换https://pan.baidu.com/s/1d8Aqt6So3w4W2fvlgJ-Z5g  
gl51
全选反选https://pan.baidu.com/s/1-hoUGytf1HX4qxpm-MPsUw  
hjo2
鼠标跟随https://pan.baidu.com/s/1P54qvBdAuQLs8x3kcXLBow  
xe2a
轮播图https://pan.baidu.com/s/1kgsiYnsVk4wF4vhb4Cz1eg
Tktk
放大镜效果https://pan.baidu.com/s/1QAxfT7qx5-mYkVnQOYT1Qw
u2mr
手风琴效果https://pan.baidu.com/s/1-1IWgRrDQxB3HuWE94seBQ  
zci1
延时触发图片展示https://pan.baidu.com/s/1X6_a1QujZCFgbhLMzABhiw  
8ifo
拖拽排序https://pan.baidu.com/s/1NuF1Pio4vpbu589N_nViwg  
wqr0
旋转木马https://pan.baidu.com/s/19BYMzmTOXhSkgLHDmPVehg  
uroh
八、2023前端与移动开发学习各阶段配套书籍推荐

自十多年来，“为千万学生少走弯路而著书”的初心未曾改变。从创始人张孝祥老师亲自执笔，到如今几十位教材研发人员笔耕不辍，目前已出版77册原创图书，总发行200余万册，被1603所高校选为教材，有123余万名学生通过传智播客的教材敲开了IT开发的大门。多本书籍被各界多次评选为优质教材，誉满业界。关于前端与移动开发学习，播妞推荐以下6本书↓↓（注教材可在社区进行免费兑换：传送门→积分商城）
九、2023年前端与移动开发学习面试题推荐篇
序号
简单介绍
题型介绍
试题链接
1
100IT 名企前端面试真题
面试题，问答题
2
面试题
面试题
3
简历模板
简历模板
注：新版路线图不断完善中，如需其他资源可以回帖留言或者加播妞的QQ~~重要提醒：如本页网盘资料失效，请及时联系播妞QQ3414556270进行资源恢复及更新~~
作者: 似景    时间: 2018-3-8 17:24
作者: 风之称    时间: 2018-3-8 19:07
拉啦啦啦啦啦啦
作者: 叶子飘落    时间: 2018-3-8 22:50
来一波赞
作者: wuzhehai    时间: 2018-3-8 23:10
给力了啊 哈哈
作者: hz有盼头啊    时间: 2018-3-9 07:26
感谢分享
作者: 羁绊    时间: 2018-3-9 09:07
好多好多
作者: xuanzuanmu    时间: 2018-3-9 10:46
厉害了，齐全
作者: yunliqingfeng    时间: 2018-3-9 16:27

来一波赞
作者: 秋凉姐姐    时间: 2018-3-9 18:45
感谢分享！！
作者: ssyw    时间: 2018-3-9 23:10
555555555555555555555555555555555555555555555555555555555555555555
作者: 番茄炒鸡蛋    时间: 2018-3-10 08:15
想换一本书看
作者: wangbiao9292    时间: 2018-3-10 11:50
来看看好东西
作者: 咸蛋小乐乐    时间: 2018-3-10 19:30
1212121212121
作者: 小小的我    时间: 2018-3-10 21:07
非常感谢！
作者: 金海环境    时间: 2018-3-11 17:03
1111111111111111111
作者: Heoloy    时间: 2018-3-11 19:32
先下载个看看
作者: 勿忘初心1314    时间: 2018-3-11 22:06
支持一下
作者: 归期有期    时间: 2018-3-11 23:07

支持一下
作者: sky1    时间: 2018-3-12 00:15
看看啊看看看
作者: a151605    时间: 2018-3-12 08:41
很好的分享.谢谢
作者: 三花五罗    时间: 2018-3-12 10:36
学习学习！！！
作者: GillbertSam    时间: 2018-3-12 15:23
学习一下 干货
作者: lwh95    时间: 2018-3-12 17:52
123123123123
作者: xmma1123    时间: 2018-3-12 17:53

看看啊~~~~~~~
作者: Mainyf    时间: 2018-3-12 18:52
赞一个！！
作者: 设计师陈欢    时间: 2018-3-12 19:41
很好，谢谢分享
作者: lonelyly    时间: 2018-3-13 09:15
很给力。。。
作者: lz1987    时间: 2018-3-13 09:41
想看看密码是什么样子的
作者: djf    时间: 2018-3-13 10:04
很想学习
作者: 黄小凯丶    时间: 2018-3-13 12:58
阿斯达斯大厦的
作者: czxy12100    时间: 2018-3-13 14:57
这么牛，就这样公开？
作者: 哑飞子    时间: 2018-3-13 15:17
貌似很有用的样子，省了很多力气，大谢
作者: ღღღ    时间: 2018-3-13 15:18
赞一波。学习学习
作者: Hugh-He    时间: 2018-3-13 17:55
666666666666666666666666666
作者: chengpeng    时间: 2018-3-13 21:24
gfdhdfdasfsdafg
作者: HiOcean    时间: 2018-3-13 21:57
lalal我看看
作者: mzling    时间: 2018-3-13 22:15
66666666666666666666666
作者: 陌雅橙    时间: 2018-3-13 23:17
2313122313
作者: 谢若川    时间: 2018-3-14 05:25
6666666666
作者: liweitong    时间: 2018-3-14 09:04
666666666666666666666
作者: 小打阿达    时间: 2018-3-14 09:43
好，很好，非常好，越来约好。
作者: 一年多的新手    时间: 2018-3-14 09:56
6666666666666666666
作者: 莫言孤    时间: 2018-3-14 12:08
看看啊看看
作者: p91919    时间: 2018-3-14 13:19
学习分享啊啊
作者: 何必问我呢    时间: 2018-3-14 15:08
你好，我要配套的资料
作者: lunelee    时间: 2018-3-14 16:44
谢谢分享
作者: 永远的BUG    时间: 2018-3-14 19:21
路漫漫啊
作者: Graes    时间: 2018-3-14 22:11
verywellwell
作者: 梦里花火    时间: 2018-3-15 08:25
666666666666666666666666666666666666
作者: a382621445    时间: 2018-3-15 08:30
给力啊。
作者: a947767391    时间: 2018-3-15 11:52
支持一个
作者: KirinMax    时间: 2018-3-15 15:47
我要web前端与移动开发配套公建的资料密码
作者: 前端大菜鸟    时间: 2018-3-15 19:28
作者: 123hl    时间: 2018-3-15 22:47
支持一下
作者: taylor0417    时间: 2018-3-16 00:34
非常感谢分享
作者: ggzhou    时间: 2018-3-16 08:53
工具来一个
作者: wulalahei    时间: 2018-3-16 10:23
楼主好人
作者: deruy    时间: 2018-3-16 16:07
                           
作者: deruy    时间: 2018-3-16 16:08
                                 
作者: 冷冷沙洲    时间: 2018-3-16 16:50
看一看资源
作者: 冷冷沙洲    时间: 2018-3-16 16:51
看看资源
作者: sevensweet    时间: 2018-3-16 22:22
good 非常好绝对的好资料
作者: lzwmmd    时间: 2018-3-17 10:10
真的是超级超级棒棒的
作者: 小马锅锅    时间: 2018-3-17 12:27
想要看一个资源，需要密码
作者: 流星雨521    时间: 2018-3-17 15:36
66666666666666666666666
作者: Steawliet    时间: 2018-3-17 19:10
等React更新
作者: 下酒1959    时间: 2018-3-17 20:32
savdavdsvsdvdsvdsvdsvdsvdsvds
作者: heimaxjx    时间: 2018-3-18 00:15
加油吧!实习生，来来
作者: 赤苏    时间: 2018-3-18 00:31
已报名，坐等开班，先过来下载点资料，预习下先
作者: DingDang    时间: 2018-3-18 09:53
很给力的一个网站，继续努力哟！！！
作者: 唯一hhc    时间: 2018-3-18 10:52
您好，请问前端视频里面的案例素材资源可以给我一份吗？谢谢！
作者: lekeh    时间: 2018-3-18 11:07
不出差不去
作者: SVENGAO    时间: 2018-3-18 15:46
12345,上山大佬，老虎不子啊家啊，打到一直打老虎
作者: 空能净    时间: 2018-3-19 10:51
非常感谢
作者: roseroll    时间: 2018-3-19 11:46
给力了啊 哈哈
作者: qxh911008    时间: 2018-3-19 21:30
密码求密码 十五字啊十五字
作者: qhdlm    时间: 2018-3-19 23:14
东方大道多多
作者: 18296546645    时间: 2018-3-20 09:00
感谢黑马
作者: a1031143690    时间: 2018-3-20 10:13
作者: abby超超    时间: 2018-3-20 13:31
查看资源
作者: 黑马程序员十六    时间: 2018-3-20 14:57
先看到的2017版的 ，还是2018版结构清晰
作者: 陈太白    时间: 2018-3-20 20:15
谢谢楼主，学习路线图很清楚，非常感谢
作者: shens    时间: 2018-3-20 21:53
哇.这个是真的厉害啊
作者: taylor0417    时间: 2018-3-20 22:11
全部视频已经下载好了，不知道上课时内容是否和视频中的一样啊
作者: 将至    时间: 2018-3-20 23:16
下载下来看看
作者: Melo丶7    时间: 2018-3-21 13:18
!!!!!!!!!!!!!!!!!!!!!!!!!
作者: 象牙塔大前    时间: 2018-3-21 15:13
密码密码密码密码密码密码
作者: SUN@@    时间: 2018-3-21 20:47
6666666666666
作者: fly8888    时间: 2018-3-21 22:09
6666666666666666666666666666666
作者: 超级无敌小浣熊    时间: 2018-3-22 15:30
10101001010100101010
作者: qq1411329062    时间: 2018-3-22 17:59
去成分股股份
作者: xuzhuoyu    时间: 2018-3-22 22:52
这个一定要支持一下。
作者: a1031143690    时间: 2018-3-23 14:38
为什么每一天的文件夹里的视频除了第一个和最后一个，其他的都黑屏的
？
作者: dr123    时间: 2018-3-23 14:53
uq3puq3puq3puq3puq3puq3puq3puq3puq3puq3puq3puq3p
作者: 小狮子777    时间: 2018-3-23 15:08
66666666666666666666666666666
作者: 微微和灰灰    时间: 2018-3-23 15:19
...........................
作者: 惠思雨    时间: 2018-3-23 18:23
超级推荐的学习路线，赞赞赞
作者: 惠思雨    时间: 2018-3-23 18:24
react教程什么时候可以出来
作者: qq6666666    时间: 2018-3-24 12:57
66666666期待，希望有所帮助





欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2