【前言】 終於先把基本的redux告一段落了......可是工作上的進度還是大延遲(嘆氣【正文】 採用以往的方式撰寫action、reducer的確可行，但...
當初學者剛接觸 React 時，常常會想要以 inheritance（繼承）的方式來實作 React component。然而 React 官方建議實作 com...
前言 在 Day03 了解怎麼建立自己的最簡單的 component 後，我們開始深入了解如何使用 solidjs 這框架帶給我們的基礎方法， createSi...
有使用過React的同學都知道，用React做輸入控制的時候， 通常做法是建立一個input的state， 具體如下： import { useState }...
先分享下 Frontend 的發音https://www.youtube.com/watch?v=ZdtpKFbhTtk 記得是 Frontend 不是 Fro...
上一章 Day 25 - React Fetch 向後端API請求資料(2) React 導頁與控制使用 react-router-dom 安裝的話只要按CTR...
Hihi！大家好！這樣子的開頭還要在鐵人賽結束前繼續用下去，請大家多多包涵XD，昨天我們已經能夠從Redux中取到資料了，今天要來說說該怎麼把透過React來觸...
元件介紹 Infinite scroll 能在面對多筆資料時，讓捲軸滑動到底部時再載入下一頁面的資料。 由於一次性向後端取得大批的資料，對於後端的資料計算、資料...
hashtags: #react, #components, #accessibility, #calendar, #date-grid 詳細可參考：https...
前幾天介紹了資料管理用的 context 以及 Redux，今天要來介紹一下要如何不透過伺服器切換頁面，直接在 React 中切換。 React router...
今天的內容一樣以React為主，建立完前端應用程式之後，接著就是將前後端的應用程式連接。 首先在React應用程式專案中的package.json加上伺服器應...
昨天我們已經讓蛇的頭部可以動起來，並且可以接受方向鍵的操作來改變方向。接下來我們要讓這隻蛇有身體，讓他成為一條名符其實的蛇。 前情提要 在 Day12 - 貪吃...
說明 一進 Redux Toolkit 的官網，就會看到以下示意圖。 它最初是為了解決使用 Redux 的三個常見問題 配置 Redux Store 過於複...
鐵人賽剩下 5 天，接下來我想聚焦在一些經驗分享，畢竟除了學習技術以外，適時的採取一些實際行動更能夠快速吸收所學知識與進步。 身為軟體工程師， Github 自...
在上一個篇章中介紹了何謂 React element，也講解了 render 出 React element 的方式。 在這個篇章中則要介紹要如何將寫好的 Re...
(2024/04/06更新) 因應React在18後更新了許多不同的語法，更新後的教學之後將陸續放在 新的blog 中，歡迎讀者到該處閱讀，我依然會回覆這邊的...
React 狀態管理的分類 React的 狀態管理主要分三類：Local state、Context、Third Party 前面已經介紹了 Redux 及...
前言 續昨天的文章: Getting started with create-react-app, Redux, React Router & Red...
React可以手動建立環境，或是自己寫webpack設定，安裝相關的套件，身為初學者的我為了比較快速上手(懶)，決定採用官方提供的create-react-ap...
終終終於來到了每天朝思暮想的第三十天了，ㄛ天吶，這一路走來真的很漫長，不過每次回頭看看都會有覺得什麼時候發那麼多篇去了！的感覺XD，在打這段話的時候我覺得還滿適...
今天講解把如何模組化程式碼 前提：我們目前所有的程式碼都放在 index.html 裡面，分別嵌入了 React, React-dom, babel 的 CDN...
挑戰 React 第十七篇 在 React 第十一篇了解透過 element 傳遞 props，此篇要介紹要寫傳父組件裡的方法給子組件。 目標 子組件按了按鈕...
※取自《大話西遊之仙履奇緣》劇照 這故事要從20年前說起。(現在流行網路上的圖原封不動地抄襲拿來用，若有不小心盜圖侵權，請務必來信告知，本人馬上把圖片下架，關閉...
在build專案的時候，我們會透過webpack將不同模組的component打包成同一支js，但是當專案的規模越來越大， 程式碼的size就會逐漸肥大，好幾m...
關鍵字：notification 點擊通知時重新導向未成功 延續昨天在Day16~19時有試著做了一個點擊通知後可以跳轉回細節頁面的功能可是在以實機測試時，這...
元件介紹 Tooltip 是一個文字彈出提醒元件，當 active 狀態時，會顯示對該子元件描述的文字。 參考設計 & 屬性分析 位置 相對於被包覆的子...
元件介紹 Dropdown 是一個下拉選單元件，當頁面上的選項過多時，可以用這個元件來收納選項，透過滑鼠事件來觸發選單彈出，點擊選項會執行相對應的命令。 參考設...
目前為止我們已經了解該如何使用 React Testing Library 的 render 跟 debug 來 測試元件的狀態了。 今天我們將繼續探索如何測試...
元件介紹 Tabs 是一個選項卡切換元件，能夠在同一層級的內容組別當中導航、切換。此元件由兩個部分構成，一個是讓使用者點擊的導覽頁籤 Tab，一個是對應的內容...
今天要來介紹在React裡面有哪幾種撰寫css的方式 方法1:inline-style： 這是我最不習慣的寫法，畢竟要用駝峰式的格式寫，就沒有樣式語法自動提示了...
Hyora
Henry Chang
MichaelHo
Mike Fang
Aiden
神Q超人
Taiming
HelloKayac
時雨
chwk
lala_lee_jobs
莫力全 Kyle Mo
Andy Chang
Luis-Chen
Lieutenant
TSAI
Ivan
b97201019
TWGD
iThome鐵人賽
看影片追技術