在公司實習時遇到了一個問題，我們會用i18n來去做網站的中英文轉換，我們並且會寫一份json來管理我們所有的key，但會遇到一個問題就是說如果一個key在英文有...
我們先前有產生出讀取環控晶片的動態連結函庫，但是在Electron應用程式中並不能像Windows console application一樣直接引入使用。要在...
目前已經完成了後端開發，接著要繼續前端的開發了 我們要用於前端開發的主要工具是React，因為React官方現行已經有很完整清楚的指引(React dev)所以...
學習完聲明式 UI 的思考及操作，接著要更深入來思考構築 state 的原則，官方文件提供了五個原則給使用者參考，讓我們一一來看。 將相關的狀態群組（Grou...
本系列文章會在筆者的部落格繼續連載！Design System 101 感謝大家的閱讀！ 前言 在上一篇 FocusScope 中，我們介紹了 FocusS...
Dynamic Routes 我們今天接續的做每個角色自己的頁面，來理解 Dynamic Routes 的實作層面。這部分我們可以先借一下 Next 官方的範例...
tags: ItIron2023 react 前言 昨天我們看了一個誤用useEffect的例子，了解到其實有些東西你不需要靠useEffect也能達成，今天我...
extends // type type Me = { name: string; age: number } type mom = Me &...
升版後的 Next Next 在今年升版到 13.4，並增加了許多新的功能，同時也大幅翻轉了原先的寫法。 總的來說，新版本的 Next 將 data fetch...
時雨
‧
2023-09-18
終於來到了比較不一樣的主題CSS，這篇會較紹在React使用CSS的幾種方式 CSS Modules styled-components Tailwind...
今天讀完了 React 官方文件的 Synchronizing with Effects 的章節，初步學習了 Effects 的相關知識，透過實作來練習和理解觀...
今天這篇文章要來介紹另外兩個hooks，useCallback和useMemo兩個都是用來效能優化的hooks，用法相當類似，都是藉由快取來達到優化的效果。 u...
React 實戰 II 昨天我們的專案文件大概如下 . ├── README.md ├── package-lock.json ├── package.json...
叮叮
‧
2023-09-29
昨天成功在Electron應用程式使用動態連結函庫讀取CPU風扇轉速，但這個轉速數值只會在Electron應用程式UI載入後更新一次，之後就會維持同樣的轉速數值...
今天要來介紹 client component 的用法，其實 client component 就是過去 next 12 常用的 component，功能上大同...
時雨
‧
2023-09-21
昨天已經了解Uncontrolled Component和Controlled Component的差異及概念是什麼，也知道如果是自己客製化的元件，是可以依照情...
這篇文章的主要內容 簡單介紹 react 裡面 style 的工具 emotion。 Emotion 目前為止都盡量不動到 style 即使有用到也是使用 i...
大綱 新增資料夾和檔案 React Routes設定 1. 新增資料夾和檔案 我們先調整當前專案的資料夾，新增一些資料夾來區分檔案。 專案資料夾結構 ✨表示...
我們在前幾天已經認識了useReducer和useContext的用法，今天來點進階的內容，把useReducer和useContext結合在一起使用看看。這兩...
今天這兩個頁面比較單純的只是呼叫API去取得當前的資料，並顯示於頁面上。 大綱 文章列表頁開發 標籤頁開發 路由設定 1.文章列表頁開發 Wireframe...
這篇文章的主要內容 簡單介紹優化 react 的其中一個方法 - memo memo 前面有提到當狀態改變時 react 會 re-render 整個元件，所...
這篇文章的主要內容 簡單介紹優化 react 的另一個方法 - useMemo useMemo useMemo 是 react 裡面一個用來讓 react 記...
今天要來學習在設計元件時有哪些要點，以及如何避免寫出「不乾淨」的元件。 純淨的元件 製作元件時的大重點：保持元件的純淨 (Keeping Components...
前幾天已經了解關於state的存取及更新方式，還有從父層把state透過props的傳遞給子層的方式，今天就讓我們把重點放在怎麼讓頁面能擁有實際的互動功能，也就...
這篇文章的主要內容 簡單說明如何透過 Render Props 的方法讓父元件決定子元件要顯示的內容。 Render Props 目前為只都分享了如何把畫面拆...
大綱 使用者頁面開發 更新使用者資料 1. 使用者頁面開發 Wireframe 建立檔案 一樣先在pages資料夾底下建立Profile.js在這個頁面...
先前我們已經將登入和註冊頁開發完，今天要來進行導覽列的開發。 大綱 Wireframe 導覽列開發 未登入的導覽列 已登入的導覽列 使用者功能列 1...
昨天學習了 React 的 batching 的概念、「替代」和「做」的區別、當次渲染的邏輯，今天要來學習如何在 state 中更新物件。學習前讓我們再次回憶起...
昨天快速介紹過react，今天直接進入實作 大綱 建立專案並安裝React 安裝開發用到的套件 1.建立專案並安裝React 在要新增專案的地方輸入以下指令...
在昨天的文章中，我們已經將基本的 workflow 設定完成，並且完成 email 寄送的測試了，今天就要來試試看 Novu 提供的 In-App 這個可以使...
CarterChu
Yihsuan
yuu
Jing.tech
LucianoLee
windate3411
ss95159
文科少女
evan_hsu
Bill
iThome鐵人賽
看影片追技術