大前端 - 带源码课件

前端开发

课程简介

Vue.js 框架：前端开发实践与能力构建这门课程聚焦 Vue.js 框架，面向希望系统掌握前端技能或寻求技能提升的上班族和转行者。它主要解决 Vue 项目从零搭建、组件化开发及状态管理的工作场景问题。课程通过带源码的实战项目，使学员能够独立完成一个基于 Vue-cli 的单页应用开发，并理解路由（Vue-router）和状态管理（Vuex）的实际应用。…

已有 0 人浏览发布 2026-06-13 更新 2026-06-13

Vue.js 框架：前端开发实践与能力构建

这门课程聚焦 Vue.js 框架，面向希望系统掌握前端技能或寻求技能提升的上班族和转行者。它主要解决 Vue 项目从零搭建、组件化开发及状态管理的工作场景问题。课程通过带源码的实战项目，使学员能够独立完成一个基于 Vue-cli 的单页应用开发，并理解路由（Vue-router）和状态管理（Vuex）的实际应用。课程内容以 Vue 2 生态为主，适合作为前端知识体系的补充或强化学习。

能力要求与学习路径

学习本课程需要具备 HTML、CSS 基础，以及对 JavaScript 变量、函数、对象等基本概念的熟悉。课程从 Vue 核心概念和语法（如指令、计算属性）入手，逐步引导学员掌握 Vue-cli 项目构建、组件化开发（Props/Data/Directives）、路由配置及 Vuex 状态管理。建议学习顺序为：优先掌握前四章节内容，包括 Vue 基础、Vue-cli 入门、路由配置和 Vuex 入门，这是构建完整应用的基础。学习过程中，应结合源码进行实践，通过修改源码中的路由或 Vuex store，加深对数据流和项目结构的理解。

资料应用与独立实践

完成学习后，学员能够独立搭建 Vue 项目，开发包含多页面、组件交互及状态管理的应用。课程提供的源码可直接运行，作为学习和模仿的对象。学员应尝试在每章学习后，通过修改源码来验证知识点，例如调整组件间的数据传递方式或自定义路由懒加载。源码中的注释和项目结构（如 Webpack 配置、组件组织方式）有助于理解实际开发中的最佳实践。通过这种结合理论讲解与源码实践的方式，学员可以将所学技能应用于实际工作中，逐步具备独立承担前端开发任务的能力。

大前端 - 带源码课件

???????????????????Vue???

??????

????Vue?????????????????????????????????????

? ?????

????????????Vue???????????????????????Vue-cli????????????????Vuex?????????????????????????Vue??

??????

?Vue???????

??????????

??????

γĿ¼

? ???????????????????(1-4??)
? ??4?? VUE?????
? ??01?? ????
? ??02?? Vue-cli ?????
? ??03?? Vue ??
? ??2?? ??????????
? ??04?? ???????-- ??????
? ??03?? ????Webstorm vs VSCode
? ??02?? ???????????????????????
2-10 docker-compose&docker Hub???_[ .mp4 [252.8 MB]
? ??01?? ??????????????????
? ??1?? ????????
? ??03?? ?????????????????????????????????????????????????
? ??02?? ?????????????
? ??01?? ???????
? ??3?? ???????
? ??04?? Yoeman????
? ??03?? ????????? gulp?????????????????????
? ??01?? ????
? ??02?? ????????? webpack
? ??????????????????Password??5-7???
? ??5?? ???????????
? ??01?? ?????web???? koa???
? ??02?? ??????????????UI???
? ??03?? ??????????????????
? ??6?? ???????-???????????
? ??01?? ?????????????????????????
? ??02?? ??????????????--???????
2-22 docker run??gitlab??_batch_[ .mp4 [193.2 MB]
2-23 docker-compose??gitlab????????????_batch_[ .mp4 [121.5 MB]
2-24 docker-compose???gitlab????????&?????????????_batch_[ .mp4 [118.2 MB]
? ??7?? ???????-?????????????????
? ??03?? ???????????????
? ??05?? Jenkins ?? CI&CD???????
5-7 Jenkins???????&????Docker????????_batch_[ .mp4 [322.8 MB]
5-11 Jenkins&gitlab???????_batch_[ .mp4 [177.2 MB]
5-3 Jenkins???&Docker??????_batch_[ .mp4 [145.0 MB]
? ??04?? CircleCITravisCI???????????
? ??01?? ????????????????????????
? ??06?? ???????
? ??02?? ???????????????????
? ???????Vue3.0????????+TypeScript??????
? ??27?? PC?????Vue3??????
? ??02?? ???&????????
? ??01?? PC?????????????
? ??03?? ??????
? ??26?? Vue3????+Vite????????
? ??02?? todolist????
? ??03?? Vite???
? ??01?? vue????????????
? ??25?? Vue3????????????
? ??02?? Composition API
? ??01?? Vue3 vs Vue2
? ??28?? ???????&WebApp???????
? ?????? ??????????????????14-17???
? ??17?? ????????????????????
? ??16?? ??????????????????&?????????
? ??15?? ????????????????????????
? ??14?? ????????????iview???????????
? ?????????????????????8-13???
? ??11?? ??????????????????????????
? ??12?? ??????????????WebSocket????
? ??9?? JWT?????????????????????
? ??8?? NoSQL?????????????
? ??10?? ?????????????????????????????
? ??13?? ???????--????????
2-6 ??????webpack-dev-middleware&amp;webpack-hot-middleware_.mp4 [95.9 MB]
? ?????? ???WebApp???????????18-24???
? ??18?? WebApp??????????
? ??24?? ???????????????
? ??20?? ??????????????
? ??21?? ??????????????????????
? ??23?? ???????????????
2-4 ???????????nginx????HTTPS?????A???????????_ .mp4 [44.9 MB]
2-3 docker-compose????nginx_ .mp4 [77.7 MB]
? ??22?? ??????????????????????
? ??19?? WebApp????????
4-12 webapp?????????&amp;??????(????TerserWebpackPlugin)_.mp4 [75.6 MB]

??????

Vue???????
Vue????????

ѧϰջ

????Vue??????

???Vue??????

??????????????

????????

????????????????