iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
自我挑戰組

【菜鳥冒險記】用React與Firebase開始sideproject之路 系列

透過對javascript的基礎了解,開始探索react與firebase的使用與協作,初步目標完成一款todo list的app。

參賽天數 19 天 | 共 20 篇文章 | 1 人訂閱 訂閱系列文 RSS系列文
DAY 11

[Day11]用React嵌入影片:Stories(二)

*註記:影片無法播放的原因,可能是因為現在的程式碼,沒有useState以及useRef,這部分在下一篇文章會提到。 前言 Stories最重要的部分,就是影片...

2023-09-26 ‧ 由 feather 分享
DAY 12

[Day12] 設定播放與暫停:Stories(三)

程式概念 昨天我們提到video可以做各種影片常用的操作,例如看影片時的暫停以及播放,過去在看各種平台影片的時候,有些平台可以按下暫停鍵、有些平台則是點下螢幕,...

2023-09-27 ‧ 由 feather 分享
DAY 13

[Day13]加上Header Component:Stories(四)

程式概念 為我們的project加上shorts中常見的header,這裡會用到的是之前提過的便於修改UI的工具:material UI,如果對它的記憶太模糊/...

2023-09-28 ‧ 由 feather 分享
DAY 14

[Day14]Footer Component:Stories(五)

完整效果 書本在提及這裡的時候,給了很多footer component的效果,但因為css彼此之間的衝突與調整問題,今天先以avator以及名字為主,後續ic...

2023-09-29 ‧ 由 feather 分享
DAY 15

[Day15]連結Firebase吧:Stories(六)

今天的操作與Todo List(三)很相似,如果已經掌握訣竅,可以跳過不看。 建立cloud firestore 回到firebase的主頁,首先開始建立一個實...

2023-09-30 ‧ 由 feather 分享
DAY 16

[Day16] 我想幫我的水豚開一個雲端:Cloud Storage(一)

前言 google雲端是近年來常用來共享資料與傳輸的工具,尤其是疫情開始遠距教學風潮,老師們往往說:我把我的教材放在雲端上了。 但是這些都是共享的!我們可不可以...

2023-10-01 ‧ 由 feather 分享
DAY 17

[Day17]為網頁創建Header:Cloud Storage(二)

前言 今天的實作結束後,Cloud Storage會出現一個有Header的網頁。 注意,在做project的過程中,難免要使用一些圖片以及icon,需要注意版...

2023-10-02 ‧ 由 feather 分享
DAY 18

[Day18]為網頁創建Sidebar:Cloud Storage(三)

前言 今天實作Storage旁側的選單的初始外觀,如共用雲端、個人雲端、近期存取、垃圾桶等。 程式概念 如果在初始做介面時,就能以功能區分好component,...

2023-10-03 ‧ 由 feather 分享
DAY 19

[Day19]如何把你的檔案上傳到Firebase:Cloud Storage(四)

前言 做一個cloud storage最重要的就是上傳檔案拉!前面提到過,firebase可以想成一種資料庫與後端的聯集,檔案的處理與上傳當然也可以使用fire...

2023-10-04 ‧ 由 feather 分享
DAY 19

[Day20]血和淚的教訓

今天特別忙,討論不小心已經超過了午夜12點----所以我的鐵人賽發文失敗了。儘管如此,經過一番糾結,還是決定繼續前進,這個決定並不容易,但我可以視為對自己技術能...

2023-10-06 ‧ 由 feather 分享