综合实训
侯素玲

1
2
3
4
5

Vue简介

发布时间:2022-08-26 11:18   发布人:侯素玲   浏览次数:247

Vue (发音为 /vjuː/,类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建,并提供了一套声明式的、组件化的编程模型,帮助你高效地开发用户界面。无论是简单还是复杂的界面,Vue 都可以胜任。


 (1) 小白眼中的前端开发 vs 实际的前端开发

小白眼中的前端开发

² 会写HTML   CSS   JavaScript 就会前端开发

² 需要美化页面样式,就拽一个bootstrap 过来

² 需要操作 DOM 或发起 Ajax 请求,再拽一个 jQuery 过来

² 需要快速实现网页布局效果,就拽一个 Layui 过来

实际的前端开发

² 模块化(js的模块化、css 的模块化、资源的模块化)

² 组件化(复用现有的 UI 结构、样式、行为)

² 规范化(目录结构的划分、编码规范化、接口规范化、文档规范化)

² 自动化(自动化构建、自动部署、自动化测试)

  (2)前端工程化

前端工程化指的是:在企业级的前端项目开发中,把前端开发所需的工具、技术、流程、经验等进行规范化、标准化。

企业中的 Vue 项目和 React 项目,都是基于工程化的方式进行开发的。

学习目标

思政目标

   让学生了解就业方向明确学习目标激发学习动力

知识目标

1.掌握 Vue 的基本使用步骤

2.了解Vue的MVVM架构模式

能力目标

1.能够创建Vue实例

2.能够在浏览器中安装Vue调试工具

素质目标

   1. 自主学习能力    

   2. 规范编写代码的能力

   3. 认真细心的工作态度

   4. 团队合作能力

学习内容

任务1-1 观看视频《Vue简介》


   任务1-2 观看视频Vue的特性


任务1-3 观看视频Vue的版本


任务1-4 观看视频Vue的基本使用步骤并动手实践


任务1-5观看视频MVVM


任务1-6观看视频安装并使用vue-devtools并动手实现


学习资源

1. 菜鸟教程    https://www.runoob.com/

2. 哔哩哔哩   Vue2 Vue3基础入门到实战项目全套教程

https://www.bilibili.com/video/BV1HV4y1a7n4?p=4&vd_source=3846ad09bd7bbc0ba1171f5c17b96996

意见反馈

通过您的反馈和意见,希望在以后可以改进我们的课程质量。