iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
SideProject30

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

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

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

Day01:在 side project 開始之前

本文同步刊載於 我的部落格 30天可以做什麼? 身為一位工程師,最需要的就是以 side project 來展示自己的技能,在一年一度的鐵人賽中看見 sid...

2023-09-16 ‧ 由 Annie 分享
DAY 2

Day02:用最短時間完成 side project 規劃

本文同步刊載於 我的個人部落格 從 user story 開始思考網站功能 延伸第一天的主題發想,我將自己視為使用者,站在使用者角度出發後,初步規劃網站功能...

2023-09-17 ‧ 由 Annie 分享
DAY 3

Day03:side project 必備的 Flow Chart(一)

本文同步刊載於 我的個人部落格 一、Flow Chart 是什麼? 流程圖(Flow Chart)是一種圖形化表示流程或過程的工具,通常用來展示一个系统、流...

2023-09-18 ‧ 由 Annie 分享
DAY 4

Day04:side project 必備的 Flow Chart(二)

本文同步刊載於 我的個人部落格 針對網站角色將 Flow Chart 再延伸 上一篇文章中有提到,此次專案主要區分兩個角色,本篇將針對「顧客」角色進行 Fl...

2023-09-19 ‧ 由 Annie 分享
DAY 5

Day05:Firebase 服務中的資料架構

本文同步刊載於 我的個人部落格在規劃專案之資料表前,想先插播介紹關於 Firebase 的資料庫運作原理,此部分並不影響專案規劃之順序,因為這是在規畫專案前也...

2023-09-20 ‧ 由 Annie 分享
DAY 6

Day06:依照 Firebase 數據庫規劃專案資料欄位

本文同步刊載於 我的個人部落格 NoSQL 在 Firebase 數據庫中是如何應用的? 在前一篇章節中,我們稍微認識了 NoSQL 這個新朋友,所以現在讓...

2023-09-21 ‧ 由 Annie 分享
DAY 7

Day07:使用 Wireframe 線稿拼接網站的功能與畫面(一)

在本系列文的第二篇「用最短時間完成 side project 規劃」中有提到,我認為規劃一個作品,一定要先將 Flow Chart 確定、且資料欄位也規劃好後,...

2023-09-22 ‧ 由 Annie 分享
DAY 8

Day08:使用 Wireframe 線稿拼接網站的功能與畫面(二)

有了主畫面後,我習慣先從主功能將 Wireframe 線稿依照原先的 Flow Chart 畫出來,細節功能會陸續繪製(有先想到的會以 Todo 標示),並於後...

2023-09-23 ‧ 由 Annie 分享
DAY 9

Day09:使用 Wireframe 線稿拼接網站的功能與畫面(三)

上一篇我們已經完成了兩種主角色的註冊與登入畫面,也有將 Flow Chart 中所提到的店家角色稍微提及(如果忘記規則的話,可以回頭看下列文章)。本篇將重點放在...

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

Day10:使用 Wireframe 線稿拼接網站的功能與畫面(四)

有了服務項目後,顧客已經可以開始預約,進入這個網站的重頭戲。上一篇文章中,眼尖的朋友們一定會發現,對比原先的 Flow Chart 後,好像少了「顧客預約當下沒...

2023-09-25 ‧ 由 Annie 分享