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

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

鐵人賽 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開啟之後 再回來這邊繼續看下去 準備好了嗎? 那就開始囉 登入頁 原本白皙無瑕的畫面 只有簡單的一句引言 如今改為使用黑色的區塊顯示...

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

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

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

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

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

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

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

技術 【Day23】 有形才有靈

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

鐵人賽 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...

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

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

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

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

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

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

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

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

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

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

技術 【Day12】 Rendering

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

鐵人賽 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的行前說明,程式碼的部分後面會另外...