鐵人檔案
《30天技能樹養成：開啟前端冒險秘境》是一場從零開始的程式旅程~
我們把學習想像成探索秘境，每一天就是點亮技能樹的一個節點。從 HTML 打下基礎、CSS 建立美感，到 JavaScript 賦予互動，再逐步觸碰框架，透過循序漸進的任務，不只是在背語法，而是親手打造屬於自己的冒險裝備。30天後，從中磨練屬於新手冒險者的第一把「程式之劍」。這趟旅程不求速成，而是讓學習變得具體、有趣，藉由一步步打怪升級，進入前端的奇幻世界。
HTML（Hypertext Markup Language）--「超文本標記語言」，它是構建網頁的基礎，定義了網頁的結構，主要是在告訴瀏覽器這段文字是什麼東西...
Day02. HTML 文字標籤大集合：讓文字不只是文字 昨天我們蓋好了 HTML 的基本「骨架」，今天我們要在這棟房子裡擺放第一批家具——文字標籤。 說實話，...
昨天我們複習了各種文字標籤，讓一個單純的 HTML 頁面變得更有「層次感」。但老實說，一個只有文字的網站，確實有點單調。想像一下，如果遊戲裡只有文字敘述，沒有角...
昨天我們學了圖片與多媒體，網站開始豐富起來了。但如果你現在打開一個只有 HTML 的網頁，它長什麼樣？──純文字、圖片堆疊在一起，白底黑字，毫無設計感｡ﾟヽ(ﾟ...
昨天我們用 CSS 把網頁裝扮得漂漂亮亮，但它依然只是「漫畫」——好看，但還是會讓人有想把它變更生動的想法。今天，終於要迎來前端的第三巨頭：JavaScript...
昨天，我們讓網頁「活了起來」──讓它會對使用者的點擊做出回應、能改變畫面顏色。但 JS 的世界遠不止如此，今天，我們要更深入學習如何用「邏輯」控制網頁，讓它不只...
昨天我們讓網頁開始有「記憶」，會依使用者行為做出反應。今天，我們要走得更進一步：不只回應，還能操控整個網頁內容、並驗證使用者輸入是否正確~。 DOM 是什麼？...
昨天我們學會用 DOM 操控網頁、驗證表單，體驗到「用程式和使用者對話」的感覺~今天，我們要往「更專業的前端開發」邁進，--元件化思維（Component Th...
昨天我們在 JS 的世界裡與 DOM 奮戰太燒腦了，今天稍微「退一步」，回到 HTML & CSS，專注在元件 (Component) 的設計。 如果說...
昨天我們談到按鈕元件，今天來做另一個常見的元件：卡片 (Card)。卡片是網站裡最常用的資訊展示方式，如：商品列表、部落格文章、會員資料等，甚至活動宣傳展示。一...
