iT邦幫忙

瑞瑞腦袋日記2.0相關文章
共有 31 則文章
鐵人賽 Modern Web DAY 30
激戰 ReactJS 30天 系列 第 31

技術 鐵人賽30天 參賽心得

激戰 ReactJS 30天這30天內每天都有新的挑戰和學習回顧起來真的覺得很充實能夠從看個網站說明英文查老半天到後來對關鍵字和一些程式碼產生敏銳度可以順順的看...

鐵人賽 Modern Web DAY 30
激戰 ReactJS 30天 系列 第 30

技術 【Day30】 30天 一步一腳印

前一日碰到的問題查看了幾次程式碼也到網路上去找找有沒有類似狀況最後沒有重新渲染的最根本原因是改變到原本的狀態資料而不是真正回傳一個新的狀態資料看到這具的時候覺得...

鐵人賽 Modern Web DAY 29
激戰 ReactJS 30天 系列 第 29

技術 【Day29】 哎呀?二度卡關T^T

今天圈圈叉叉遊戲完成寫了判斷連線的函式也加了條件檢查是否點了重複的位置如果原本的位置已經有圈或叉或者是遊戲已經連線結束便不會再讓使用者填寫 // reducer...

鐵人賽 Modern Web DAY 28
激戰 ReactJS 30天 系列 第 28

技術 【Day28】發現突破口!乘勝追擊 R

今天本來要直接就昨天的問題解決就在那個準備要連接這些組件的時候發現一個天大的問題那就是...我還有個登入的東東阿!(( 腦中無限東東echo )) 所以一個轉舵...

鐵人賽 Modern Web DAY 27
激戰 ReactJS 30天 系列 第 27

技術 【Day27】 天啊 一個卡關

現在到了開始準備加入資料流的部分先從圈圈叉叉開始設計 Actions這個遊戲有三個主要的行為第一個是根據點擊的位置按照順序放入圈和叉兩種符號這裡的重點在輪流這個...

鐵人賽 Modern Web DAY 26
激戰 ReactJS 30天 系列 第 26

技術 【Day26】 全能介面改造王

建議事項:點選BGM開啟之後再回來這邊繼續看下去 準備好了嗎?那就開始囉 登入頁 原本白皙無瑕的畫面只有簡單的一句引言如今改為使用黑色的區塊顯示搭配 css...

鐵人賽 Modern Web DAY 25
激戰 ReactJS 30天 系列 第 25

技術 【Day25】一個開始華麗變身~!

今天看著這些畫面想著一個畫面長成這樣的應該沒有人會想用吧?所以是時候發出強大的光芒搖身一變的時候了但是變身往往是需要一點時間的所以今天就來講講變身的方法Reac...

鐵人賽 Modern Web DAY 24
激戰 ReactJS 30天 系列 第 24

技術 【Day24】好逼真好寫實好重視使用者個資

看了看成就清單後發現有幾項沒有寫得很清楚所以改了一下描述然後呢就發現「挖 我這樣好像用不到表單欸」經過一番思考好吧我就來做一個好逼真好寫實好重視使用者個資的登入...

鐵人賽 Modern Web DAY 23
激戰 ReactJS 30天 系列 第 23

技術 【Day23】 有形才有靈

所有網頁的開始都是要先有框架才能繼續下去所以呢今天要把所有應該要看到的東西一口氣全長出來! 網頁框架&組件 首先來張腦海浮出的架構長相: 整個網頁總共有 6 個...

鐵人賽 Modern Web DAY 22
激戰 ReactJS 30天 系列 第 22

技術 【Day22】 今天!就是今天了!

好的這麼多天下來每天的學習筆記說實話可以拿來說明的概念還是非常非常多一個新技術的出現帶來的不只是單一面向的突破更多的是許多配套措施或新函式庫的誕生然而本人是屬於...

鐵人賽 Modern Web DAY 21
激戰 ReactJS 30天 系列 第 21

技術 【Day21】 不到最後一刻不能使出來的 - refs

在一般的 React 資料流狀況下父組件和子組件間只能透過 props 進行溝通但是在偶爾非常非常偶爾的情況下我們還是會需要在資料流以外對子組件進行變動像是觸發...

鐵人賽 Modern Web DAY 20
激戰 ReactJS 30天 系列 第 20

技術 【Day20】 向左走向右走 - Router

React 透過組件來實現動態載入網頁最常見的載入通常是網頁切換可是有些時候雖然切換網頁但兩個頁面上可能具有相同的東西如果能夠做到選擇那麼就能減少重新渲染的組件...

鐵人賽 Modern Web DAY 19
激戰 ReactJS 30天 系列 第 19

技術 【Day19】 見證奇蹟的時刻 - 實作Redux

學習要為自己負責為什麼上一篇明明講完了 Redux 這裡又要再一次拿出來做呢?因為看文字看過去對他的概念和用意略懂略懂但略懂還是不會用阿!所以臨時動議再追加一篇...

鐵人賽 Modern Web DAY 18
激戰 ReactJS 30天 系列 第 18

技術 【Day18】Reducks? - Redux

前篇介紹了 Flux 的單向資料流架構模型其實網路上有很多函式庫都在提供 API 實現 Flux 模型其中有一個特別好用的今天就要來了解這個資料流的函式庫 -...

鐵人賽 Modern Web DAY 17
激戰 ReactJS 30天 系列 第 17

技術 【Day17】 從哪來到哪去 - Data Flow

經歷了前面十幾天的學習對於 React 程式的撰寫略懂略懂可是只是會寫會讓資料跑出來卻不了解裡面的資料傳遞流程這樣實在是感覺有點給他不太舒服因此這篇筆記要來認識...

鐵人賽 Modern Web DAY 16
激戰 ReactJS 30天 系列 第 16

技術 【Day16】 合成合成雞蛋糕 - Composition

在 React 的世界中組件之間的關聯性(或者稱作溝通)透過繼承產生的狀態是一個方式不過還有另外一種方式可以達成這件事情也就是 Composition Comp...

鐵人賽 Modern Web DAY 15
激戰 ReactJS 30天 系列 第 15

技術 【Day15】 進入最佳狀態 - Lifting State Up

在程式開發過程常常會出現一種情況一個屬性或狀態同時控制好幾個網頁元素這個時候怎麼寫就會直接影響著網頁的運行效能為了養成良好的習慣今天就來談談應該要怎麼寫會比較好...

鐵人賽 Modern Web DAY 14
激戰 ReactJS 30天 系列 第 14

技術 【Day14】 我問你要答R - Forms

核心的概念在前10天差不多都認識了常常我們在寫網頁程式的時候會用到一些互動事件功能接下來就要來認識在 React 中是怎麼呈現這些比較常見的功能囉~ Forms...

鐵人賽 Modern Web DAY 13
激戰 ReactJS 30天 系列 第 13

技術 【Day13】 搭火車排排隊 - Lists and Keys

祝大家 2018新年快樂 =D雖然是值得慶祝的日子但挑戰還是依然要繼續新的一年希望能夠在最開始就達成持續30天的小成就那麼廢話不多說下面正文開始啦~~~ 當資料...

鐵人賽 Modern Web DAY 12
激戰 ReactJS 30天 系列 第 12

技術 【Day12】 Rendering

從激戰ReactJS系列開始以來為了滿足多到溢出來的好奇心以及證實自己理解的概念是否正確我們寫了很多小小小小測試程式這些程式裡面有一個共同點就是他們都有使用到r...

鐵人賽 Modern Web DAY 11
激戰 ReactJS 30天 系列 第 11

技術 【Day11】 發生什麼事 - Events

Events 開發網頁程式會需要很多不同的互動事件(Events)React 是開發網頁程式的工具之一所以勢必也可以使用這些 events今天就來稍微介紹一下...

鐵人賽 Modern Web DAY 10
激戰 ReactJS 30天 系列 第 10

技術 【Day10】 三個願望一次滿足 - 組件API

前面說明了組件的生命週期那這篇就要來介紹常常會使用到的三個 Component API setState 呼叫setState可以更新組件的 state並且會通...

鐵人賽 Modern Web DAY 9
激戰 ReactJS 30天 系列 第 9

技術 【Day09】 組件的一生 - Lifecycle

隨著生命的不同階段需要做的事情都不相同以上是廢話不過這道理在程式的世界也是一樣Component 也有它的生命週期這篇的目標就是要了解組件的生命週期以及每個階段...

鐵人賽 Modern Web DAY 8
激戰 ReactJS 30天 系列 第 8

技術 【Day08】 東西拿來 - Props

在上一篇的程式碼中出現了this.props.XXX這種長相的東西這一篇就要來仔細的看看究竟這是什麼神奇的東東囉 Props props 的中文翻譯是道具在這裡...

鐵人賽 Modern Web DAY 7
激戰 ReactJS 30天 系列 第 7

技術 【Day07】 你的狀態還好嗎 - State

State 在上一篇的最後有稍微提到組件(components)是可以透過 state 攜帶狀態資料state 是 constructor 中的一部分換句話說他...

鐵人賽 Modern Web DAY 6
激戰 ReactJS 30天 系列 第 6

技術 【Day06】 網頁的小零件 - Components

Components 組件(Components)可以說是React中的精隨在 React 的世界中網頁上我們所能夠看見的所有東西都可以是一個獨立的元件也就是本...

鐵人賽 Modern Web DAY 5
激戰 ReactJS 30天 系列 第 5

技術 【Day05】 說人話 - JSX

在前篇為了測試環境於是直接將程式碼拿來使用在那些程式碼裡面有個副檔名.jsx的東東聽說是 React 一個非常好用的語法那麼就用今天的筆記好好的來認識一下囉~...

鐵人賽 Modern Web DAY 4
激戰 ReactJS 30天 系列 第 4

技術 【Day04】 Hello World!

前一篇已經把所有需要事前安裝的東西們來歷用法都弄清楚了所以本篇要把環境架起來並且運行範例程式碼確認建置的環境是可以運行ReactJS的 環境建置 首先建立一個根...

鐵人賽 Modern Web DAY 3
激戰 ReactJS 30天 系列 第 3

技術 【Day03】 所需插件的介紹與安裝

React工具包 常常在做環境建置的工作的時候我們都只有乖乖的跟著教學走其實常常很好奇到底裝的都是些什麼然後能幹嘛但始終都被龐大數量的指令搞得頭昏腦脹而沒有真的...

鐵人賽 Modern Web DAY 2
激戰 ReactJS 30天 系列 第 2

技術 【Day 02】 什麼是 ReactJS ?

知己知彼才能百戰百勝開始激戰之前要先探探敵情才是所以這篇主要是對 ReactJS 做基本的介紹 本篇為針對ReactJS的行前說明,程式碼的部分後面會另外再分篇...