iT邦幫忙

modern web相關文章
共有 490 則文章
0 Like 0 留言 9 瀏覽
鐵人賽 Modern Web DAY 5
重溫 React 官方文件回到最初的起點 系列 第 5 篇

技術 Day 05 - 在 JSX 中使用 JavaScript 的大括號

在昨天的文章中介紹了 JSX 的基本用法，並且知道了 React Component 是會把架構、外觀、互動結合在一起使用 JavaScript 來完成的地方。...

lihsuanh ‧ 2025-09-19
0 Like 0 留言 25 瀏覽
鐵人賽 Modern Web DAY 5
不只是登入畫面！一起打造現代化登入系統 系列 第 5 篇

技術 房門與門鎖[ 2 / 6 ]：React 生態系導入 — 表單驗證 & Router 分頁

上一篇我們利用 Tailwind 打造了登入頁的基本樣貌，但光有門面還不夠，若沒有鎖與防護，這扇大門依然不安全😣。本篇我們將引入 React 生態系的函式庫進行...

阿杰 ‧ 2025-09-19 ‧團隊夢幻公牛
0 Like 0 留言 56 瀏覽
鐵人賽 Modern Web DAY 4
重溫 React 官方文件回到最初的起點 系列 第 4 篇

技術 Day 04 - Writing Markup with JSX

在 Day 02 有提到 React Component 會是一個 function 並且回傳 JSX 格式，今天就會來介紹什麼是 JSX，並且他跟一般的 Ht...

lihsuanh ‧ 2025-09-18
0 Like 0 留言 92 瀏覽
鐵人賽 Modern Web DAY 0
前端工程師的 Modern Web 實踐之道 系列 第 5 篇

技術 前端框架三強鼎立：React vs Vue vs Angular 的深度解析與選擇策略

系列文章: 前端工程師的 Modern Web 實踐之道 - Day 5預計閱讀時間: 16 分鐘難度等級: ⭐⭐⭐☆☆ 🎯 今日目標 在前一篇文章中，我們...

kevin900224 ‧ 2025-09-18
0 Like 0 留言 68 瀏覽
鐵人賽 Modern Web DAY 2
不只是登入畫面！一起打造現代化登入系統 系列 第 2 篇

技術 打造地基 [ 1 / 2 ]：建立 React + TS 開發環境

鐵人賽在今天正式啟程啦🤩！建立新專案，打好基礎是最重要的一步。這也迎來這30天中的第一個主題 — 「打造地基」，這篇內容在網路或歷屆鐵人賽文章中都有非常多資源，...

阿杰 ‧ 2025-09-16 ‧團隊夢幻公牛
0 Like 0 留言 25 瀏覽
鐵人賽 Modern Web DAY 0
前端工程師的 Modern Web 實踐之道 系列 第 4 篇

技術 TypeScript：現代前端開發的必修課還是選修課？

系列文章: 前端工程師的 Modern Web 實踐之道 - Day 4預計閱讀時間: 10 分鐘難度等級: ⭐⭐⭐☆☆ 🎯 今日目標 在前一篇文章中，我們...

kevin900224 ‧ 2025-09-17
0 Like 0 留言 79 瀏覽
鐵人賽 Modern Web DAY 0
前端工程師的 Modern Web 實踐之道 系列 第 3 篇

技術 套件管理器選擇指南：npm、yarn、pnpm、bun

系列文章: 前端工程師的 Modern Web 實踐之道 - Day 3預計閱讀時間: 10 分鐘難度等級: ⭐⭐⭐☆☆ 🎯 今日目標 在前一篇文章中，我們...

kevin900224 ‧ 2025-09-17
0 Like 0 留言 112 瀏覽
鐵人賽 Modern Web DAY 0
前端工程師的 Modern Web 實踐之道 系列 第 2 篇

技術 告別設定地獄：Modern Web 開發環境的正確打開方式

系列文章: 前端工程師的 Modern Web 實踐之道 - Day 2預計閱讀時間: 15 分鐘難度等級: ⭐⭐⭐☆☆ 🎯 今日目標 在 Day 1 中，...

kevin900224 ‧ 2025-09-16
0 Like 0 留言 31 瀏覽
鐵人賽 Modern Web DAY 1
重溫 React 官方文件回到最初的起點 系列 第 1 篇

技術 Day 01 - 前言

這是連續第三年參加鐵人賽，這次跟以往不同的棒球數據分析不同，選擇了跟網頁開發比較相關的主題。原因是我其實本來的正職就是網頁前端工程師，所以網頁開發是我更熟悉的部...

lihsuanh ‧ 2025-09-15
0 Like 0 留言 94 瀏覽
鐵人賽 Modern Web DAY 0
前端工程師的 Modern Web 實踐之道 系列 第 1 篇

技術 重新思考前端開發：什麼是真正的 Modern Web？

系列文章: 前端工程師的 Modern Web 實踐之道 - Day 1預計閱讀時間: 12 分鐘難度等級: ⭐⭐⭐☆☆ 📖 前言：一個全端工程師的技術反思...

kevin900224 ‧ 2025-09-16
0 Like 0 留言 209 瀏覽
鐵人賽 Modern Web DAY 3
WordPress核心全端開發實戰 系列 第 3 篇

技術 WordPress主題(Theme)如何開發？

主題開發方式分成以下兩種：1.區塊佈景主題(BlockTheme) 從WordPress5.9版本開始可以使用的一種新型佈景主題。它是由HTML和一個佈景主題設...

ZhuangKai ‧ 2025-08-03
0 Like 1 留言 1039 瀏覽
鐵人賽 Modern Web DAY 30
創意前端設計：用 Vue.js 打造 30 個互動實用功能 系列 第 30 篇

技術 Day30 Vue.js 最終：打造貓咪動效廣告牆的最後一哩路

用一點動態魔法讓你的網站更生動 大家好！今天是 IT 鐵人賽的第三十天，真不知不覺我們已經走到了終點！這段旅程有很多調皮又溫馨的記憶，而今天我們要終於來做一個...

Sunny.Cat ‧ 2024-10-14
1 Like 1 留言 768 瀏覽
鐵人賽 Modern Web DAY 30
Backend Developer的學習Roadmap 系列 第 30 篇

技術 Day 30 web server介紹

今天是30天挑戰的最後一天啦，我們就來介紹一下什麼是web server吧 什麼是 Web Server? 「網路伺服器」（web server）可以指軟體、也...

linitachi ‧ 2024-10-14 ‧團隊震驚 2.0
0 Like 0 留言 514 瀏覽
鐵人賽 Modern Web DAY 29
創意前端設計：用 Vue.js 打造 30 個互動實用功能 系列 第 29 篇

技術 Day29 Vue.js 動效分類實戰 (20) 蛋糕特輯 - 來過生日！吹氣 + 驚喜動畫，慶祝儀式感拉滿

🎂 生日蛋糕互動秀：吹氣熄蠟燭，還有彩帶灑滿天！🎉 嘿嘿嘿，今天要來和大家分享一個超可愛又好玩的生日蛋糕互動網站這個專案不但有超酷的動畫效果，還能用聲音把蠟燭...

Sunny.Cat ‧ 2024-10-13
0 Like 0 留言 592 瀏覽
鐵人賽 Modern Web DAY 28
創意前端設計：用 Vue.js 打造 30 個互動實用功能 系列 第 28 篇

技術 Day 28 Vue.js 動效分類實戰 (19) 星球特輯 - 把宇宙裝進你的網頁

從行星選擇到動畫過渡，揭開星球切換背後的技術秘密 在今天的實作中，我們將用 Vue.js 和動畫效果來實現一個超酷的行星選擇器！透過點擊文字，我們可以淡入淡...

Sunny.Cat ‧ 2024-10-12
0 Like 0 留言 266 瀏覽
鐵人賽 Modern Web DAY 29
Backend Developer的學習Roadmap 系列 第 29 篇

技術 Day 29 Monitoring

今天我們要來介紹什麼是monitoring，他是一個很重要的概念，對我們的app品質的監控。 What is Monitor? 我們可以通過工具或是腳本或是平台...

linitachi ‧ 2024-10-13 ‧團隊震驚 2.0
0 Like 0 留言 639 瀏覽
鐵人賽 Modern Web DAY 27
創意前端設計：用 Vue.js 打造 30 個互動實用功能 系列 第 27 篇

技術 Day 27 Vue.js 動效分類實戰 (18) 整合特輯 - 技術全解析，打造精緻的卡片翻牌遊戲

翻牌效果深入解析，帶你揭開背後的技術秘密！ 今天，我們將用 Vue.js 和 TypeScript 實現一個充滿趣味的翻牌遊戲，讓你不僅能挑戰自己的記憶力，...

Sunny.Cat ‧ 2024-10-11
0 Like 0 留言 414 瀏覽
鐵人賽 Modern Web DAY 28
Backend Developer的學習Roadmap 系列 第 28 篇

技術 Day 28 Migration Strategies

當我們服務了一陣子以後，可能因為種種原因，例如公司政策改變(Docker企業版收費)等，我們需要將某項技術、DB等搬遷到另一個地方，就需要做migration。...

linitachi ‧ 2024-10-12 ‧團隊震驚 2.0
0 Like 0 留言 408 瀏覽
鐵人賽 Modern Web DAY 27
Backend Developer的學習Roadmap 系列 第 27 篇

技術 Day 27 Mitigation Strategies - Circuit Breaker

Circuit Breaker是我們生活中很常見的東西，我們的總電源開關就是一個circuit breaker，當它的電流太大時，它就會自動切斷電源，來保護設備...

linitachi ‧ 2024-10-11 ‧團隊震驚 2.0
0 Like 0 留言 315 瀏覽
鐵人賽 Modern Web DAY 25
創意前端設計：用 Vue.js 打造 30 個互動實用功能 系列 第 25 篇

技術 Day25 Vue.js 動效分類實戰 (16) 毛玻璃 + 五彩紙屑特輯 - 視覺與腦力的雙重挑戰，終極密碼遊戲

滑順毛玻璃，精緻視覺！玩遊戲還能這麼享受？ 你能破解這個終極密碼嗎？🌟 使用 Vue.js 與 TypeScript 打造的猜數字遊戲，搭配毛玻璃效果與繽紛...

Sunny.Cat ‧ 2024-10-09
0 Like 0 留言 617 瀏覽
鐵人賽 Modern Web DAY 26
Backend Developer的學習Roadmap 系列 第 26 篇

技術 Day 26 Mitigation Strategies - Backpressure

今天要繼續來介紹對server穩定性會有影響的Backpressure。 Backpressure(背壓) 單純看中文翻譯會不知道這是在做什麼的 今天下游系統無...

linitachi ‧ 2024-10-10 ‧團隊震驚 2.0
0 Like 0 留言 1079 瀏覽
鐵人賽 Modern Web DAY 24
創意前端設計：用 Vue.js 打造 30 個互動實用功能 系列 第 24 篇

技術 Day24 Vue.js 動效分類實戰 (15) SVG特輯 - 實現旋轉華麗的台灣國旗動效，簡單又帥氣

用 Vue.js 創造華麗的國旗動態效果 這次我們來玩點有趣的東西！我們的 SVG 特輯靈感來自台灣國旗，設計比例可是參考了維基百科上的資料哦。而且，我們不...

Sunny.Cat ‧ 2024-10-08
0 Like 0 留言 288 瀏覽
鐵人賽 Modern Web DAY 25
Backend Developer的學習Roadmap 系列 第 25 篇

技術 Day 25 Mitigation Strategies - Throttling and Debouncing

今天要來介紹兩種讓app可以比較穩定運行的技術。 Throttling Throttling是為函數設定一個限流器，確保應用程式在一定時間內不會處理過多事情，避...

linitachi ‧ 2024-10-09 ‧團隊震驚 2.0
1 Like 0 留言 2463 瀏覽
鐵人賽 Python DAY 23
從概念到應用：Python實戰開發學習之旅 系列 第 23 篇

技術 [Day22] Python專案 - 網頁開發 - (1) 網頁工程師基本知識(設計網站的架構、套件管理、資料庫、API測試工具)

目標 專案實戰想把網站開發跟PowerBI交換一下目的是先讓大家在前面的爬蟲章節提到的HTTP跟前後端架構去加深熟悉起來 這周的開端是以網頁開發為主網頁工程師...

roni ‧ 2024-10-07
0 Like 0 留言 287 瀏覽
鐵人賽 Modern Web DAY 24
Backend Developer的學習Roadmap 系列 第 24 篇

技術 Day 24 Microservices vs Monolithic architecture

今天我們要來介紹Monolithic與Microservices的差別，在這個很多東西都上雲的時代，我們也是要來了解一下Monolithic代表著甚麼? Mon...

linitachi ‧ 2024-10-08 ‧團隊震驚 2.0
0 Like 0 留言 629 瀏覽
鐵人賽 Modern Web DAY 22
創意前端設計：用 Vue.js 打造 30 個互動實用功能 系列 第 22 篇

技術 Day22 Vue.js 動效分類實戰 (13) 極致表單特輯 - 掌控每次提交的反饋魔力

高效的表單處理與動效反饋設計 你是否曾經在填寫表單時，感覺整個過程有些枯燥乏味？或是點擊「提交」後遲遲沒有回應，讓人懷疑到底有沒有成功送出？ 其實，表單不僅...

Sunny.Cat ‧ 2024-10-06
0 Like 0 留言 359 瀏覽
鐵人賽 Modern Web DAY 23
Backend Developer的學習Roadmap 系列 第 23 篇

技術 Day 23 CAP Theorem

今天我們要來介紹分散式系統中的一個基本概念，有三個重要特性，但我們只能同時滿足其中兩個。其中一個必定會被犧牲。來看一下為什麼吧~ 一致性(Consistency...

linitachi ‧ 2024-10-07 ‧團隊震驚 2.0
0 Like 0 留言 282 瀏覽
鐵人賽 Modern Web DAY 21
創意前端設計：用 Vue.js 打造 30 個互動實用功能 系列 第 21 篇

技術 Day21 Vue.js 動效分類實戰 (12) 狂野動物幻燈片特輯 - 自訂 Slider，滑出不一樣的驚豔視覺！

體驗 Vue.js + CSS 動效的極致奢華，讓你的圖片展示與互動感十足！ 今天，我們要一起進入一個充滿生機與趣味的世界，用 Vue.js 和 CSS 為...

Sunny.Cat ‧ 2024-10-05
0 Like 0 留言 196 瀏覽
鐵人賽 Modern Web DAY 22
Backend Developer的學習Roadmap 系列 第 22 篇

技術 Day 22 DB - Failure Modes

今天要來介紹DB有可能發生錯誤的地方以及狀況。 讀取爭用（Read Contention） 當多個client端或process同時嘗試從資料庫的同一位置讀取資...

linitachi ‧ 2024-10-06 ‧團隊震驚 2.0
1 Like 0 留言 862 瀏覽
鐵人賽 Modern Web DAY 19
創意前端設計：用 Vue.js 打造 30 個互動實用功能 系列 第 19 篇

技術 Day19 Vue.js 動效分類實戰 (11) 進階背景特輯 - 用 GSAP 打造你的專屬海洋世界

結合動態背景與滾動效果，打造前所未有的海洋深處互動體驗 在這個數位時代，誰說網頁設計只能是靜態的？想像一下你的頁面不再只是一片白板，而是變成了一個充滿生命力...

Sunny.Cat ‧ 2024-10-03
iThome鐵人賽
iThome鐵人賽
參賽組數
902 組
團體組數
37 組
累計文章數
8241 篇
完賽人數
92 人
iT+看影片追技術 看影片追技術 看更多
熱門tag 看更多
15th鐵人賽 16th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽 鐵人賽 2019鐵人賽 17th鐵人賽 javascript 2018鐵人賽 python 2017鐵人賽 windows php c# windows server linux css react
熱門問題
熱門回答
熱門文章
IT邦幫忙