50 天 50 個專案 – HTML, CSS & JavaScript

通過建立 50 個快速、獨特和有趣的小專案來提高你的技能

報名參加課程

已經上過這門課程?

🔥歡迎來參加這個活動 – 上課心得分享與獎勵說明 :分享就贈送一門線上課程

從這 18 小時的課程,你會學到

  • 基於專案的教學,提高你的 HTML,CSS 和 JavaScript 技能
  • 對找尋教材的初學者來說是完美的好東西,在短時間內建立獨特的專案
  • 用 flexbox、CSS 動畫、自訂屬性等創造現代風格
  • DOM 操作、事件、陣列方法、HTTP 請求等等

要求

對 HTML、CSS 和 JavaScript 有非常基本的理解

課程說明

這是一個純粹的基於專案的課程。它為初學者設計,但是中級開發人員也可以享受創造新東西的樂趣。本課程包括 50 個與 DOM (文件物件模型)相關的 HTML、 CSS 和 JavaScript 的小專案。以下是我們將在本課程中建立的內容列表:

  1. 擴充的卡片( Expanding Cards )
  2. 進展步驟( Progress Steps )
  3. 旋轉導航動畫( Rotating Navigation Animation )
  4. 隱藏的搜尋小工具( Hidden Search Widget )
  5. 模糊載入( Blurry Loading)
  6. 滾動動畫( Scroll Animation )
  7. 分離登陸頁面( Split Landing Page )
  8. 形式波( Form Wave )
  9. 音效板( Sound Board )
  10. 爸爸的笑話( Dad Jokes )
  11. 事件關鍵程式碼( Event Keycodes )
  12. 常見問題縮編( Faq Collapse )
  13. 隨機選擇挑選器( Random Choice Picker )
  14. 動畫導航( Animated Navigation )
  15. 遞增計數器( Incrementing Counter )
  16. 飲用水( Drink Water )
  17. 電影應用程式( Movie App )
  18. 背景滑塊( Background Slider )
  19. 主題時鐘( Theme Clock )
  20. 按鈕漣漪效應( Button Ripple Effect )
  21. 拖與放( Drag N Drop )
  22. 繪圖應用程式( Drawing App )
  23. 動力裝載機( Kinetic Loader )
  24. 內容的替代字符( Content Placeholder )
  25. 黏著的導航條( Sticky Navbar )
  26. 雙垂直滑塊( Double Vertical Slider )
  27. 烤麵包通知( Toast Notification )
  28. Github Profiles
  29. 雙點擊的心( Double Click Heart )
  30. 自動文字效果( Auto Text Effect )
  31. 密碼生成器( Password Generator )
  32. 好又便宜且快( Good Cheap Fast )
  33. 筆記應用程式( Notes App )
  34. 動畫倒計時( Animated Countdown )
  35. 影像輪播 ( Image Carousel )
  36. 懸浮滑板( Hoverboard )
  37. Pokedex
  38. 行動標籤導航( Mobile Tab Navigation )
  39. 密碼強度背景( Password Strength Background )
  40. 3d 背景框( 3d Background Boxes )
  41. 驗證帳戶使用者介面( Verify Account UI )
  42. 即時使用者過濾器( Live User Filter )
  43. 反饋使用者介面設計( Feedback UI Design )
  44. 自訂範圍滑塊( Custom Range Slider )
  45. Netflix 行動導航( Netflix Mobile Navigation )
  46. 測試應用程式( Quiz App )
  47. 證言框切換器( Testimonial Box Switcher )
  48. 隨機影像饋送( Random Image Feed )
  49. 待辦事項清單( Todo List )
  50. 捕捉昆蟲的遊戲( Insect Catch Game )

目標受眾

想要用 HTML、CSS 和 JavaScript 建立有趣、獨特專案的初學者和中級 Web 開發者

講師簡介

Brad Traversy 全端 Web 開發人員 & Traversy Media 講師 ( 更多講師主講課程介紹 )

Brad Traversy 已經從事程式設計工作 12 年,教學工作近 5 年。 他是 Traversy Media 的所有者,這是一個成功的網路開發 YouTube 頻道,專注於從 HTML5 到像 Angular 這樣的前端框架以及像 Node.js、 PHP 和 Python 這樣的伺服器端技術。 Brad 已經掌握了用簡單的方式解釋非常複雜的話題,這是非常容易理解的。 通過觀看Brad 的課程來投資你的知識。

Florin Pop Web 開發者、 YouTuber 和 Streamer 更多講師主講課程介紹 )

我是一個專門從事前端開發的 Web 開發人員。我還有一個 YouTube 頻道,在那裡我教授程式設計,我經常在 Twitch 上串流不同的程式設計挑戰。我喜歡程式設計,也喜歡幫助別人成為更好的開發人員。你也可以經常在 Twitter 上看到我分享我的旅程。

英文字幕:有

  • 想要了解如何將英文字幕自動翻譯成中文? 請參考這篇 How-To

報名參加課程

Sponsored by Udemy

也許你會有興趣

Soft & Share 網站加值服務

找線上課程?試看看 Soft & Share 網站搜尋引擎

✍ 搜尋結果太多?可參考 Soft & Share 搜尋引擎使用技巧


幫我們個小忙!

使用 e-mail 追蹤 Soft & Share

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料

Powered by WordPress.com.

Up ↑

%d 位部落客按了讚: