iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 1 留言 1823 瀏覽

鐵人賽 Modern Web DAY 12

WordPress再進化，用Next.js拆分前端，實現UI完全客製化及優化效能與SEO 系列第 12 篇

技術 Day12 用 TailwindCSS 切版部落格首頁，顯示 WordPress 文章列表

上一篇我們成功在 Next.js 安裝 TailwindCSS，今天我們要實際來切版首頁，顯示文章列表！切版目標這個系列文章主要在呈現用 Next.js 當...

EasonChang ‧ 2021-09-26

0 Like 0 留言 1221 瀏覽

鐵人賽 Modern Web DAY 13

TailwindCSS - 從零開始系列第 13 篇

技術 TailwindCSS 從零開始 - 元件相同時，把共同樣式拉出來

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-26

0 Like 1 留言 2811 瀏覽

鐵人賽 Modern Web DAY 11

WordPress再進化，用Next.js拆分前端，實現UI完全客製化及優化效能與SEO 系列第 11 篇

技術 Day11 TailwindCSS 介紹，在 Next.js 專案安裝 TailwindCSS

上一篇我們成功安裝完 GraphQL client，並在首頁顯示出文章列表了。功能做完，接下來要來切版美化樣式了！在這邊我想使用 TailwindCSS 這套...

EasonChang ‧ 2021-09-25

0 Like 0 留言 1305 瀏覽

鐵人賽 Modern Web DAY 12

TailwindCSS - 從零開始系列第 12 篇

技術 TailwindCSS 從零開始 - 把重複使用的功能變成元件

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-25

0 Like 0 留言 1418 瀏覽

鐵人賽 Modern Web DAY 24

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 25 篇

技術 Day 24：「Switch 也要換遊戲片啦~」- Slot 插槽

不知道大家有沒有買 Switch 呢？雖然兔兔沒有 Switch，但我知道有遊戲片都不便宜呀！然後，遊戲總會有玩膩的時候這時候就要把記憶卡插槽裡的卡片拿出...

搋兔 ‧ 2021-09-25 ‧團隊IT成長營

2 Like 1 留言 1369 瀏覽

鐵人賽 Modern Web DAY 23

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 24 篇

技術 Day 23：「兒子，這是你的零用錢」- 元件間的資料傳遞

兔大夫：「請問是兔豪的家屬嗎？」兔豪爸：「是，我就是。請問我鵝子他...」兔大夫：「抱歉，我盡力了 ...」「他得的是一種 "會常常跟你討零...

搋兔 ‧ 2021-09-24 ‧團隊IT成長營

0 Like 0 留言 3373 瀏覽

鐵人賽 Modern Web DAY 11

TailwindCSS - 從零開始系列第 11 篇

技術 TailwindCSS 從零開始 - 讓 Variants 成為偽類的強大神器

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-24

0 Like 0 留言 2695 瀏覽

鐵人賽 Modern Web DAY 10

TailwindCSS - 從零開始系列第 10 篇

技術 TailwindCSS 從零開始 - 設定自己想要的 TailwindCSS 樣式 Variant

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-23

0 Like 0 留言 1818 瀏覽

鐵人賽 Modern Web DAY 8

關於 UI 元件你所該知道的事系列第 8 篇

技術 Day 08 - Design System x 實作 — Color System

今天是這系列第一次碰 Code，要來介紹三種 Color System 在專案中實作的方式，但實現方式絕對不只這三種，這邊只是提供個參考或概念給大家！這三種...

parkerhiphop027 ‧ 2021-09-23

3 Like 0 留言 1267 瀏覽

鐵人賽 Modern Web DAY 22

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 23 篇

技術 Day 22：「您好，歡迎登入 Vuta 奇幻世界」- 事件處理

「燈愣～」 (以下為系統登入事件的自動通知) 「您好，兔兔」「歡迎登入 Vuta 奇幻世界」咦 ...？系統登入事件？摁，我昨天是有登入沒錯。「燈愣～」...

搋兔 ‧ 2021-09-23 ‧團隊IT成長營

0 Like 0 留言 1578 瀏覽

鐵人賽 Modern Web DAY 21

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 22 篇

技術 Day 21：「爸爸說，家裡要重新裝潢了」- 關於樣式的屬性綁定講解

兔女鵝：「爸爸，兔兔昨天講的好難」「有一大堆東西要記起來，要學不動了 QQ」兔跋：「一定是家裡的裝潢太壓抑，要換！」兔女鵝：「不是，爸爸...應該跟裝潢沒...

搋兔 ‧ 2021-09-22 ‧團隊IT成長營

0 Like 0 留言 1538 瀏覽

鐵人賽 Modern Web DAY 9

TailwindCSS - 從零開始系列第 9 篇

技術 TailwindCSS 從零開始 - 偽類變體 Pseudo-Class Variants

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-22

0 Like 0 留言 653 瀏覽

鐵人賽 Modern Web DAY 6

關於我快30歲的後端工程師，想轉職成全端工程師，在前端世界中尋求機會的那件事(前端篇) 系列第 6 篇

技術 [Day 6]中秋時在做什麼，有沒有空，可以幫想標題嗎(前端篇)

今天來實作Navite Camp的Nav，看官們可以點網址去看他的效果，因為沒有時間，滑鼠移動到各tab時下面橘色border會滑順的移動，這個暫時沒時間去實作...

Moscle.dev ‧ 2021-09-21

0 Like 0 留言 5407 瀏覽

鐵人賽 Modern Web DAY 8

TailwindCSS - 從零開始系列第 8 篇

技術 TailwindCSS 從零開始 - 增加 Base 樣式

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-21

2 Like 0 留言 2787 瀏覽

鐵人賽 Modern Web DAY 20

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 21 篇

技術 Day 20：「資料拿來我就幫你改」- Vue 基礎觀念及常用語法

嘿～昨天的內容還行嗎？「兔兔，昨天突然就接收到大量語法！」齁，這個我就要說聲不好意思～原本是應該先介紹基本觀念，但我們今天基本觀念要寫在 SFC 裡面練習...

搋兔 ‧ 2021-09-21 ‧團隊IT成長營

3 Like 0 留言 3124 瀏覽

鐵人賽 Modern Web DAY 19

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 20 篇

技術 Day 19：「通通拿去做雞精啦！」- Vue SFC

嗨大家～昨天有沒有試著用 Creator 建立專案呢！沒有的話現在趕快去複習哦，因為我們今天會用到～之前有說過 Vue 是漸進式的，所以你用多用少都可以，...

搋兔 ‧ 2021-09-20 ‧團隊IT成長營

0 Like 1 留言 2975 瀏覽

鐵人賽 Modern Web DAY 7

TailwindCSS - 從零開始系列第 7 篇

技術 TailwindCSS 從零開始 - 手機到桌上螢幕，所有的元素都能自適應

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-20

3 Like 0 留言 2764 瀏覽

鐵人賽 Modern Web DAY 18

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 19 篇

技術 Day 18：「極速開發」- Vitawind

「閃電 + 疾風的組合嗎？不錯不錯！」既然我們之前都說了要用 Vue + Tailwind 來製作元件，那建立一個專案把這兩個東西安裝在一起總是必要的吧？...

搋兔 ‧ 2021-09-19 ‧團隊IT成長營

1 Like 0 留言 2841 瀏覽

鐵人賽 Modern Web DAY 6

TailwindCSS - 從零開始系列第 6 篇

技術 TailwindCSS 從零開始 - 每個 Utility class 都支援響應式與偽類

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-19

2 Like 0 留言 1863 瀏覽

鐵人賽 Modern Web DAY 17

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 18 篇

技術 Day 17：「我們，是好朋友哦～」- Vue 簡介

嗨各位，Tailwind 篇結束了，不知道會不會有人敲碗更多呢？還想知道更多的話也沒有問題～不過今天要進入全新的篇章！要說為什麼的話 ... 因為要想讓...

搋兔 ‧ 2021-09-18 ‧團隊IT成長營

0 Like 1 留言 2983 瀏覽

鐵人賽 Modern Web DAY 5

TailwindCSS - 從零開始系列第 5 篇

技術 TailwindCSS 從零開始 - CSS 傳統撰寫方式與功能優先的差異

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-18

3 Like 2 留言 3834 瀏覽

鐵人賽 Modern Web DAY 16

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 17 篇

技術 Day 16：「寶藏，都藏在那裡了！」- Tailwind JIT 模式

JIT、JIT 的叫了這麼多天，終於就是今天了！今天就是要來講解 JIT 模式哦～～ JIT 模式真的快非常非常多，快到你覺得你前面幾天根本在浪費人生 XD...

搋兔 ‧ 2021-09-17 ‧團隊IT成長營

0 Like 0 留言 3198 瀏覽

鐵人賽 Modern Web DAY 4

TailwindCSS - 從零開始系列第 4 篇

技術 TailwindCSS 從零開始 - 壓縮 Utility 檔案大小、安裝知能提示與最新版本須知

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-17

2 Like 0 留言 2183 瀏覽

鐵人賽 Modern Web DAY 15

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 16 篇

技術 Day 15：「你真的不減肥嗎...？」- Tailwind 的生產環境優化

兔大媽：「百貨公司在跳樓...大！拍！賣！！！（口水）」「趕快來去搶！！！」 (兔大媽掏出了小卡進行一番熱血的戰鬥) 兔大媽：「哇，害啊，買太多提不回家了....

搋兔 ‧ 2021-09-16 ‧團隊IT成長營

0 Like 0 留言 8843 瀏覽

鐵人賽 Modern Web DAY 3

TailwindCSS - 從零開始系列第 3 篇

技術 TailwindCSS 從零開始 - 起手式

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-16

2 Like 1 留言 2196 瀏覽

鐵人賽 Modern Web DAY 14

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 15 篇

技術 Day 14：「怎麼跟阿嬤的裹腳布一樣啦！」- 提取成元件

「噁 ... 那條是什麼鬼東西啦！」「對啊 ... 也太可怕了吧 ...」「嘔！還很臭欸 ...」「那是阿嬤的裹腳布吧！！！！」「不是啦 ...，那個就...

搋兔 ‧ 2021-09-15 ‧團隊IT成長營

0 Like 0 留言 2249 瀏覽

鐵人賽 Modern Web DAY 2

TailwindCSS - 從零開始系列第 2 篇

技術 TailwindCSS 從零開始 - 選擇該框架的原因

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-15

0 Like 0 留言 2697 瀏覽

鐵人賽 Modern Web DAY 1

TailwindCSS - 從零開始系列第 1 篇

技術 TailwindCSS 從零開始 - 寫在前面

此系列文章已改編成書，歡迎購買：https://www.tenlong.com.tw/products/9786267146460?list_name=i-...

Tim Hsu ‧ 2021-09-14

1 Like 0 留言 3580 瀏覽

鐵人賽 Modern Web DAY 13

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 14 篇

技術 Day 13：「誰還在背字典？」- Tailwind IntelliSense 插件

嗨大家好，昨天建立的如何呢！我想應該不會遇到太多的困難吧～雖然上次沒有明講，但我想應該大部分人都是用 VS Code 在開發吧？既然如此我們就來介紹個好用...

搋兔 ‧ 2021-09-14 ‧團隊IT成長營

3 Like 0 留言 6205 瀏覽

鐵人賽 Modern Web DAY 12

排版神器 Tailwind CSS～和兔兔一起快速上手漂亮的元件開發！系列第 13 篇

技術 Day 12：「我可不可以 CDN 就好？」- Tailwind 安裝及設定

前面的功能介紹和小練習都度過了，我們現在要來學習如何安裝和設定囉！！！不過說到安裝啊，有些人可能會想：「兔兔！如果我只是想要做簡單的應用和練習呢？還要安...

搋兔 ‧ 2021-09-13 ‧團隊IT成長營

技術 Day12 用 TailwindCSS 切版部落格首頁，顯示 WordPress 文章列表

技術 TailwindCSS 從零開始 - 元件相同時，把共同樣式拉出來

技術 Day11 TailwindCSS 介紹，在 Next.js 專案安裝 TailwindCSS

技術 TailwindCSS 從零開始 - 把重複使用的功能變成元件

技術 Day 24：「Switch 也要換遊戲片啦~」- Slot 插槽

技術 Day 23：「兒子，這是你的零用錢」- 元件間的資料傳遞

技術 TailwindCSS 從零開始 - 讓 Variants 成為偽類的強大神器

技術 TailwindCSS 從零開始 - 設定自己想要的 TailwindCSS 樣式 Variant

技術 Day 08 - Design System x 實作 — Color System

技術 Day 22：「您好，歡迎登入 Vuta 奇幻世界」- 事件處理

技術 Day 21：「爸爸說，家裡要重新裝潢了」- 關於樣式的屬性綁定講解

技術 TailwindCSS 從零開始 - 偽類變體 Pseudo-Class Variants

技術 [Day 6]中秋時在做什麼，有沒有空，可以幫想標題嗎(前端篇)

技術 TailwindCSS 從零開始 - 增加 Base 樣式

技術 Day 20：「資料拿來我就幫你改」- Vue 基礎觀念及常用語法

技術 Day 19：「通通拿去做雞精啦！」- Vue SFC

技術 TailwindCSS 從零開始 - 手機到桌上螢幕，所有的元素都能自適應

技術 Day 18：「極速開發」- Vitawind

技術 TailwindCSS 從零開始 - 每個 Utility class 都支援響應式與偽類

技術 Day 17：「我們，是好朋友哦～」- Vue 簡介

技術 TailwindCSS 從零開始 - CSS 傳統撰寫方式與功能優先的差異

技術 Day 16：「寶藏，都藏在那裡了！」- Tailwind JIT 模式

技術 TailwindCSS 從零開始 - 壓縮 Utility 檔案大小 、安裝知能提示與最新版本須知

技術 Day 15：「你真的不減肥嗎...？」- Tailwind 的生產環境優化

技術 TailwindCSS 從零開始 - 起手式

技術 Day 14：「怎麼跟阿嬤的裹腳布一樣啦！」- 提取成元件

技術 TailwindCSS 從零開始 - 選擇該框架的原因

技術 TailwindCSS 從零開始 - 寫在前面

技術 Day 13：「誰還在背字典？」- Tailwind IntelliSense 插件

技術 Day 12：「我可不可以 CDN 就好？」- Tailwind 安裝及設定

標記使用者

技術 TailwindCSS 從零開始 - 壓縮 Utility 檔案大小、安裝知能提示與最新版本須知