开课啦

@Opening
教学资源 Resource
Vue.js
Vue.js Router
Pinia
Vite.js
Node.js
Express.js
Vs Code
Chrome
MDN Web Docs
Chaoxing
Snipaste
Yuque
教学详情 Overview
教学详情
课程 前端开发框架与应用
课程代码 054030062
课程性质 专业限制选修
年级专业 23软件工程
学分 3
教学周期 1 - 18
周学时 3
总学时 54 = 18 + 36
行政班级 3班 4班
选修人数 41 48
实训机房 格物1-C404 格物1-C203
教学日 周五 周三
时间 8-9-10 12-13-14
档案编号 82.3 82.4
教学安排 Schedule
to do
课程评价 Evaluation
平时成绩 40%：作业、考勤和表现
60% 作业
30% 考勤
10% 表现
期末成绩 60%
加成 5%：为了鼓励而额外增加的成绩奖励；包括：优秀作业、全勤
5% 加成
作业 Homwork
作业应在规定的时间内，按照要求完成
个人作业独立完成，禁止抄袭；小组作业合理分工，共同完成
作业缺交、不及格、无效等累计达到或超过作业总数1/3，取消课程考试资格
按照教学管理规定，作业缺交的，有1次补交机会
存在抄袭情况的，双方当次作业记0分，取消补交机会
第16教学周统计作业情况
优秀作业（综合评分90+）有加成奖励
请假 Leave
请假应课前提供辅导员签字且加盖学院公章的正规、纸质、无涂改假条
紧急情况下，允许先口头请假；正式假条应在下一个教学日提供，逾期不予采纳
社团、班级等第2课堂活动及其它活动，如果与第1课堂冲突的，不得违规请假占用第1课堂
缺勤、请假、早退等累计达到或超过总次数的1/3，取消课程考试资格
第16教学周统计考勤情况
全勤（100%出勤）有加成奖励
建议 Advice

电脑

耐心

撸码

交流

框架

阅读

思考

教学进度 Agenda
Agenda
Week Content

Topic: IDE

Contents:

1. Vs Code

2. Chrome

3. Project

4. SFC

5. Static Data Server*

Drill:

1. Hello World

Extension:

1. Github

2. Git

3. json-server

Topic: Data Binding

Contents:

1. {{}}

2. v-bind

3. :src

4. :class

5. :style

Drill:

1. GoodsItem.vue

2. Details.vue

Extension:

1. let

2. Number String Boolean

3. Array Object

Topic: Reactivity

Contents:

1. Fetch

2. ref()

3. reactive()

4. computed()

Drill:

Details.vue

Extension:

1. Axios

2. Array

Topic: Rendering

Contents:

1. v-if

2. v-show

3. v-for

Drill:

Goods.vue

Topic: Evetns

Contents:

1. Event

2. v-modal

3. Lifecycle

Drill:

Form.vue

Extension:

Topic: Watch

Contents:

1. Watch

2. Watch effect

Drill:

Cart.vue

Extension:

Topic: Component

Contents:

1. Registration

2. defineProps

3. defineEmits

Drill:

1. GoodsItem.vue

2. MainNav.vue

3. AppNav.vue

4. Copyright.vue*

Topic: Component

Contents:

1. defineModel

2. Provide & Inject

Drill:

1. RecoItems.vue

2. RecoDessert.vue

3. Swiper.vue

4. Loading.vue*

Extension:

Swiper.js

Topic: Component

Contents:

1. Slots

2. Dynamic

3. Async

4. Style

Drill:

1. MenuView.vue

2. HomeView.vue

Extension:

Topic: Router

Contents:

1. Name

2. Redirect

3. Children

4. 404

Drill:

Router/index.js

Topic: Router

Contents:

1. Params

2. Query

3. Props

4. UseRoute

5. UseRouter

Drill:

1. GoodsItem.vue → Details.vue

2. Details.vue → Share

Extension:

. QRCode

Topic: Router

Contents:

1. Style

2. Guard

Drill:

1. Details.vue → Visited

2. router/index.js → Title

3. AppNav.vue、HomeView.vue

4. router/index.js → Progress*

Extension:

1. NProgress

Topic: Pinia

Contents:

1. Concept

2. Usage

Drill:

stores/goods.js

Extension:

persistedstate

Topic: Pinia

Contents:

1. Development

Drill:

1. stores/cart.js

2. stores/order.js

Extension:

Topic: Built-in

Contents:

1. <KeepAlive>

2. <Transition>

3. <TransitionGroup>

4. Persistedstate

Drill:

1.

Extension:

Topic: Third Party

Contents

1. Swiper

2. Iconfont

3. LBS

4. Element plus

5. Express

Topic: Mixin

Contents

1. Project

2. Module

3. Development

4. Publish

5. Q & A

Topic: Final

Form

.as a team

Submit

. project

. report
期末验收 Final
考核内容

开发设计商城类 WebApp；主题自定

考核方式

小组作业(待定)

资料提交

提交项目：项目整体压缩后提交

提交实验报告：按照 实验模板 要求，导出为PDF再提交

实验项目和实验报告统一提交到学习通对应作业

纸质版实验报告双面打印后，由学委检查、整理后提交到格物 4-208 留档

更多详情，请查看 23软工考核方案、项目验收得分表

评分表
序号 成员 综合10 模块40 样式20 逻辑30 选做10 得分
其它 Other
建议携带个人笔记本电脑参加授课
教学相关的任何建议，可以随时反馈
课后有答疑需求的同学，正课时间可以移步格物4-208