自動播放
自動完成
前一章節
完成並繼續課程
全端初體驗
Intro / 課程使用說明
如何學習：提升學習效率 (9:48)
加入「學員討論區」社團
CH 1 / 什麼是產品開發
什麼是產品？什麼是 Web App？ (6:09)
產品開發需要的元素 (7:34)
CH 2 / Todo List 設計 / 練習
【Todo List / 講義 / 完成檔案 / 下載】
課程進行方式 (3:31)
功能與介面設計 (10:07)
CH 3 / 前端 / HTML
【前端 / 講義下載】
前後端運作方式 (2:07)
網頁架構 (4:26)
常見的標籤 / tag (10:35)
架構的命名 / id / class (12:18)
命名練習 (4:22)
CH 4 / 前端 / CSS
CSS 選擇器 / selector (15:07)
常見的 CSS 屬性 (19:56)
版面置中 / 練習 (8:16)
3 欄式架構 / 練習 (13:02)
控制寬度的魔法 / box-sizing (6:03)
CH 5 / 前端 / Javascript
程式的基礎：expressions 與 statements (8:50)
operators 運算元 (6:01)
值與它的型態 (6:12)
block / conditions / loops (7:32)
functions / 請電腦幫你做的待辦清單 (10:28)
object / array (6:51)
CH 6 / 前端 / jQuery
jQuery 簡介 (5:45)
events 事件的發生 (16:59)
traversing 爬樹 (8:41)
DOM manipulate 處理網頁元素 (18:23)
極簡版 todo list / 練習 (16:17)
event binding 做不到的事 / 練習 (6:05)
AJAX 的概念 (8:00)
CH 7 / Todo List 前端開發 / 實戰
【開始練習之前 / PHP 環境架設】
建立 HTML 架構 (16:27)
準備 CSS 檔案 / 包含 Bootstrap 設定 (11:14)
CSS / 版面置中 (4:33)
CSS / todo list 項目 (34:18)
CSS / todo list 完成狀態 (3:47)
準備 jQuery 檔案 (2:42)
jQuery / 製作功能 / create todo list (18:45)
使用 Handlebars js 建立 todo list 的模板 (25:10)
jQuery / 製作功能 / update todo list 的內容 (11:15)
jQuery / 區分 create 與 update 的機制 (8:06)
jQuery / 製作功能 / delete todo list (3:42)
jQuery / 製作功能 / 完成代辦事項 (5:34)
jQuery / 製作功能 / todo list 排序 (10:39)
CH 8 / MySQL / 資料庫基礎
【講義下載】
為什麼要用資料庫？ (5:21)
MySQL 架構簡介 (6:33)
keys / 資料的索引 (14:16)
練習 / 資料庫設計 (33:57)
data types / 儲存的資料型態 (6:45)
constraints / 資料的限制與約束 (8:01)
query / 如何下指令命令資料庫？ (33:13)
練習 / 對 MySQL 下指令 (22:02)
練習 / 使用 MySQL Workbench 同步資料庫 (12:08)
關於 phpMyAdmin (deprecated) (12:51)
使用 Sequel Pro 操作資料庫
CH 9 / Todo List / 資料庫 / 實戰
todo list 資料庫設計 (5:49)
同步 todo list 資料庫架構到 MySQL / 並設定權限 (9:06)
【資料庫設計 / 完成檔案 / 下載】
CH 10 / PHP 基礎
【講義下載】
【操作】安裝 MAMP
hello world (10:09)
跟 HTML 做好朋友 (5:47)
PHP 的變數與形態 (6:20)
conditions & loops (6:57)
array (18:18)
function (7:03)
object / class / instance (21:20)
web form / 如何取得使用者的資料 (11:26)
聯繫資料庫 (25:23)
cookies & sessions / 記住使用者 (19:21)
cURL / 與其他網站溝通 (3:50)
composer / PHP package 管理系統 (13:06)
CH 11 / Todo List 後端開發 / 實戰
PHP / 製作 / create todo list API (27:28)
AJAX / 串接 create API 與前端 (21:33)
網站架構安全性更新 (13:25)
PHP / 撈出所有的 todo list / 由 PHP 印出 (9:18)
撈出所有的 todo list / 由 Handlebars.js 印出 (15:53)
PHP + AJAX / 製作並串連 update API (9:36)
PHP + AJAX / 製作並串連 delete API (10:58)
PHP + AJAX / 製作並串連 complete API (12:46)
PHP + AJAX / 製作並串連 sorting API (18:58)
CH 12 / Calendar / 前端 / 實戰
【Calendar / 講義 / 完成檔案 / 下載】
開始之前的思考 (10:31)
HTML / 建立 calendar 基礎架構 (10:28)
CSS / 做出 calendar 雛形 (32:35)
HTML / 建立 panel 架構（在行事曆上，建立新事件的 UI） (14:21)
CSS / 刻出 panel 雛形 (17:03)
CSS / 按鈕的調整 (19:07)
jQuery / 開啟與關閉 panel (14:22)
jQuery / panel 開啟的位置，應該要在滑鼠旁邊 (5:52)
jQuery / panel 開啟後，自動進入表單元素 (auto focus) (2:47)
HTML + CSS / 製作行事曆上的 "事件" UI (7:23)
jQuery / panel 自動辨別 "新增" 與 "更新" 模式 (23:56)
jQuery / 自動更新 panel 上的日期 (11:11)
jQuery / 製作功能 / create event (18:30)
jQuery / 使用 template 來 create event (14:01)
思考 / create event 需要搭配的相關動作？ (6:20)
jQuery / 清除 panel 上的舊有資料 (9:07)
jQuery / 準備功能 / update event (3:47)
jQuery / 準備功能 / delete event (6:43)
CH 13 / Calendar / 後端 / 實戰
MySQL / 資料庫設計 / 製作 / 權限設定 (7:32)
PHP + AJAX / 製作 / create API (28:13)
PHP + AJAX / validation 資料驗證 (36:31)
jQuery / create event 插入的順序 (30:19)
PHP / 讀取所有的 events 傳到前端 (20:23)
PHP + AJAX / read event API (13:26)
PHP + AJAX / update event API (27:12)
PHP + AJAX / delete event API (6:25)
PHP / 行事曆的日期 (26:08)
課程最後
課程 feedback
技能樹開發 前端 (17:09)
技能樹開發 後端 (9:33)
技能樹開發 通用 (5:20)
控制寬度的魔法 / box-sizing
課程內容已上鎖
你已加入課程
你需要登入
.
加入課程以解鎖