iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
SideProject30

用 React 和 Firebase 打造一個完整 side project 吧! 系列

勇敢挑戰全新主題「SideProject30」,從使用者角度出發,用 React 前端框架,結合 Firebase 的後端服務,30 天打造一個簡潔便利的預約系統。

鐵人鍊成 | 共 30 篇文章 | 16 人訂閱 訂閱系列文 RSS系列文
DAY 21

Day21:在 React 專案中使用 Firebase Authentication 實作會員管理(四)

會員管理終於來到最終章,因為其他功能都是 CRUD,而且也因為 Firebase 將使用者認證這塊切得很細,所以花較多的篇幅來介紹。然而雖然使用者在註冊成功當下...

2023-10-06 ‧ 由 Annie 分享
DAY 22

Day22:操作 Firestore Database 的資料(一)

今天是組裝頁面的一天,也將 Firestore Database 的 CURD 先從文件學習到在 console 控制台中練習一遍。 溫馨提醒:以下內容看到的...

2023-10-07 ‧ 由 Annie 分享
DAY 23

Day23:操作 Firestore Database 的資料(二)

延續上一篇,今天繼續研究 Firestore Database 的資料操作, 溫馨提醒:以下內容看到的 showNotify 是我個人封裝使用的提示彈窗,並不...

2023-10-08 ‧ 由 Annie 分享
DAY 24

Day24:實作會員資料更新

花了兩天稍微了解 FireStore Database 的 CRUD 後,今天著手將我使用先前做好的表單元件們,組裝成店家資料維護頁面,但一直卡在明明登入了 u...

2023-10-09 ‧ 由 Annie 分享
DAY 25

Day25:實作 Firebase Authentication 電話驗證

在使用者成功註冊、並且角色為店家時,需先經過電話驗證才可進行刊登服務項目供顧客預約,此故事情境在這篇文章可以回顧,所以今天將重點放在電話驗證的實作上。 使用 J...

2023-10-10 ‧ 由 Annie 分享
DAY 26

Day26:實作 Firebase Authentication 電話驗證(二)

接續上一篇文章,繼續將 Firebase Authentication 電話驗證的串接完成! 關於 Firebase Authentication 的電話驗證...

2023-10-11 ‧ 由 Annie 分享
DAY 27

Day27:React 與 Firebase 的 CRUD 串接(一)

倒數第4天的挑戰,是完成一套新增讀取編輯刪除(CRUD)的頁面組裝與串接,話不多說直接開始! 組裝列表頁面(店家視角) 串接讀取文件的 API import...

2023-10-12 ‧ 由 Annie 分享
DAY 28

Day28:React 與 Firebase 的 CRUD 串接(二)

店家新增完服務項目後,顧客就可以開始查看預約了!所以今天將開發重點放在顧客角度會看到的頁面都實作完成。 組裝列表頁面(顧客視角) 串接讀取文件的 API i...

2023-10-13 ‧ 由 Annie 分享
DAY 29

Day29:當顧客開始訂位

倒數2天,把握時間繼續努力! 製作月曆元件 昨天製作了顧客視角的服務項目詳細頁後,今天依照原先的 Wireflame 設計線稿,刻出可供預約的日期時段區塊,這部...

2023-10-14 ‧ 由 Annie 分享
DAY 30

Day30:完賽不是終點,而是另一個起點

是的,如同標題所說,目前專案確實完成度沒有很高,但無論進度如何,今天就在挑戰的最後一天進行部屬吧! 如何使用 Vercel 部屬 進到 Vercel 官網註冊...

2023-10-15 ‧ 由 Annie 分享