---
# System prepended metadata

title: '[111-1] Web Programming Final'

---

# [111-1] Web Programming Final

## 專題題目名稱
**Group 25 wpm(word per minute) test網站**


## Demo影片連結
https://youtu.be/I7vUJlauGN4
## 服務簡介

- 在每打完一次測試後能看自己在每個時刻的wpm以及raw（不考慮正確性的wpm）
- 能夠查看自己近十次的wpm
- 能在排行榜上查看自己以及他人的wpm排名。


## deployed 連結
<!---
your comment goes here
and here
https://rb.gy/hap41c
-->
暫不公告


## 使用與參考之框架/模組/原始碼

- thelyricist.novacovici.dev

## 使用之第三方套件、框架、程式碼
### 前端
- react
- react-router-dom
- materail-ui
- rechart
- react-auth-kit
### 後端

- express
- crypt
- mongoose
- jsonwebtoken

## 專題製作心得

- b10902042 

這次專案學到很多，尤其是前端的部份，為了美化網頁，這次的css真的花了不少心力研究，也看了不少的doc，學習到如何快速從
雜亂的doc中尋找自己須要的資訊，而git方面的技巧也進步許多，也更知道如何透過git branch/merge跟別人合作。也感謝我的兩個強大隊友，才能把這次project順利做完。而剛開始我們沒溝通好gitignore要塞什麼以及package要用哪些，導致在不同branch上.env.default, package.json不同步的問題，也讓我解到在做project前溝通的重要性。

- b10902100

自己從零開始寫網頁到最終完成是件很有成就感的事
這次期末專題我使用了許多上課沒教的第三方套件，像是MUI, react-auth-kit, jwt等。因此在寫的過程中需要不斷地查詢documentation，但正因如此才會進步。另外我也學到了Github branching功能的強大，透過這個功能，我和組員可以互不干擾地並行開發網頁的不同部分，最後再merge在一起就好了。有些bug是在deploy之後才會遇到的，本地端根本測不出來。由於我們是最後一天才deploy，因此發現這個bug的時候我真的很著急，幸虧我有強大的隊友，才能在deadline前把bug解決掉。感謝我的兩位隊友。這讓我再次學到做任何事情都應該給自己預留一些時間，不該在deadline當天才把事情做完。

- b10902040

在確立了網頁待完成的feature並開始著手製作後，我經常猶豫該用哪一種方式implement這些feature，一方面覺得簡略的方法會限制網頁的其他功能以及運作效率，一方面害怕複雜的方法會難以維護，且不一定能夠順利完成，導致進度停滯。
後來我意識到自己並不需要作出最完美的決定，只要做出夠好的決定就行了，割捨是必要的，不斷猶豫是無法產出東西的。畢竟之後就算有問題也可以再修改，至少不會一無所有。並且兩位隊友的成果也幫助了我更了解網頁的結構，使我更確立自己implement的方向。
這次的final project讓我了解了網頁從發想、規劃、製作到deploy之間的所有過程。即使手中有許多現成的工具能使用，也能感受到這其中的不易，更了解到事前與隊友溝通確立網站細節是非常重要的。
