iT邦幫忙

react相關文章
共有 1540 則文章

技術 《賴田捕手:番外篇》第 37 天:用 Netlify 佈署前端網頁 (二)

《賴田捕手:番外篇》第 37 天:用 Netlify 佈署前端網頁 (二) 雖然他愛著所有的佈署方式,Netlify 老爹心裡有著特別中意的一種,那是他最年輕...

鐵人賽 Modern Web DAY 2

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

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

鐵人賽 Modern Web DAY 26

技術 Day 26 - 30 天 Progressive Web App 學習筆記 - To-Do List 實作 PWA - React + Redux + Webpack 環境建置

接下來 3 篇文章的目標是以 React + Redux + Webpack 的技術來完成 To-Do List 功能與 PWA,而內容會假設讀者已經熟悉 Re...

鐵人賽 Modern Web DAY 5

技術 Day04 | SCSS 加上 Webpack 混搭款,讓你寫 CSS 上天堂

前言 SCSS 是 CSS 的預處理器,就是替原本的 CSS 再加上一些強大的語法,讓我們在寫 CSS 的時候可以更加直觀,相關說明可以查閱 官方文檔 ,本篇就...

鐵人賽 Modern Web DAY 15

達標好文 技術 [Day 15 - 即時天氣] 就是這個畫面 - 使用 Emotion 為組件增添 CSS 樣式

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

徵才 招聘/全職/兼職平台前端開發工程師(遠程)

職位描述: 負責平台級線上遊戲網站 iGaming 應用產品的架構設計和開發工作; 參與前端前沿技術、理念的跟進、預研和落地; 參與前端技術架構、規範、研發流...

技術 [筆記]動態<input type="file" /> 新增&刪除&圖片預覽-React.js

開頭 基礎 使用javascript 透過按鈕新增刪除欄位 進階 新增圖片並有圖片預覽功能 基礎 Demo:https://codepen.io/Canda...

鐵人賽 Modern Web DAY 11

技術 Day11 - 貪吃蛇篇:前言及功能構想

前言 談到經典小遊戲,除了圈圈叉叉遊戲之外,還有一個家喻戶曉的遊戲,就是貪吃蛇,雖然現在智慧型手機和各種遊戲機的遊戲越做越華麗,越來越炫砲,但是經典的遊戲終究還...

鐵人賽 自我挑戰組 DAY 6

技術 【DAY 06】React!還有?refs你別來好不?

【前言】  前兩篇講到props、state,可是阿,有時候看到滿滿jquery的特效就很想拿來react用,可是jquery那些都要直接對實體DOM做操作;抑...

鐵人賽 Modern Web DAY 11

技術 [Day 11] 用 Node.js 建立一個簡單的 Http Proxy

在上一篇文章中我們了解了 proxy pattern 的概念,也明白現今軟體架構有非常多適合應用這個 pattern 的 use cases。今天則想聚焦在 h...

鐵人賽 Modern Web DAY 5

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

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

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

技術 Day 23: React篇 - TodoApp程式 + Fetch/Ajax 於生命週期方法

今天的主題是要加入與伺服器資料互動的功能,一般我們所說的在網頁上的JavaScript應用與伺服器溝通,指的就是使用Ajax技術,傳送資料到伺服器或是與伺服器...

鐵人賽 Modern Web DAY 24

技術 【Day 24】 useRef

useRef 是一個可以讓我們抓取到 DOM 節點的 hooks。 實作上非常簡單,直接來看範例吧: import React, { useRef } from...

鐵人賽 Modern Web DAY 27
I Want To Know React 系列 第 27

技術 I Want To Know React - Context 語法

回顧 Context 在上一章節中,我們介紹了何謂 context。 Context 是一種利用向下廣播來傳遞資料的方式,此方法可以解決 props 必須要一層...

鐵人賽 Modern Web DAY 21

技術 [Day 21 - 即時天氣] 處理天氣圖示以及 useMemo 的使用

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

技術 React 的 export default和export明明是兩兄弟,但卻不一樣。

React 的 export default和export明明是兩兄弟,但卻不一樣。 export default一個js只有一個回傳值,用export def...

鐵人賽 Modern Web DAY 10

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

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

鐵人賽 Modern Web DAY 1

技術 Day 01:使用 Modern Web 技術來打造 Native App

前言 React Native 是由 Facebook 所開發的行動應用程式開發框架,雖然也是使用 JSX、CSS in JS 等 Web 技術來開發,但開發的...

鐵人賽 Modern Web DAY 15

技術 [Day 15] Server-Side-Rendering - (2) feat. Next.js

前一天介紹了 SSR 基本概念,今天則是要介紹 React 最有名的 SSR 框架:Next.js。 今天不是要來講 Next.js 怎麼使用,畢竟網路上學習資...

鐵人賽 Modern Web DAY 6

技術 仿Trello - 使用React Bootstrap

本系列文以製作專案為主軸,紀錄小弟學習React以及GrahQL的過程。主要是記下重點步驟以及我覺得需要記憶的部分,有覺得不明確的地方還請留言多多指教。 要...

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

技術 Day 25: Redux篇 - 介紹 與 第一個範例

今天的主題是Redux,一開始我們先看它是如何運作的,Redux並不是只能在React應用中使用,而是可以在一般的應用中使用。第一個例子是一個簡單的JavaS...

鐵人賽 Modern Web DAY 16

技術 【Day.16】React入門 - 想要分頁? react-router-dom

(2024/04/06更新) 因應React在18後更新了許多不同的語法,更新後的教學之後將陸續放在 新的blog 中,歡迎讀者到該處閱讀,我依然會回覆這邊的...

鐵人賽 Modern Web DAY 7

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

前言 我找到一篇 Redux 的初學教學,是一個外國人寫的,我順便翻寫他所做的文章,也方便我釐清觀念。 Getting started with create...

鐵人賽 Modern Web DAY 20

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

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

鐵人賽 Software Development DAY 9
React框架白話文運動 系列 第 9

技術 React白話文運動09-建立 React 專案

前言 嗨,我是Hogan目前在經營自己的自媒體 hogan.tech主要分享一些有關於程式碼、軟體和科技業經驗分享有興趣的讀者可以進一步關注我,進而獲得更多資訊...

鐵人賽 Modern Web DAY 24

技術 【Day.24】React效能 - 用lazy和Suspense來動態載入元件

(2024/04/06更新) 因應React在18後更新了許多不同的語法,更新後的教學之後將陸續放在 新的blog 中,歡迎讀者到該處閱讀,我依然會回覆這邊的...

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

技術 Day19: React篇: TodoList程式 + 樣式(Style)

本章的目標是在React元件中的套用樣式(Style),而且可以因狀態改變的作樣式變化,從上一章的程式碼作這些修改都是很簡單的,在React中使用CSS的樣式...

鐵人賽 Software Development DAY 6
React框架白話文運動 系列 第 6

技術 React白話文運動06-React運作原理

前言 嗨,我是Hogan目前在經營自己的自媒體 hogan.tech主要分享一些有關於程式碼、軟體和科技業經驗分享有興趣的讀者可以進一步關注我,進而獲得更多資訊...

鐵人賽 Modern Web DAY 14

技術 【Day.14】React入門 - 輸入元素與控制組件

(2024/04/06更新) 因應React在18後更新了許多不同的語法,更新後的教學之後將陸續放在 新的blog 中,歡迎讀者到該處閱讀,我依然會回覆這邊的...

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

技術 [筆記][React]React網頁好朋友Router(2)-掌握match是成功的一半

Hi,大家好,昨天介紹了一些關於Router的基本用法,也解決了在實作時遇到的一些問題,不過在都已經解決掉的現在就讓我們繼續學習吧! match 在Router...