/AlpacAlbum

Primary LanguageJavaScript

[109-1] Web Programming Final - AlpacAlbum

專題名稱:Group66 AlpacAlbum

這個服務在做什麼?

這是一個線上的相簿,可利用tag方便搜尋相片,並對相片做評論

使用/操作方式

  1. 第一次使用請先按右上角的Sign up再登入
  2. 登入後可以使用左邊sider的功能
  3. 點至Search by Tags可以以tag去搜尋想要的照片
  4. 點至View All Albums可以觀看各個相簿,以及瀏覽單一照片,並可以對自己上傳的照片進行刪除以及改tag,也可以對每張照片進行留言評論
  5. 點至Upload,右邊可以拖曳或點選要上傳的照片,左邊可以選擇你想加給照片的tag(想傳進的相簿名稱)
  6. 右上角可以點自己的名字進入使用者介面,可以換頭貼,也可以改使用者名稱以及密碼

專題製作心得

  • 吳悠嘉: 這次我是負責整個前端,過程中對於安排畫面,處理一些功能真的頭很痛,css也很難調,但最後看到她還算美美的,很有成就感,也對於前端的設計更加了解。
  • 林聖亞: 寫網頁可以把自己想做的介面和功能實作出來,真的覺得非常實用也很有成就感~寫的中間慢慢覺得有好的程式架構真的很重要,感覺下次要先好好設計一下應該會比較好寫
  • 鍾麗文: 在寫這個AlpacALBUM的過程中,有嘗試從使用者體驗的角度出發,思考怎麼樣的設計會更符合使用者的需求。從寫程式的過程中更加了解程式架構的重要性,以及前端後端溝通的模式。我的組員真的都超讚,我愛他們!

使用之第三方套件、框架、程式碼

  • 前端:React、Ant Design
  • 後端:GraphQL、Apollo server、express-session、express-router、bcrypt
  • Database:MongoDB

組員的貢獻

  • 吳悠嘉:幾乎整個前端
  • 林聖亞:跟照片相關的後端
  • 鍾麗文:跟使用者有關的後端