iT邦幫忙

react相關文章
共有 560 則文章
鐵人賽 Modern Web DAY 12
Zero to hero with React.js 系列 第 12

技術 【Day 12 React】React + Webpack ——搜尋功能 #Part1

前面幾篇的做法,我都是直接引用 CDN 來操作。我們還有第二種方法可以 include React,就是透過第二篇介紹過的 Webpack,所以今天就來學學 W...

鐵人賽 Modern Web DAY 10

技術 [Day 10 - 網速換算器] 換算起來吧 - 資料綁定與組件拆分

感謝 iT 邦幫忙與博碩文化,本系列文章已出版成書「從 Hooks 開始,讓你的網頁 React 起來」,首刷版稅將全額贊助 iT 邦幫忙鐵人賽,歡迎前往購書...

鐵人賽 Modern Web DAY 2

技術 【Day 2】React.js介紹 && 第一個 React 程式

這是 React 從 0 到 1 系列的第二篇,今天廢話不多說,直接進入正題。 今天將簡單介紹 React.js 的基礎概念,最後建立我們第一個 React 的...

鐵人賽 Modern Web DAY 14

技術 Day 14, React components 各種寫Component的方法

今天講三種component的建立方式,也是看網路上的Demo常用的,我這邊會寫三個一樣的Component,讓大家看看彼此間的互換。 最簡單的 extends...

鐵人賽 Modern Web DAY 18

技術 【Day 18】Redux 實戰演練(2)

昨天建立了 redux 的三元素 action、reducer 與 store,也將它們用 provider 包住會用到 state 的元件,今天來試著在元件中...

鐵人賽 Modern Web DAY 8

技術 React-Redux-框架練習(2)

前言 續昨天的文章: Getting started with create-react-app, Redux, React Router & Red...

鐵人賽 Modern Web DAY 8
Zero to hero with React.js 系列 第 8

技術 【Day8 React】從拆解電子名片學習 React Components #Part2

今天講解把如何模組化程式碼 前提: 我們目前所有的程式碼都放在 index.html 裡面,分別嵌入了 React, React-dom, babel 的 CD...

鐵人賽 Modern Web DAY 12

技術 Day 12:Navigation Part I:Navigation 簡介與 Navigator

前言 在 React Native 裡面,大多的概念以及 Component 都相當好上手,但 Navigation 是個例外。Routing and Navi...

鐵人賽 自我挑戰組 DAY 7

技術 【DAY 07】React Component也有生老病死?(上)

【前言】   昨天講完Refs,會不會覺得目前React已經很煩了呢?希望你不會......XD 【正文】   今天要來聊聊React Component的生命...

鐵人賽 Modern Web DAY 11
Zero to hero with React.js 系列 第 11

技術 【Day 11 React】Events and Data Changes in React

今天要介紹如何即時得到使用者輸入的色碼,並即時 render 到氣球上。 DEMO 建立 Component 首先,建立一個 Balloon componen...

鐵人賽 Modern Web DAY 7

技術 Day 7 - Spring Data JPA 寫入與讀取資料 (2)

Day 6 - Spring Data JPA 寫入與讀取資料 上一章介紹了Spring Data JPA的使用方法 接下來讓我們把相關Model補完, 在Mo...

鐵人賽 Modern Web DAY 11

技術 [Day 11 - 網速轉換器] 那個...資料可以分享給我嗎 - 將資料傳入組件

感謝 iT 邦幫忙與博碩文化,本系列文章已出版成書「從 Hooks 開始,讓你的網頁 React 起來」,首刷版稅將全額贊助 iT 邦幫忙鐵人賽,歡迎前往購書...

鐵人賽 Modern Web DAY 20

技術 Day19 | Component 的測試方式不私藏

前言 今天要進入如何對 Component 做測試,這裡筆者之前是使用 Enzyme ,可能也是主流的 React 的測試框架,但是學測試的時候 React 剛...

鐵人賽 Modern Web DAY 12

技術 Day 12, React props and state 藏在component裡的變數

今天終於要開始講ReactJs了,我選擇先把Props跟State先講,因為這會關係到component的重新生成(re-render)。 好!先看看之前的He...

鐵人賽 Modern Web DAY 8

技術 Day08 - Tic Tac Toe篇:勝負判斷方法(1/2)

勝負判斷分析 窮舉法 在 3x3 的圈圈叉叉遊戲中,獲勝的組合只有 8 種,以上圖為例,每個格子裡面的數字代表 block id,我們窮舉出所有獲勝連線: /...

鐵人賽 Modern Web DAY 21
一步一腳印的React旅程 系列 第 21

技術 [筆記][React]來做個作品吧!待辦事項「todolist」篇(1)-用React-Router做選單

Hi!各位,想不到吧,已經到了最後十篇了,感覺真不想結束呢! 才怪!明明天天都在倒數文章數量XD,雖然這一趟很累,但是還是得要對自己來個期末測驗才行!所以接下來...

鐵人賽 Modern Web DAY 17

技術 17. [FE] 為什麼現在的前端都在用「框架」?

現在打開任何一間求職網站,搜尋前端相關職缺,幾乎每間公司的職缺都會在求職條件或加分項目中提到目前的三大框架:React、Vue、Angular;或著也可以到...

鐵人賽 Modern Web DAY 5

技術 【Day 5】 第一個 hook - useState

今天終於要介紹 React hooks 中的第一個hook 了 - useState,Start! 建立自己的 component 在講解 state 概念與...

鐵人賽 Modern Web DAY 21
React - DOM界的彼方 系列 第 21

技術 Day 21: React篇 - TodoApp程式 + 編輯項目

今天的主題是要加入項目的編輯功能,以及更多的CSS樣式。至於重點部份有兩個,第一個是CSS樣式的加入,第二個是如何切換項目的編輯。 這個程式最後的呈現結果,會...

鐵人賽 Modern Web DAY 16

技術 Day15 | React-Saga 見一次就愛上的 async flows

前言 在 Redux 中做非同步的請求其實是很麻煩的,這也是一開始讓我卡關的一個痛點,但好在有 StackOverflow 才沒讓這個痛持續很久。 其實一開始我...

鐵人賽 Modern Web DAY 5

技術 撰寫邏輯 - You call library. Framework calls you.

前言 我偶而間看到了,一個提問,『react is library or framework?』,這句提問似乎,沒什麼特別,但仔細想想,其實也算是一個大問題。今...

鐵人賽 Modern Web DAY 1

達標好文 技術 Day 00 | React With TypeScript - 旅途漫長,所以我們需要地圖

Hi!大家好,我是神 Q 超人,很開心又過了一年了(咦? 自從去年鐵人賽毅然決然退隱修煉後,一直在等著的就是這個機會 XD ,希望能夠記取去年到後半段不知道在寫...

鐵人賽 Modern Web DAY 15

技術 【Day15 路由神器 - React-router 】

講到 SPA(single page application)與傳統網頁的差異,應該很多人會想到傳統網頁跳頁往往會有一段載入時間,導致畫面空白,讓使用者需要對著...

鐵人賽 Modern Web DAY 13

技術 Day 13:Navigation Part II:新的 API - NavigationExperimental

前言 Product Pain 是 React Native 聆聽社群聲音的重要平台,而在上面 Navigator 是個知名的「Pain」,也催生了 Navig...

鐵人賽 Modern Web DAY 19

技術 【Day 19】可能不需要 redux - useReducer

今天要介紹另一個 hooks - useReducer。 光看第一行有些讀者可能就會有一些疑問了,udeReducer?看起來跟 redux 的 reducer...

技術 React 學習筆記_19(在React中使用Axios調用JSON-Server數據)

簡介 axios 是一個基於 Promise 的 HTTP 客戶端,專門服務於瀏覽器和 node.js 。 功能 在瀏覽器中傳送 XMLHttpRequest...

鐵人賽 Modern Web DAY 15
一步一腳印的React旅程 系列 第 15

技術 [筆記][React]當React遇上Redux(3)-從React組件操作Reducer

Hihi!大家好!這樣子的開頭還要在鐵人賽結束前繼續用下去,請大家多多包涵XD,昨天我們已經能夠從Redux中取到資料了,今天要來說說該怎麼把透過React來觸...

鐵人賽 自我挑戰組 DAY 15

技術 與工程師的協作之路-我與React前端工程師的協作模式

今天跟大家分享一套協作模式! 目前,我負責的部分是UI與切版,可是前端要使用react技術。(當然,不是每間公司都是這樣的工作職責分配,切版有時候不一定是設計師...

鐵人賽 Modern Web DAY 9

技術 【Day 9】Component Lifecycle

昨天對 class-based component 有了初步的認識,然而除了 state ,在 hooks 出來以前 class component 還有一項...

鐵人賽 Modern Web DAY 28

技術 [Day 28 - 即時天氣] 保存與更新使用者設定的地區資訊 - localStorage 與 useEffect 的搭配使用

感謝 iT 邦幫忙與博碩文化,本系列文章已出版成書「從 Hooks 開始,讓你的網頁 React 起來」,首刷版稅將全額贊助 iT 邦幫忙鐵人賽,歡迎前往購書...