A股上市公司传智教育（股票代码 003032）旗下技术交流社区北京昌平校区

传智教育官网黑马程序员官网

 找回密码
 加入黑马

QQ登录

只需一步，快速开始

论坛首页 › 学习交流 › 学习路线图 › 前端与移动开发学习路线图 › 正文

2023新版HTML&JS+前端学习路线图（视频+工具+书籍+资源）

© 播妞 程序媛   /  2018-3-8 15:46  /  266058 人查看  /  1149 人回复  /   82 人收藏 转载请遵从CC协议 禁止商业使用本文

更新日志
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进行资源恢复及更新~~

点评

郭付民
很给力  发表于 2019-6-29 08:28
fkydy
heihei  发表于 2019-4-13 08:45
一个人一座城0.0
围观  发表于 2018-11-26 21:30

评分

参与人数 38黑马币 +155 收起 理由
ᝰᧁꫀꪑⅈꪀⅈ + 1 赞一个!
heima_xiao_cai + 5 很给力!
lideyao + 1 怎么很多的都是提取码错误
小小妖精 + 1 赞一个!
寂地思和 + 4 很给力!
番茄orz + 5 很给力!
西柚甜沫沫 + 1 神马都是浮云
实验小白鼠 + 1 很给力!
MKQD07 + 1 很给力!
阿坏 + 5 很给力!

查看全部评分

1149 个回复

倒序浏览
似景 高级黑马 2018-3-8 17:24:24
| 只看该作者
沙发
width:100%">
回复 使用道具 举报
风之称 来自手机 初级黑马 2018-3-8 19:07:17
| 只看该作者
藤椅
拉啦啦啦啦啦啦
width:100%">
回复 使用道具 举报 1 0
叶子飘落 初级黑马 2018-3-8 22:50:18
| 只看该作者
板凳
来一波赞
width:100%">
回复 使用道具 举报
wuzhehai 初级黑马 2018-3-8 23:10:28
| 只看该作者
报纸
给力了啊 哈哈
width:100%">
回复 使用道具 举报 1 0
hz有盼头啊 高级黑马 2018-3-9 07:26:02
| 只看该作者
地板
感谢分享
width:100%">
回复 使用道具 举报
羁绊 高级黑马 2018-3-9 09:07:43
| 只看该作者
7#
好多好多
width:100%">
回复 使用道具 举报
xuanzuanmu 黑马帝 2018-3-9 10:46:45
| 只看该作者
8#
厉害了，齐全
width:100%">
回复 使用道具 举报 1 0
yunliqingfeng 金牌黑马 2018-3-9 16:27:28
| 只看该作者
9#

来一波赞
width:100%">
回复 使用道具 举报
秋凉姐姐 初级黑马 2018-3-9 18:45:30
| 只看该作者
10#
感谢分享！！
width:100%">
回复 使用道具 举报
ssyw 初级黑马 2018-3-9 23:10:13
| 只看该作者
11#
555555555555555555555555555555555555555555555555555555555555555555
width:100%">
回复 使用道具 举报 1 0
番茄炒鸡蛋 高级黑马 2018-3-10 08:15:05
| 只看该作者
12#
想换一本书看
width:100%">
回复 使用道具 举报 1 0
wangbiao9292 初级黑马 2018-3-10 11:50:09
| 只看该作者
13#
来看看好东西
width:100%">
回复 使用道具 举报 1 0
咸蛋小乐乐 初级黑马 2018-3-10 19:30:18
| 只看该作者
14#
1212121212121
width:100%">
回复 使用道具 举报 1 0
小小的我 中级黑马 2018-3-10 21:07:58
| 只看该作者
15#
非常感谢！
width:100%">
回复 使用道具 举报
金海环境 中级黑马 2018-3-11 17:03:18
| 只看该作者
16#
1111111111111111111
width:100%">
回复 使用道具 举报 1 0
Heoloy 中级黑马 2018-3-11 19:32:51
| 只看该作者
17#
先下载个看看
width:100%">
回复 使用道具 举报 1 0
勿忘初心1314 金牌黑马 2018-3-11 22:06:45
| 只看该作者
18#
支持一下
width:100%">
回复 使用道具 举报
归期有期 初级黑马 2018-3-11 23:07:34
| 只看该作者
19#

支持一下
width:100%">
回复 使用道具 举报
sky1 初级黑马 2018-3-12 00:15:36
| 只看该作者
20#
看看啊看看看
width:100%">
回复 使用道具 举报 1 0
下一页 »
12345678910... 58下一页
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 加入黑马