做前端時一定會碰到非同步操作，本篇將使用 axios 搭配 Redux Toolkit 來作範例串接 API，可以先將 axios 環境安裝起來 安裝 Axi...
製作完產生身分證的 JavaScript，接著就把它們放入 React 的程式中。 .jsx 引入功能 在使用 Day25 的樣式，結合 Day26 的程式，就...
除了測試之外，那當然就是發佈啦！ 呼喚我最一開始的需求，就是希望能夠建立自己的 library 然後來使用，本篇計畫用 npm 來發佈。 同一隊的丹尼有寫了...
除了最核心的 useState 以及 useEffect 以外，在 React 中最常被我們使用到的內建 hooks 應該就屬 useCallback 以及 u...
還記得我在 Day 04 - 在地圖上標記 Marker 的時候寫了一篇地圖的 Marker 教學嗎～其實標點不限於常見的 2D 地圖喔，3D 的也可以！我們今...
昨天我們介紹了 useMemo，這個 hook 可以幫助我們記憶依賴參數，當參數變化時才會重新執行函式，並且取得函式回傳的值。今天要來介紹的是 useCallb...
前言 嗨，我是Hogan目前在經營自己的自媒體 hogan.tech主要分享一些有關於程式碼、軟體和科技業經驗分享有興趣的讀者可以進一步關注我，進而獲得更多資訊...
因為這邊開發的是 Component，所以這次會用 Cypress Component Testing。 Setup 設置專案在 apps/ 底下。 E2E...
這篇是補足大家的求知慾，還記得我開頭說的 React Query 嗎？ 我秉持著勤儉持家的客家精神，想說不要浪費我們建立好的 todo api server，順...
我昨天我們講到了購買流程今天我們看看這些元件是怎麼做的 以課程為例，他會有不同的課程方案可供選擇 首先是價格的部分 <PriceLabel var...
讓 CSS 只跟著元件 我們知道若元件拆分得越細，可以在其他元件內的重複組合使用的頻率就越高，所以會希望 CSS 只跟隨著元件，當這個元件被拿去其他元件使用時，...
本文提及以下重點 GatsbyJS介紹 靜態網站 SPA網頁(Single Page Appliations) SSR網頁(Server Side Rende...
安裝環境 創建模板 React + Redux Toolkit npx create-react-app my-app --template redux 安...
已經在 Day25中設計了製作身分證的樣式，接下來要製作點擊按鈕後進行的程式邏輯。 製作邏輯的 js 檔案 建立一個 idnoCreater.js 的檔案，裡面...
雖然寫了那麼多，不論是有用的，或沒用的，要怎麼確保有沒有寫好呢？ 當然就是就在講測試，雖然開發過程中可以測試功能正不正常，但隨著日後長大的需求有時難以回頭一一...
延續昨天 useEffect 的說明，今天著重在 cleanup function 的使用時機、並搭配 useEffect 中的 closure 來做到「取消...
在前面章節中我們解析了將 effect 設計成即使多次執行也能保持正確的重要性。如果你還對這個觀念不是很熟悉的話，非常建議你先閱讀系列文前面的篇幅中關於 use...
Day-30 結語 - 沒有完賽心得 在這段時間裡面我只專注一件事情 :完成三十篇文章並且發表，不想為點閱率或者別人怎麼回應這些事情分心，就只是想達成三十天的目...
Day-29 常用網站工具分享 自己從頭到尾用 HTML 寫一個表格，或者從 0 開始使用 CSS 寫一個陰影效果，都是快把人逼死的過程啊，除非是真的打算刻苦一...
Day-28 安裝的 vscode 套件分享 套件跟書一樣，都是要用到的時候才會感覺自己讀的少，之所以到最後才分享工具跟套件，是因為有感覺難用過才會知道套件到底...
Day-27 專案演練 - 寫在最後 專案分享的尾聲，篇幅有限，還有很多想做的功能還沒完成，做個這 20 天來邊做邊寫的總結，在鐵人賽結束之後，我會繼續把之前說...
Day-26 專案演練 - 在 homePage 拿到 list redux 今天我們要完成 homePage 的一部分功能，跟 todo 有關的部分，其實鐵人...
本文包含以下內容 格線系統 基本用法 設置斷點 父組件設置欄數 Grid version 2 格線系統 如果先前有學習過boostrap5的人應該對於lay...
昨天我們介紹了什麼是 memorized hook，介紹他們是如何提升 React 的效能。接著，我們來更詳細一點的介紹各個 hook 要怎麼使用。 useMe...
台灣的無障礙規範 聲稱自己參照 w3c 規範， 但還是有太多地方跟國際規範不同。先不論是政治還是官僚等無聊原因，考慮到讀者未來發展性，筆者鼓勵盡量走國際規範...
前言 嗨，我是Hogan目前在經營自己的自媒體 hogan.tech主要分享一些有關於程式碼、軟體和科技業經驗分享有興趣的讀者可以進一步關注我，進而獲得更多資訊...
在後面的幾天將會以 Redux Toolkit 來做說明，而在了解 Redux Toolkit，我們先來了解 Redux 的運作原理，在後面的操作上也會比...
React 狀態管理的分類 React的 狀態管理主要分三類：Local state、Context、Third Party 前面已經介紹了 Redux 及...
今天帶大家去日本看富士山吧～？不過是地圖版的啦，我也好想去日本玩 ༼இɷஇ༽ 程式碼我們沿用上一篇的 3D 地球地圖來繼續做，不清楚的可以點擊這裡！ 3D 地形...
終於進到我們最後的部分，「checkout」接下來我們會來看在這個專案中結帳的流程是怎麼進行的 我們以們前幾天的課程為例首先我們看到，如果課程為「0元」的情況分...
Lala Wang
eyelash*睫毛
Charlie
Zet
no_
時雨
hogantech
HelloKayac
LucianoLee
HLTVProxy
lala_lee_jobs
DannyChen
pjchender
aoigj100
iThome鐵人賽
看影片追技術