• 課程時長

    6 小時 21 分

  • 課程級別

    中級

  • 授課語言

    中文

這堂課你將會學到

  • HTML、CSS、JavaScript 網頁前端設計
  • 學會兩種 web 框架 Django & Flask 的運作流程與設計⽅法
  • 用Flask實作微型MVC網頁框架
  • 以 Django 為例熟悉 MVC 網⾴架構觀念與實作
  • 資料庫設計與資料存取
  • 前端與後台整合
  • 網頁後台設計
  • 網頁資料庫串接
  • Django 整合 Bootstrap 網頁立馬變美
  • 獨立完成一個屬於自己的部落格
  • 理解即時聊天系統原理並進行實作

章節目錄

  • 1

    第 1 章 開始之前

    • 單元 1 - 範例下載

    • 單元 2 - Animate CC 前後今生

    • 單元 3 - 版面配置

    • 單元 4 - 基本界面介紹

  • 2

    第 2 章 Animate CC 基礎功能實作

    • 單元 1 - 影片片段 - 1

    • 單元 2 - 影片片段 - 2

    • 單元 3 - 元件特性

    • 單元 4 - 補間動畫 - 1

    • 單元 5 - 補間動畫 - 2

    • 單元 6 - 中心點

    • 單元 7 - 按鈕元件

    • 單元 8 - 引導線

    • 單元 9 - 加減速

    • 單元 10 - 模糊

    • 單元 11 - 遮色片

    • 單元 12 - fx濾鏡

  • 3

    第 3 章 HTML5 Banner 動畫製作

    • 單元 1 - 汽車橫幅

    • 單元 2 - 文字抒寫

    • 單元 3 - 車頭燈閃光

    • 單元 4 - 車身反光

    • 單元 5 - logo閃光

    • 單元 6 - 潑墨效果

    • 單元 7 - 靜態Hover

    • 單元 8 - 遮色片組合

  • 4

    第 4 章 基礎語法入門

    • 單元 1 - 停止動畫

    • 單元 2 - 限制播放次數

    • 單元 3 - 控制動畫行為

    • 單元 4 - Event事件

    • 單元 5 - 滑鼠跟隨座標

    • 單元 6 - 滑鼠跟隨座標相容性處理

    • 單元 7 - 元件開關切換

    • 單元 8 - 圖片輪播

    • 單元 9 - 座標移動

    • 單元 10 - gotoAndPlay 與 gotoAndStop

  • 5

    第 5 章 Animate CC 整合 Web

    • 單元 1 - Animate CC 整合 Web

    • 單元 2 - 補充 - 1.0.0 的 BUG 修正

  • 6

    第 6 章 Google Ads 廣告

    • 單元 1 - Google Ads 廣告 - HTML5 素材設定

    • 單元 2 - Google Ads 廣告 - HTML5 素材檢測

    • 單元 3 - 新版Animate CC轉出與Google提供的Createjs版本問題

  • 7

    第 7 章 專案應用 Application

    • 單元 1 - 遮色片捲動網頁 - 動畫

    • 單元 2 - 遮色片捲動網頁 - 整合

    • 單元 3 - 遮色片捲動網頁 - 控制卷軸

    • 單元 4 - 骰子開獎 - 動畫

    • 單元 5 - 骰子開獎 - 整合製作

    • 單元 6 - 打地鼠遊戲 - 動畫 1

    • 單元 7 - 打地鼠遊戲 - 動畫 2

    • 單元 8 - 打地鼠遊戲 - 動畫 3

    • 單元 9 - 打地鼠遊戲 - 整合

    • 單元 10 - 打地鼠遊戲 - 程式 1

    • 單元 11 - 打地鼠遊戲 - 程式 2

    • 單元 12 - 打地鼠遊戲 - 程式 3

  • 8

    第 8 章 Animate CC 與 前端框架 Vuejs 整合

    • 單元 1 - Animate 整合 Vue

  • 9

    第 9 章 最後的最後

    • 單元 1 - 課堂總結

  • 10

    第 10 章 課後直播補充 (附贈) - 其他HTML5 製作方案

    • 單元 1 - 從閃光到動畫! HTML5 Canvas 動畫超入門

    • 單元 2 - Createjs - HTML5 Canvas 遊戲開發超入門 #1

    • 單元 3 - PixiJS v4 - 官方教學導讀 超入門

    • 單元 4 - Phaser.js - HTML5 Canvas 遊戲開發超入門 #2