2023年Web前端学习路线一览图(附带学习资源)

2

主题

6

帖子

9

积分

新手上路

Rank: 1

积分
9
发表于 2023-3-30 21:29:27 | 显示全部楼层
恭喜你找到了学前端使用说明书!你现在看到的可能是2023年醉详细,醉良心的  前端学习路线图
从小白到大神需要走的路都在这里!
视频+代码+资源全部给你!(视频穿插在文章里,资料在文章结尾)
废话不说,直接上资源!



一、 基础入门阶段——完整系统的HTML+CSS学习



从零基础小白学员出发, 教你从零开始逐步搭建多种多样的网页结构, 全面涵盖目前市场大部分类型的移动端和PC端页面结构。
1. HTML5CSS3 基础结构布局 - PC端 和 移动端

根据 W3C 标准, 按照零基础学员的接受能力, 逐步学习基础技能, 大量的企业级真实案例实战讲解, 反复练习, 并且在练习过程中也是百分百按照开发流程执行. 不光学习到真实的技术, 还学习到企业级真实开发流程. 全方位培养.
2. 布局结构实战 - PC端 和 移动端

课程中穿插多种类型的移动端和 PC 端常见布局结构实战内容. 包含门户网站, 企业网站, 电商网站, 后台管理网站等布局结构, 多方位全面应用学习到的所有内容, 严格按照企业级开发流程设计, 百分百还原设计图. 并且在项目案例中穿插响应式布局结构详细讲解和案例, 真实感受 "一次书写, 多端适配"的开发体验.
二、 JavaScript基础与高级



前端开发的必备技能, 从基础到进阶到原理, 多层面多维度学习, 知其然的同时知其所以然. 实现真正有交互有价值的网站.
1. JavaScript 基础

从零开始, 课程设计内容包含 JS基础知识 从变量, 数据类型及转换, 运算符, 分支, 函数, 对象和数组数据结构, DOM 和 BOM 操作, 基础事件等内容的学习. 从网页动效入手, 体验会 "动" 的网站. 呈现完美的用户交互 .
2. JavaScript 高级内容, 数据结构与算法, 设计模式

回到 JS 代码本质, 从面向对象出发, 学习 JS 的高级编程思想, 让你从 "码农" 转变为 工程师, 将应用层的代码回溯到 "出生" 以前, 领略技术大牛的思考方式, 引发自己的思考从而可以独立面对任何问题, 详细的数据结构与算法, 再加上设计模式的加持, 让你的未来可以轻松入门各个语言.
3. JavaScript ES6 进阶

从 ES6 开始, 逐年的 ES 规范详细讲解, 不光交给你只是, 还要教会你如何去学习, 如何分析知识点, 从而提高独立学习的能力
4. JavaScript 数据交互

本课程采取 2 + 2 + 3 的形式进行教学, 2 天基础知识的讲解, 让我们初步认识交互概念, 2 天的案例书写, 用大量的案例去体会在交互过程中的细节. 3 天的项目将你的所学应用在真实开发过程中. 全部交互内容涵盖, ajax, 跨域, 代理, jsonp, http 原理等内容
三、 node 阶段



用我们最熟悉的语言, 在最数据的时间节点, 去了解和认识后端开发的思想和编程逻辑, 为成为一个真正的全栈工程师铺路
1. node 基础

从 node 基础, linux 操作入手, 逐步接触后边编程思想. 课程设计包含 node 基本代码书写, 基本接口书写, npm 的基本使用, 从基础到生态全方位接触学习.
2. express 搭建服务器

通过 express 框架进行后端接口书写, 覆盖路由领域和中间件机制, 完整体验 MVC 开发模式, 并且切实体验和使用 restful 风格的路由模式编写. 在业务逻辑处理上不管接收前端传递来的信息, 还会利用 mongodb 数据库进行数据持久化操作. 并且利用 token 实现登录鉴权操作. 最后, 我们会在项目中加入文件上传等实用性操作.
四、 Vue 阶段



全方位学习 Vue, 选项式 和 组合式 API 一个不落, 快速精准学习当前市场热门框架之一
前置 : 前置知识点会学习 git 操作, 帮助你完成分布式开发, 体验企业级团队合作
1. Vue3 选项式API + vite - 完成 PC 端项目

vue3 的选项式 API, 让你从 Vue2 完美衔接到 Vue3, 一个基于 vite 的 PC 端项目, 让你尽快适应企业级项目开发流程
2. Vue3 组合式API + vite + TS - 完成移动端项目

Vue3 的组合式 API, 无缝连接到目前市场最前沿的框架开发方式, 并且百分百衔接 TS 进入到项目内, 完善目前市场上所有项目类型.
五、 React 阶段



前言 : react18 + hooks 的模式进行项目开发, 函数式编程的思想让你流连忘返. 老牌框架的实力不容小觑.
前置:详解 webpack 打包构建工具, 让你了解的项目不仅仅是从零到一, 而是从负一开始
1. React 18 + hooks + TS 开发移动端 和 PC 端项目

两个项目的开发, 完美领略老牌项目的优势和强力, 深度理解 react 的五大核心优势, 高效高性能, 复用性极高, 单向数据流, 完善的生态系统, 跨平台的支持. 从多个维度全方位掌握 react 所有内容
2. umi + dva 实战应用

使用 umi 和 dav 两个 React 应用程序开发框架, 帮助你更快更完善的构建 react 项目
六、Web3.0



kerwin设计的课程内容, 从课程走向到真实案例, 全部是目前最新颖, 最流行的项目体验
七、小程序

手把手带你进行小程序开发, 从原生小程序到 uniapp, 从基础到开始, 到顶配项目, 一步一步带你走向前端开发的深渊.

希望以上的前端学习路线图能够帮助更多的小伙伴从小白升级为前端大神。
另外,还想说的是
立志欲坚不欲锐,成功在久不在速,坚持才是胜利
回复

举报 使用道具

您需要登录后才可以回帖 登录 | 立即注册
快速回复 返回顶部 返回列表