Contents
建構 10 個實戰專案時 – 使用 CSS Grid 和 Flexbox 建立現代 Web 佈局，包括 SASS 和 CSS 過場( Transitions )
從這 12 小時的課程，你會學到
- 學習 Flexbox 和 CSS Grid 以建立令人驚嘆的/響應式 Web 佈局
- CSS Grid 和 Flexbox 是 Web 佈局的現在和未來，你將於課程中掌握它們
- 你還將學習如何在設計中實現 SASS、Gulp、JavaScript ES6 和其他工具
- 我們正在建構幾個範例，每個範例都會有所不同，因此你可以掌握這些工具
要求
- 如果你已經編寫了一些 HTML 和 CSS 的網站，並且你想學習 Flexbox 或 Grid，那麼這門課程適合你
- 如果你有使用基於浮動的佈局( float based layouts )的經驗並想學習網格( Grid )或 Flexbox，那麼本課程適合你
- 我們需要安裝一些工具：文字編輯器( VS Code )、Chrome 和 Firefox Developer Edition
課程說明
CSS Grid 和 Flexbox 是 Web 佈局的現在和未來。
在本課程中，你將學習兩種技術，我們正在建構幾個範例，包括 AirBNB 克隆、Udemy 和 Netflix 登入頁面，以及其他幾個專案（可以免費觀看視訊，你可以在其中檢視所有專案）
我們將從 Flexbox 開始，這是一種用於建構一維佈局的優秀技術，使用 Flexbox，你可以非常輕鬆地建立響應式網站，你將學習 Flexbox 的基礎知識，從 flex container、flex direction、flex wrap、flex flow 和其他。
然後我們將使用 Flexbox 建構一些專案，以便你可以更輕鬆地瞭解它的功能。
此外，我們將把 Flexbox 跟一些不錯的工具做整合，工具如 SASS、NPM、Gulp 以及一些帶有轉場( Transitions )和自訂屬性的進階 CSS。
然後我們將進入 CSS Grid 又名 GRID 或 CSS 網格佈局( Grid layout )，這是在 CSS 中原生建立 Web 佈局的最先進方式，使用 CSS Grid，你可以輕鬆建立更高階/響應式佈局，不再需要框架！ 我們將使用 CSS Grid 建構幾個範例，以及網站 AirBNB 的克隆，以及你可以為你的客戶或個人使用的其他專案！
目標受眾
- 希望學習 CSS Grid 和 Flexbox 以建立現代 Web 佈局的 Web 設計人員和開發人員
- 任何具有任何框架(如 Bootstrap 或 Foundation )經驗的 Web 開發人員都可以參加本課程
講師簡介
Juan Pablo De la torre Valdez 自由網頁開發人員和 Easy-WebDev 創辦人
我叫 Juan Pablo De la torre Valdez，我來自瓜達拉哈拉。墨西哥。 在過去的 10 年裡，我一直在使用網路，我在現代 Web 技術方面擁有豐富的經驗，如 Foundation、Bootstrap、RWD、WordPress、Drupal、PHP、JavaScript 和 jQuery、HTML5、CSS3、SASS 和 Photoshop。 我創辦了一家名為 CreativaWeb 的公司，在那裡我設計和開發基於 WordPress 的網站。 我非常喜歡設計和開發網站，近年來我為我所在的城市、全國和其他國家的政府、大學、新創公司和中型公司製作了數百個網站。
英文字幕：有
- 想要了解如何將英文字幕自動翻譯成中文? 請參考這篇 How-To
