iT邦幫忙

學習筆記相關文章
共有 587 則文章
鐵人賽 自我挑戰組 DAY 26

技術 Day 26 CSS3 < 3D轉換 transform>

3D轉換跟2D轉換不同的是使用三維坐標系(多了Z軸座標) 1.三維坐標系是由三個軸共同組成的 X軸 : 水平向右 注意: X軸右邊是正值 左邊是負值 Y軸 :...

鐵人賽 Modern Web DAY 22

技術 中階魔法 - 陳述式與表達式

前情提要 艾草:「我們今天來聊聊話語藝術。」 「咦,這跟魔法有什麼關聯嗎?」 艾草:「嗯,算是某種言靈魔法,話語間的藝術有時候會為你帶來好的結果,有時候看起來沒...

鐵人賽 Modern Web DAY 21
Vue.js 什麼意思 系列 第 21

技術 Day 21:總匯複習-Vuex、Route

前幾篇介紹了 Vuex 管理資料狀態,以及在生命週期或導航守衛發送 API 的時機點,再次回到專案範例,目前已處理好顯示導覽列中的全部書單內容,我們接續完成其他...

鐵人賽 自我挑戰組 DAY 25

技術 Day 25 CSS3 < 2D轉換 transform>

轉換 (transform)實現元素的位移、旋轉、縮放等效果,可以簡單理解為變形。 移動 translate 旋轉 rotate 縮放 scale 1.2D...

鐵人賽 Modern Web DAY 21

技術 中階魔法 - 傳值、傳參考

前情提要 艾草:「來,接球!」 (我看著眼前一顆球飛了過來,正準備伸出手接時,突然變成了兩顆。) 「咦咦,為何?」 艾草:「我用魔法複製了一顆球呀!」 「這麼好...

鐵人賽 Modern Web DAY 20
Vue.js 什麼意思 系列 第 20

技術 Day 20:全域、路由、元件內-Navigation Guards

之前有預告過,發送 API 的時機點需視不同情境及 UX 體驗規劃而定,因此除了選擇在元件內的生命週期 created 發送,另外在 Vue Router 還有...

鐵人賽 Modern Web DAY 25

技術 Day25|【Git】git stash 暫存檔案

可能會遇到使用 git stash 指令情境: 假想今天可能在公司進行手中任務時,突然接收到老闆或是合作夥伴的緊急求救,請你立刻放下目前工作,改進行新的棘手...

鐵人賽 Modern Web DAY 24

技術 Day24|【Git】認識 git tag 標籤常用指令、標籤與分支的差異

介紹完分支後,這篇來講解「標籤」吧! 標籤在日常生活中可以解釋成標示簡單訊息的小牌子,而在學習階段,應該也有使用過標籤來做筆記,幫助我們快速找到我們想看的那一頁...

鐵人賽 Modern Web DAY 23

技術 Day23|【Git】各種合併衝突與分別解決方式

了解分支的用途後,在合作開發上一定便利許多,但同樣地,不是每件事情都順順利利,只要有合作的事情,總是會有衝突、摩擦的狀況發生。在 Git 分支裡,常碰到「合併衝...

鐵人賽 Modern Web DAY 22

技術 Day22|【Git】合併的另一個指令 - Rebase 與取消方式

前面介紹了 git merge 指令合併分支,本篇就來介紹另一種方式: Rebase 。 從 Rebase 字面來看,是 re 加上 base ,可以理解成「...

鐵人賽 Modern Web DAY 21

技術 Day21|【Git】合併分支 git merge 指令 、快轉模式Fast Forward 、救回被砍掉的未合併分支方法

分支合併的方法有兩種:merge 和 rebase 本篇先講解使用 merge 來合併分支的觀念。 合併分支基本概念 情境|想要使用 A 分支來合併 B 分支...

鐵人賽 自我挑戰組 DAY 24

技術 Day 24 CSS3 < 過渡 transition>

過渡 (transition) 是可以在不使用Flash動畫或JavaScript的情況下,當元素從一種樣式變換成另一種樣式時為元素添加效果,經常和 :hove...

鐵人賽 Modern Web DAY 19
Vue.js 什麼意思 系列 第 19

技術 Day 19:有名模組,無限輔助-Vuex Modules、Map Helper

前兩篇介紹完 Vuex 的核心概念,最後當中大型專案需要組織較為複雜的資料結構時,總不可能一個 index.js 就塞滿所有資料量,這會造成取用和管理上的不便,...

鐵人賽 Modern Web DAY 20

技術 中階魔法 - 範圍鍊 Scope Chain

前情提要 上回與艾草玩遊戲輸了要接受處罰。 「都躲這麼遠了,她應該找不到我了吧!」 艾草:「啊哈,原來你躲在這裡呀!」 「你怎麼找到的?明明我跑超遠了呀。」 艾...

鐵人賽 自我挑戰組 DAY 23

技術 Day 23 CSS3 < 目標選擇器>

CSS3新增的目標選擇器類型: 1.屬性選擇器 屬性選擇器可以根據元素特定屬性來選擇元素,這樣就可以不用藉助於類或者ID選擇器 MDN Web Docs 屬性選...

鐵人賽 Modern Web DAY 18
Vue.js 什麼意思 系列 第 18

技術 Day 18:產地直送,先拿再用-Vuex State、Getters

承上篇從 Actions 進展到 Mutations,接下來讓 Mutations 將結果直接賦值給 State,繼續接棒完成 Vuex 狀態存取流程! Sta...

鐵人賽 Modern Web DAY 19

技術 中階魔法 - 執行環境與執行堆疊

前情提要 上回偷拿遠距離初階魔法攻擊艾草。 艾草:「我看你拿魔法丟我丟得挺順的了(╬•᷅д•᷄╬),那開始教你中階魔法吧!」 「喔喔喔喔喔,被我扔到良心發現了嗎...

鐵人賽 Modern Web DAY 17
Vue.js 什麼意思 系列 第 17

技術 Day 17:異步行動,同步變動-Vuex Actions、Mutations

Vuex 是個處理全域資料的狀態管理庫,採集中式管理方式,方便任何元件都能從中獲取狀態或觸發事件,實作上通常用來存儲 API 資料後再加以應用,尤其適合應用於開...

鐵人賽 自我挑戰組 DAY 22

技術 Day 22 HTML5 <HTML5 input類型、表單標籤>

HTML5新增的input類型: &lt;!-- 需添加form表單域 --&gt; &lt;form action=&quot;&quot;&gt;...

鐵人賽 Modern Web DAY 18

技術 入門魔法 - ES6 箭頭函式寫法

前情提要 上回學習遠距離火屬性初階魔法。 「呼,總算學完了,我來試試發射看吧!」 艾草:「欸欸,你不要都往我身上丟啊啊啊,雖然這火很弱,但不要亂來啊啊!」 「啊...

鐵人賽 Modern Web DAY 20

技術 Day20|【Git】介紹分支觀念與切換分支指令動作

上篇介紹關於分支的常用指令,那麼這篇讓我們好好了解分支是什麼吧! 分享我最初聽到「分支」時,我的理解是: 在原有的支線上,另闢一條新的支線,然後把內容移過去,之...

鐵人賽 Modern Web DAY 19

技術 Day19|【Git】開始使用分支 - git branch(基本常用指令)

學習完 git 的基本觀念後,我們就來進入下一階段,創建分支吧! 為什麼會需要分支呢? 分支的好處在於當多人同時使用專案時,大家可以針對這個專案各自建立自己的分...

鐵人賽 Modern Web DAY 18

技術 Day18|【Git】存在 .git 目錄裡的東西 - Commit 與 Tag(下)

在上一篇章節介紹過 Blob 物件與 Tree 物件後,接下來讓我們認識 Commit 與 Tag 分別是什麼吧! Commit 擁有 SHA1 檔名,儲存...

鐵人賽 Modern Web DAY 17

技術 Day17|【Git】存在 .git 目錄裡的東西 - Blob 物件與 Tree 物件(上)

Git 有四種 type (類型) 的物件:blob、tree、commit 和 tag。 本篇主要先來講解 Blob 物件與 Tree 物件。 本篇會使用到...

鐵人賽 Modern Web DAY 16
Vue.js 什麼意思 系列 第 16

技術 Day 16:axios 先封裝,API 輕鬆發

上篇我們在單一元件內使用 axios 發送 API,但如果專案規模愈來愈大,需要同時管理多個功能的 API,例如顯示單一書目資料、會員登入系統、查詢會員資料、查...

鐵人賽 Modern Web DAY 17

技術 入門魔法 - 透過 axios 發送網路請求

前情提要 上回提到了要透過 AJAX 遠距離魔法呼叫精靈並等待精靈回覆。 艾草:「來,我們先來試試看 AJAX 的其中一段咒語 :XMLHttpRequests...

鐵人賽 Modern Web DAY 16

技術 入門魔法 - AJAX

前情提要 經過上次火屬性初階魔法近距離灼傷手指後。 「就不能讓這個火離我遠一點嗎?遠距離魔法不存在嗎?」 艾草:「你這麼一說我倒是想起來了,有一個方法可以遠距離...

鐵人賽 自我挑戰組 DAY 21

技術 Day 21 HTML5 <HTML5 多媒體標籤>

多媒體標籤可以很方便的在頁面中嵌入音頻和視頻,而不用去使用flash和其他瀏覽器的插件,多媒體標籤主要分為視頻標籤、音頻標籤 1.視頻標籤 &lt;video&...

鐵人賽 自我挑戰組 DAY 20

技術 Day 20 CSS & HTML5 <CSS的初始化 & HTML5 新增的語意化標籤>

CSS的初始化 簡單理解 : CSS初始化是指重設瀏覽器的樣式 (也稱 CSS reset) 每個網頁都必須首先進行 CSS初始化 初始化範例 : /* 把我们...

鐵人賽 Modern Web DAY 15
Vue.js 什麼意思 系列 第 15

技術 Day 15:在生命週期呼喊 API

在鐵人賽即將過半之際,終於要來串接 API 顯示真實的書單資料了!不過在此之前,我們應該先來了解一下 Vue.js 的生命週期。 生命週期(Lifecycle)...