Taker Wu – is 網頁基礎15天你的課程導師Taker Wu8 年 Senior 網頁工程師經驗，參與過公司接案、個人接案、產品設計、產品開發。屬於「淺顯易懂」的講課風格，並快速建立完整的「觀念」 內容方面，提供業界真正有用的資訊與方法。我們希望大家在課程後，真的可以應用、求職、工作、開發產品，而不只是一個「興趣」。希望可以幫助大家就業、轉職、能力提升、做產品、創業等，都能有所幫助。課程內容Intro / 課程使用手冊課程使用建議 (4:49)如何發問？ (7:00)加入「學員討論區」社團Medium / 紀錄學習歷程Day 1 / HTML + CSS 基礎【HTML 講義下載】HTML tags（標籤） (15:29)HTML 的「命名」與「架構」 (16:39)【CSS 講義下載】CSS selector（選擇器） (19:14)CSS 屬性./ 排版 / display & position (21:30)CSS 屬性 / 排版 / float (5:02)CSS 屬性 / 細節 / box model (10:08)CSS 屬性 / 細節 / background (7:59)CSS 屬性 / 細節 / font & others (8:45)CSS specificity / CSS 權重 (7:43)Day 2 之前 / IDE【更新內容】Intro什麼是 IDE？ (7:10)IDE 介面解說 (13:41)安裝 VS code 外掛 (extension) (5:40)美化自己的 VS code (7:33)Coding 小技巧 (16:04)「autocomplete」自動幫你寫好多程式碼 (13:39)在 VS code 裡面做 git 版本控制 (12:50) Day 2 / HTML 實戰IDE / 寫程式的文字編輯器 (deprecated) (22:40)Wireframe / 輕鬆分析網頁結構 (23:40)【HTML 練習 / 檔案下載】建立 HTML 架構 (7:36)假資料 / 測量 / navigation（導覽列） (12:01)Hero section 與 產品分類 / HTML Special Characters (8:05)最新產品 / 假資料 (5:38)CTA / events & featured 段落 (8:40)Outlets 段落 / 可以撥打的電話號碼 (7:51)Footer / 回到頂端 (4:46)HTML 練習回顧 / 課後練習 (6:06)Day 3 / CSS 實戰【CSS 練習 #1 / 檔案下載】加入 CSS 檔案 (12:15)Container / 水平置中 #1 (6:08)Navigation / 圖片的問題 / 垂直置中 (17:27)clearfix (8:24)Hero section & 產品分類 / Grid 的概念 (22:45)最新產品 / 細節調整 (21:33)最新產品 / 覆蓋文字 (18:30)【CSS 練習 #2 / 檔案下載】event 段落 / background-image / 細節調整 (14:32)featured 段落 (15:39)featured 段落 / margin collapse (10:09)outlets 段落 (6:54)footer / 水平置中 #2 (15:50)go top 回到頂端 (4:50)CSS 回顧 (2:39)Day 4 / 其他有的沒的但很重要的技術【檔案下載 #1】favicon (6:54)Web fonts / Google fonts (16:42)中文字型 (7:39)icon fonts (28:46)Font Awesome 更新 / 補充教材 (12:10)Sprites 小圖示大集合 (15:04)【LESS CSS / 檔案下載】LESS CSS (28:48)使用 LESS 改寫 (16:34)CSS 的單位 (23:06)【Table & Form / 檔案下載】Table (3:27)Form (17:06)Form 與後端的溝通 / name value pair (11:40)Day 5 / About 頁面 / 實戰【練習 / 檔案下載】Wireframe 分析 (6:29)HTML 架構 (29:13)CSS / header (17:20)CSS / welcome message (12:35)CSS / progress bar / CSS arrow (12:02)CSS / feature 段落 / LESS 架構調整 (8:33)CSS / feature 段落 / team 段落 (18:15)CSS / counting 段落 / Clients 段落 (9:48)CSS / footer (17:13)CSS / 最後調整 / background 與 icon fonts (25:06)Day 6 / Service 頁面 / Contact Us 頁面 / 實戰【練習 / 檔案下載】Service / HTML (19:17)Service / header (6:39)Service / services (12:36)Service / features (7:48)Service / special services (21:31)Service / pricing table (24:41)Service / special offer (11:06)Contact Us / HTML (19:26)Contact Us / CSS (23:31)課程回饋回饋量表Day 7 / RWD 手機版網頁 / 概念【RWD design pattern / 講義下載】RWD vs AWD (6:23)設計模式 / design patterns #1 / 常見的組合 (19:40)設計模式 / design patterns #2 / 特殊的畫面 (4:53)製作模式 / mobile first (6:26)breakpoints (10:05)設計模式 / RWD navigations (4:46)【RWD 技術 / 講義下載】RWD 技術 / media query / viewport (13:29)RWD 技術 / CSS (13:28)RWD 技術 / CSS 權重 (6:16)Day 8 / RWD 手機版網頁 / 練習【練習 / 檔案下載】Inspect element 的手機版測試工具 (5:48)fluid 練習 (8:10)column drop 練習 (13:44)sidebar drop 練習 (9:18)scale + column drop 練習 (9:20)可以直接使用的 off canvas plugins (6:49)off canvas 實作 (24:43)tiny tweaks (30:24)mobile first 練習 (18:34)Day 9 / Bootstrap 3 / layouts / 導讀 / 實戰【Bootstrap 3 / 講義下載】Grid 網格系統（核心概念） (20:32)Nav 導覽列 / Table / List (9:46)Form 表單優化 (8:52)Buttons 按鈕 (14:44)Dropdown 下拉式選單 (9:30)有的沒的 / icons / typographic / breadcrumbs / label & badges / pagination / panel / progress bar (16:44)Helper class (8:51)【實戰 / 檔案下載】HTML 實戰 / 初始設定 (2:15)HTML 實戰 / navigation (4:50)HTML 實戰 / header / we cover the maximum (12:31)HTML 實戰 / services we provide / other services (12:32)HTML 實戰 / special services / why you choose our service / client speak for us (10:30)HTML 實戰 / footer (11:04)Day 10 / Bootstrap 3 / CSS 調整 / 實戰【實戰 / 檔案下載】初始設定 (1:44)navigation (8:32)header (13:57)we cover the maximum (8:14)services we provide (9:04)other services (12:31)special services (12:36)why us (18:52)footer (20:01)footer bottom (13:30)CSS 回顧 (2:14)Bootstrap customize ( Bootstrap 3 only ) (14:33)Day 11 / Bootstrap 3 / Components / 實用小工具 / 導讀【講義下載】Carousel (21:06)Tab (13:55)Modal (24:09)Alert (5:25)Tooltips (10:13)Popover (7:29)Scrollspy (12:09)Affix (15:05)Before Day 12 / 課程之前 / 先學 Javascript 基礎【講義下載】程式的基礎：expressions 與 statements (8:50)Operators 運算元 (6:01)Variable / Type (6:12)Block / Conditions / Loops (7:32)Function / 請電腦幫你做的待辦清單 (10:28)Object / Array (6:51)Javascript 基礎 / 延伸閱讀Day 12 / jQuery / 基礎【jQuery events / 講義下載】jQuery 基礎寫法 / css / animate (17:04)jQuery events / mouse 相關事件 (15:09)jQuery events / keyboard 相關事件 (5:49)jQuery events / form 相關事件 (5:54)jQuery events / document.ready / on / off (7:56)jQuery events / fire (4:25)【jQuery traversing & DOM manipulate / 講義下載】jQuery traversing / 樹狀結構 / 尋找節點 / 爬樹 (19:46)jQuery DOM manipulate / append / prepend / before / after (6:56)jQuery DOM manipulate / html (2:29)jQuery DOM manipulate / remove / empty / clone (3:54)jQuery DOM manipulate / addClass / removeClass / toggleClass (1:56)jQuery DOM manipulate / css (2:59)jQuery DOM manipulate / prop / val (3:13)jQuery DOM manipulate / data (3:28)jQuery DOM manipulate / position / offset (6:49)Day 13 / jQuery / 實戰練習【實戰 #1 / 講義下載】go top 回到頂端 / 滾動效果 (22:27)hover 效果 (15:36)hover 顯示額外資訊 (10:31)滾動畫面 / 驅動 / 動畫效果 (16:49)【實戰 #2 / 講義下載】Tabs (14:45)Todo list (18:31)Todo list + Handlebars (18:05)Modal (7:34)Lightbox (10:05)Day 14 / AJAX / 前後端溝通的橋樑【AJAX 講義下載】AJAX 的原理 / API 的形式 (15:59)jQuery 的 AJAX 工具 / $.ajax / $.post / $.get (14:57)收到的資料型態 / HTML / JSON / JSONP (14:21)把資料寫入網頁 / data insertion (7:22)SPA / single page application / 準備工作 (7:33)SPA / single page application / 實作 (11:54)SPA / single page application / 修正 (8:49)Random User Generator / API 介紹 (4:23)Random User Generator / 實作 (13:19)Random User Generator / 一次顯示多位 User (8:01)Todo list / 前後端的準備 (2:33)Todo list / create API / AJAX call (12:36)Todo list / update API / AJAX call (9:59)Todo list / delete API / AJAX call (5:27)Day 15 / CSS 3 動畫 / 活動網站的神兵利器【transition & animate / 講義下載】transition 漸變 / animate 動畫效果 / 簡介 (5:18)transition / 練習 / 狀態改變的觀念 (13:03)transition / hover 效果 (1:43)transition / 狀態改變的漸變效果 (9:36)狀態改變的討論 / 編輯模式（無特效） (5:07)animation 基礎 (12:58)【transform / 講義下載】活動網站 / 架構 (7:43)活動網站 / 球的動態 (6:35)活動網站 / 移動的車子 (3:11)活動網站 / 亂數調整 (12:39)transform 變形 / translate 移動 (17:01)transform 變形 / rotate 旋轉 / scale 縮放 / skew 傾斜 (7:23)transform 變形 / transform 3D / Z 軸 (5:23)transform 變形 / transform origin / 變形起始點 (2:22)transform 變形 / 活動網站 / + transform 效果 (4:15)New Updates!!.
Taker Wu – 網頁基礎15天你的課程導師Taker Wu8 年 Senior 網頁工程師經驗，參與過公司接案、個人接案、產品設計、產品開發。屬於「淺顯易懂」的講課風格，並快速建立完整的「觀念」 內容方面，提供業界真正有用的資訊與方法。我們希望大家在課程後，真的可以應用、求職、工作、開發產品，而不只是一個「興趣」。希望可以幫助大家就業、轉職、能力提升、做產品、創業等，都能有所幫助。課程內容Intro / 課程使用手冊課程使用建議 (4:49)如何發問？ (7:00)加入「學員討論區」社團Medium / 紀錄學習歷程Day 1 / HTML + CSS 基礎【HTML 講義下載】HTML tags（標籤） (15:29)HTML 的「命名」與「架構」 (16:39)【CSS 講義下載】CSS selector（選擇器） (19:14)CSS 屬性./ 排版 / display & position (21:30)CSS 屬性 / 排版 / float (5:02)CSS 屬性 / 細節 / box model (10:08)CSS 屬性 / 細節 / background (7:59)CSS 屬性 / 細節 / font & others (8:45)CSS specificity / CSS 權重 (7:43)Day 2 之前 / IDE【更新內容】Intro什麼是 IDE？ (7:10)IDE 介面解說 (13:41)安裝 VS code 外掛 (extension) (5:40)美化自己的 VS code (7:33)Coding 小技巧 (16:04)「autocomplete」自動幫你寫好多程式碼 (13:39)在 VS code 裡面做 git 版本控制 (12:50) Day 2 / HTML 實戰IDE / 寫程式的文字編輯器 (deprecated) (22:40)Wireframe / 輕鬆分析網頁結構 (23:40)【HTML 練習 / 檔案下載】建立 HTML 架構 (7:36)假資料 / 測量 / navigation（導覽列） (12:01)Hero section 與 產品分類 / HTML Special Characters (8:05)最新產品 / 假資料 (5:38)CTA / events & featured 段落 (8:40)Outlets 段落 / 可以撥打的電話號碼 (7:51)Footer / 回到頂端 (4:46)HTML 練習回顧 / 課後練習 (6:06)Day 3 / CSS 實戰【CSS 練習 #1 / 檔案下載】加入 CSS 檔案 (12:15)Container / 水平置中 #1 (6:08)Navigation / 圖片的問題 / 垂直置中 (17:27)clearfix (8:24)Hero section & 產品分類 / Grid 的概念 (22:45)最新產品 / 細節調整 (21:33)最新產品 / 覆蓋文字 (18:30)【CSS 練習 #2 / 檔案下載】event 段落 / background-image / 細節調整 (14:32)featured 段落 (15:39)featured 段落 / margin collapse (10:09)outlets 段落 (6:54)footer / 水平置中 #2 (15:50)go top 回到頂端 (4:50)CSS 回顧 (2:39)Day 4 / 其他有的沒的但很重要的技術【檔案下載 #1】favicon (6:54)Web fonts / Google fonts (16:42)中文字型 (7:39)icon fonts (28:46)Font Awesome 更新 / 補充教材 (12:10)Sprites 小圖示大集合 (15:04)【LESS CSS / 檔案下載】LESS CSS (28:48)使用 LESS 改寫 (16:34)CSS 的單位 (23:06)【Table & Form / 檔案下載】Table (3:27)Form (17:06)Form 與後端的溝通 / name value pair (11:40)Day 5 / About 頁面 / 實戰【練習 / 檔案下載】Wireframe 分析 (6:29)HTML 架構 (29:13)CSS / header (17:20)CSS / welcome message (12:35)CSS / progress bar / CSS arrow (12:02)CSS / feature 段落 / LESS 架構調整 (8:33)CSS / feature 段落 / team 段落 (18:15)CSS / counting 段落 / Clients 段落 (9:48)CSS / footer (17:13)CSS / 最後調整 / background 與 icon fonts (25:06)Day 6 / Service 頁面 / Contact Us 頁面 / 實戰【練習 / 檔案下載】Service / HTML (19:17)Service / header (6:39)Service / services (12:36)Service / features (7:48)Service / special services (21:31)Service / pricing table (24:41)Service / special offer (11:06)Contact Us / HTML (19:26)Contact Us / CSS (23:31)課程回饋回饋量表Day 7 / RWD 手機版網頁 / 概念【RWD design pattern / 講義下載】RWD vs AWD (6:23)設計模式 / design patterns #1 / 常見的組合 (19:40)設計模式 / design patterns #2 / 特殊的畫面 (4:53)製作模式 / mobile first (6:26)breakpoints (10:05)設計模式 / RWD navigations (4:46)【RWD 技術 / 講義下載】RWD 技術 / media query / viewport (13:29)RWD 技術 / CSS (13:28)RWD 技術 / CSS 權重 (6:16)Day 8 / RWD 手機版網頁 / 練習【練習 / 檔案下載】Inspect element 的手機版測試工具 (5:48)fluid 練習 (8:10)column drop 練習 (13:44)sidebar drop 練習 (9:18)scale + column drop 練習 (9:20)可以直接使用的 off canvas plugins (6:49)off canvas 實作 (24:43)tiny tweaks (30:24)mobile first 練習 (18:34)Day 9 / Bootstrap 3 / layouts / 導讀 / 實戰【Bootstrap 3 / 講義下載】Grid 網格系統（核心概念） (20:32)Nav 導覽列 / Table / List (9:46)Form 表單優化 (8:52)Buttons 按鈕 (14:44)Dropdown 下拉式選單 (9:30)有的沒的 / icons / typographic / breadcrumbs / label & badges / pagination / panel / progress bar (16:44)Helper class (8:51)【實戰 / 檔案下載】HTML 實戰 / 初始設定 (2:15)HTML 實戰 / navigation (4:50)HTML 實戰 / header / we cover the maximum (12:31)HTML 實戰 / services we provide / other services (12:32)HTML 實戰 / special services / why you choose our service / client speak for us (10:30)HTML 實戰 / footer (11:04)Day 10 / Bootstrap 3 / CSS 調整 / 實戰【實戰 / 檔案下載】初始設定 (1:44)navigation (8:32)header (13:57)we cover the maximum (8:14)services we provide (9:04)other services (12:31)special services (12:36)why us (18:52)footer (20:01)footer bottom (13:30)CSS 回顧 (2:14)Bootstrap customize ( Bootstrap 3 only ) (14:33)Day 11 / Bootstrap 3 / Components / 實用小工具 / 導讀【講義下載】Carousel (21:06)Tab (13:55)Modal (24:09)Alert (5:25)Tooltips (10:13)Popover (7:29)Scrollspy (12:09)Affix (15:05)Before Day 12 / 課程之前 / 先學 Javascript 基礎【講義下載】程式的基礎：expressions 與 statements (8:50)Operators 運算元 (6:01)Variable / Type (6:12)Block / Conditions / Loops (7:32)Function / 請電腦幫你做的待辦清單 (10:28)Object / Array (6:51)Javascript 基礎 / 延伸閱讀Day 12 / jQuery / 基礎【jQuery events / 講義下載】jQuery 基礎寫法 / css / animate (17:04)jQuery events / mouse 相關事件 (15:09)jQuery events / keyboard 相關事件 (5:49)jQuery events / form 相關事件 (5:54)jQuery events / document.ready / on / off (7:56)jQuery events / fire (4:25)【jQuery traversing & DOM manipulate / 講義下載】jQuery traversing / 樹狀結構 / 尋找節點 / 爬樹 (19:46)jQuery DOM manipulate / append / prepend / before / after (6:56)jQuery DOM manipulate / html (2:29)jQuery DOM manipulate / remove / empty / clone (3:54)jQuery DOM manipulate / addClass / removeClass / toggleClass (1:56)jQuery DOM manipulate / css (2:59)jQuery DOM manipulate / prop / val (3:13)jQuery DOM manipulate / data (3:28)jQuery DOM manipulate / position / offset (6:49)Day 13 / jQuery / 實戰練習【實戰 #1 / 講義下載】go top 回到頂端 / 滾動效果 (22:27)hover 效果 (15:36)hover 顯示額外資訊 (10:31)滾動畫面 / 驅動 / 動畫效果 (16:49)【實戰 #2 / 講義下載】Tabs (14:45)Todo list (18:31)Todo list + Handlebars (18:05)Modal (7:34)Lightbox (10:05)Day 14 / AJAX / 前後端溝通的橋樑【AJAX 講義下載】AJAX 的原理 / API 的形式 (15:59)jQuery 的 AJAX 工具 / $.ajax / $.post / $.get (14:57)收到的資料型態 / HTML / JSON / JSONP (14:21)把資料寫入網頁 / data insertion (7:22)SPA / single page application / 準備工作 (7:33)SPA / single page application / 實作 (11:54)SPA / single page application / 修正 (8:49)Random User Generator / API 介紹 (4:23)Random User Generator / 實作 (13:19)Random User Generator / 一次顯示多位 User (8:01)Todo list / 前後端的準備 (2:33)Todo list / create API / AJAX call (12:36)Todo list / update API / AJAX call (9:59)Todo list / delete API / AJAX call (5:27)Day 15 / CSS 3 動畫 / 活動網站的神兵利器【transition & animate / 講義下載】transition 漸變 / animate 動畫效果 / 簡介 (5:18)transition / 練習 / 狀態改變的觀念 (13:03)transition / hover 效果 (1:43)transition / 狀態改變的漸變效果 (9:36)狀態改變的討論 / 編輯模式（無特效） (5:07)animation 基礎 (12:58)【transform / 講義下載】活動網站 / 架構 (7:43)活動網站 / 球的動態 (6:35)活動網站 / 移動的車子 (3:11)活動網站 / 亂數調整 (12:39)transform 變形 / translate 移動 (17:01)transform 變形 / rotate 旋轉 / scale 縮放 / skew 傾斜 (7:23)transform 變形 / transform 3D / Z 軸 (5:23)transform 變形 / transform origin / 變形起始點 (2:22)transform 變形 / 活動網站 / + transform 效果 (4:15)New Updates!!
/ 新增內容!!FlexboxBootstrap 4Next Step / 下一步延伸學習 / BonusSale Page: is https://bootcamp.15days.website/p/15days-fullArchive: https://web.archive.org/web/20201027035723/https://15days.website/join/15days Reviews There are no reviews yet.Be the first to review “Taker Wu – 網頁基礎15天” Cancel replyYour rating *Rate…PerfectGoodAverageNot that badVery poorYour review *Name *Email *Δ.
/ 新增內容!!FlexboxBootstrap 4Next Step / 下一步延伸學習 / BonusSale Page: https://bootcamp.15days.website/p/15days-fullArchive: https://web.archive.org/web/20201027035723/https://15days.website/join/15days Reviews There are no reviews yet.Be the first to review “Taker Wu – 網頁基礎15天” Cancel replyYour rating *Rate…PerfectGoodAverageNot that badVery poorYour review *Name *Email *Δ