iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
Modern Web

新手進化日記,從React至Redux Saga 系列

自從上了研究所後才開始觸碰前端,HTML、JS也只有在大學課堂上學過而已。
我第一個前端語言是直接嘗試使用React來撰寫,雖然途中也踩了許多雷,但覺得其實還滿容易上手的 (因為不想先寫傳統HTML再慢慢轉到React,想要一次到位XD),所以也把這兩年之中學的經歷寫成日記,希望能夠幫助跟我一樣想學React的人!

鐵人鍊成 | 共 30 篇文章 | 3 人訂閱 訂閱系列文 RSS系列文 團隊IT108xWKE
DAY 21

Day 21 - YouTube Iframe API: 打造全面的YT控制器component

tags: iThome 鐵人賽 30天 今天要來打造影片標記系統的精隨之一,用YouTube Iframe API來建立一個播放器。或許有人會有疑問,為甚麼不...

2022-10-06 ‧ 由 whlshy 分享
DAY 22

Day 22 - YouTube Iframe API實際應用 / react-router-dom v6

tags: iThome 鐵人賽 30天 昨天做好了YouTube Iframe API component今天來實測用看看吧。 先把要傳入的參數列出來並準備妥...

2022-10-07 ‧ 由 whlshy 分享
DAY 23

Day 23 - 影片標記頁面初步刻畫

tags: iThome 鐵人賽 30天 因為考慮到時間不太夠與邊看影片邊寫標記基本上用電腦會方便很多,所以就先不考慮手機的排版了,就直接以電腦的網頁比例為主將...

2022-10-08 ‧ 由 whlshy 分享
DAY 24

Day 24 - 影片標記頁面完整雛形

tags: iThome 鐵人賽 30天 這次markdown editor決定採用@uiw/react-md-editor,不過畢竟我也沒用過,就當作試用來用...

2022-10-09 ‧ 由 whlshy 分享
DAY 25

Day 25 - 建立專屬於影片標記系統的API

tags: iThome 鐵人賽 30天 一個前端專案在資料呈現上少不了的當然就是API了,API能做甚麼呢?大致上就是取得、新增、修改、刪除資料庫內的資料啦!...

2022-10-10 ‧ 由 whlshy 分享
DAY 26

Day 26 - 影片標記系統:前端與API的整合

tags: iThome 鐵人賽 30天 既然API都準備好了,就把前端與API整合起來吧~(順便試試看有沒有BUG? fetch 至於前端要怎麼整合API與A...

2022-10-11 ‧ 由 whlshy 分享
DAY 27

Day 27 - React Redux 基本介紹

tags: iThome 鐵人賽 30天 Redux是一個全域的資料管理工具,能夠管理整個網站的State Component 能統一在 Redux 上取得...

2022-10-12 ‧ 由 whlshy 分享
DAY 28

Day 28 - React Redux Container 實際運用 (取得store與執行action)

tags: iThome 鐵人賽 30天 接續上一篇,我們已經把store整個套用在component內了,接下來就是看要如何把store內的state撈出來給...

2022-10-13 ‧ 由 whlshy 分享
DAY 29

Day 29 - 完善功能與Saga介紹

tags: iThome 鐵人賽 30天 來到第29天啦!今天寫完剩下最後一天,沒想到居然可以撐到要玩賽了~先來快速帶過把所有的基礎功能給完整做完,之後就來先介...

2022-10-14 ‧ 由 whlshy 分享
DAY 30

Day 30 - 影片標記系統最終章:Saga整合 / 完賽感言

tags: iThome 鐵人賽 30天 大致介紹完Saga後,要來把最後一塊拼圖拼起來了,看看要怎麼把呼叫API放置去由Saga端管理吧! Saga整合 昨天...

2022-10-15 ‧ 由 whlshy 分享