上一篇介紹了元件和 React Component 其中之一的 Function Component 的基本概念後，今天就要接著帶大家來看 React Comp...
今天介紹的是 useMemo hook，透過它可以記憶一個值。 useMemo 真的是效能優化的利器?倒也不一定，看你怎麼使用它，過度使用反而只是拖垮效能罷了...
今天要跟大家介紹的是 React Component 中的 Function Component 。我們曾經在 Day 02 的時候提及到 React.js 是...
今天介紹的是避免重新渲染的 HOC(Higher Order Component) React.memo，透過它可以對元件重新渲染的時機做出控制。 React....
這個 hook 可以讓我們用類似 redux 用 reducer、action、dispatch 操作 state。 useReducer 適合較複雜的 sta...
我們昨天 Day 04 的時候在 App.js 檔案中有看到以下的程式碼：不過，為什麼能夠在一個 JavaScript 函式中撰寫看起來像是 HTML 標籤的東...
還記得我們在 Day 02 的時候有跟大家提到 React.js 是使用 Virtual DOM 的概念來進行渲染的嗎？那今天就一起來看看什麼是 Virtual...
讓開發者可以更容易的從母元件傳遞 state 到深層的子元件，並讓多個用到的 state 資料的元件可以隨著資料變動而更新。 語法 const value =...
對 React.js 有基本的概念後，我們就可以繼續往下學習該如何建置和使用它囉！ 開始環境建置 首先，要開始建立一個 React.js 專案的話，必須先在電...
今天要介紹的是可以用來操作 DOM 元素的 useRef 及和它有關的 hook useImperativeHandle。 功用和特性 ref 是一個包含 cu...
今天要介紹的是常用的 hook，useEffect。 功用 React 元件本身是純函式，但還是有要處理到 side effect 的時候，而若要處理各種針對渲...
我自己在學習新技術的時候比較習慣先暸解一下這個技術的基本概念還有它解決了什麼問題。所以今天我要跟大家一起來看 React.js 到底是什麼？它又能夠幫我們做什...
今天我們來認識一個相當常使用的 hook: useState。 語法 const [currentValue, setCurrentValue] = useSt...
哈囉大家好！我是阿關 是說第一次參加鐵人賽就想要挑戰一個自己完全不熟悉的題目我也是覺得自己蠻有勇氣的啦～ 如標題所言，接下來的這 30 天我會在這邊紀錄我開始學...
鐵人賽大綱 在這次鐵人賽的挑戰中，主要的目標是希望自己和讀者們可以更加認識 React.js 或者是複習一下以前學過的知識，所以安排了幾個單元來進行介紹，預期介...
Component的概念就很像一塊塊積木，可以拼湊組成城堡或是飛船之類的，Component裡頭會回傳React element，透過這些Component就可...
今天實作首頁的顯示舊文章的按鈕功能。 在實作前想先介紹react的hook這個東西:在去年以前，react的組件實作都是使用Class component，也就...
(2024/04/06更新) 因應React在18後更新了許多不同的語法，更新後的教學之後將陸續放在 新的blog 中，歡迎讀者到該處閱讀，我依然會回覆這邊的...
(2024/04/06更新) 因應React在18後更新了許多不同的語法，更新後的教學之後將陸續放在 新的blog 中，歡迎讀者到該處閱讀，我依然會回覆這邊的...
今天要講到的是react中的事件監聽，在react中，只要在JSX的元素標籤內，根據特定方法給出的屬性名，給予其所需執行的方法，就會在事件觸發時做執行了，舉個例...
上一篇中，我們完成了一個簡單的Index頁面。今天，我們再加一些功能：1）在文章中設定是否為草稿，若是，則index不顯示，這可以透過GraphQL的filte...
上一篇中，我們用GraphiQL測試了GraphQL的查詢。今天，我們就要用這些查詢來打造一個Index頁面。 YouTube 影片 加入GraphQL 打開...
Gatsby提供了一個叫做 GraphiQL 的工具，幫助我們測試網站上的GraphQL查詢。GraphiQL提供一個可視化界面，讓我們可以直觀地看到查詢的結果...
上一篇中我們準備好了Markdown、post template，以及相應的一些GraphQL query，今天就要使用Gatsby提供的createPages...
Gatsby可以以Markdown作為資料來源自動產生頁面，這讓我們可以輕易的建立Blog之類的網站：寫blog只需寫markdown。 YouTube Vid...
和WordPress一樣，Gatsby.js也有plugin系統，透過NPM安裝。你可以在Gatsby.js 官網找到所有plugin。今天我們要學習怎樣安裝p...
今天要介紹的內容很簡單：如何在Gatsby中新增頁面。新增頁面的方法不只一種，今天先介紹最簡單的方法。 YouTube Video: layout.js vs...
我們已經用Gatsby的Command Line工具以預設的Starter安裝了一個示範網站。今天我們就來研究一下這個預設Starter生成的目錄結構。 You...
SuoChan 阿關
harry xie
Lieutenant
轟天旅人
Andy Chang
Zack
iThome鐵人賽
看影片追技術