---
# System prepended metadata

title: 第七週小組任務
tags: [React 直播班 - 2024 冬季班]

---

# 第七週小組任務


使用 discord、ZOOM 來討論，組員沒麥克風也可以一個人分享畫面，其他組員用文字討論，解答此問題集

**回報流程：**
1. 請組長到下方回報解答連結，**一個小組請派一人提交(依據當周條件提交)**。回報內容需含：
    1. 該問題集的答案
    2. 提供 1~3 張 discord 或 ZOOM 對話截圖，確保有進行小組討論
    3. 組員參與名單
2. 助教檢視過後，就會回覆 ✅ 來回報審核成功與否。



**常見問題：**
Q：約時間討論的組員至少要幾位？
A：至少兩位就可成團！

Q：如果沒有分組，可以一起玩嗎？
A：可以

## 問題

### 挑戰一：專題的延伸技法、套件

最終專題中的可以自己想像許多技巧加入，以下是課程中會介紹的技巧以及範例：

- 關於/品牌/產品介紹…：[https://hoongyuu.github.io/Cheeto-s-Wine/#/intro](https://hoongyuu.github.io/Cheeto-s-Wine/#/intro)
- 部落格/文章：[https://bear-luo.github.io/OpenseasonWeb/#/openseason_home#newslist](https://bear-luo.github.io/OpenseasonWeb/#/openseason_home#newslist)
- 分類：[https://vvvvvvii.github.io/tasteof/dist/#/product_list?search=城市導覽](https://vvvvvvii.github.io/tasteof/dist/#/product_list?search=%E5%9F%8E%E5%B8%82%E5%B0%8E%E8%A6%BD)
- 延伸產品：[https://char849.github.io/vue3-week8a-main/#/course](https://char849.github.io/vue3-week8a-main/#/course)
- 搜尋：[https://kevinhes.github.io/finalworkvue2022/#/](https://kevinhes.github.io/finalworkvue2022/#/)
- 優惠券發放活動：[https://nighthree.github.io/ChocolateShop/#/coupon](https://nighthree.github.io/ChocolateShop/#/coupon)
- 我的最愛：[https://jordan-ttc-design.github.io/fine-job/#/](https://jordan-ttc-design.github.io/fine-job/#/)
- 一堆動態效果：[https://huan5678.github.io/chill-bar/#/](https://huan5678.github.io/chill-bar/#/)

團隊成員可以一同討論，還有什麼前端技巧或套件可以加入到專題網站之中，範例：

- fullpage 滿版滾動：
    - 套件：https://github.com/alvarotrigo/fullPage.js/
    - 範例：https://alvarotrigo.com/fullPage/#page1



### 挑戰二：請 AI 幫忙撰寫特效
試著請 ChatGPT 寫出動態效果，建議每位成員均不同（參考特效：Swiper、AOS）
特效需要與 Vue 環境結合，並且可以運作
完成後，請加入註解，並瞭解其中原理

---
## 回報區


|  #  | Discord        | CodePen / 答案                                                                |
|:---:|:-------------- |:----------------------------------------------------------------------------- |
|1|C-01組|[HackMD](https://hackmd.io/@0nPGcgMUTs2wJQ7hgyzkzg/S1E3x0TKkg)|
| 2 | 第 6 組 | [HackMD](https://hackmd.io/@LinaChen/ryWtbmtVJx/%2Fb_2maxgHRzOKyefu2r3ZuA) |

---

- 快速複製格式：

```markdown!
| 0 | user | [Codepen]() |
```
