升級前端技術從 Tailwind CSS 開始

不管你是前端或後端工程師，在維護網站時總是會因為 CSS class 命名而經常搞混、還有 CSS 父層與子層選取的問題，經常讓接手的開發者相當頭痛，因為這些問題誕生了 Tailwind CSS ，他試圖要解決 CSS 維護的困難，讓工程師可以更專注在開發上，同時在 2021/11 月份發佈的 Tailwind CSS v3.0 版本中更是支援更多 CSS 樣式。

像是擴充更多色票、 Just-in-Time (讓開發時直接 Build 你有用到的 class)、左右滑動 (Scroll snap API)、更自由的 shadow 樣式等(更多 v3.0 更新內容請參考官方文件說明) 

想要入手 Tailwind CSS 到你的專案嗎？ 👀

又或是你有遇到以下情境嗎？

• 接手專案時發現要修改 CSS 樣式時，因為上面包太多層，所以不得已下了很多 important 🧨 

• 肥大的 CSS 樣式管理專案，改不動只好再寫一樣的 CSS 樣式 🧨 

• 使用 Vue.js 或 React 前端框架開發客製化網站，但又希望可以好維護。

• 有接觸過 Tailwind CSS 但對於 CLI 、Webpack 整合還不熟悉，想要導入在現有的專案，但又不知道如何開始 😩

• 想知道 Tailwind CSS v3.0 升級了哪些功能？

• 之前只用過 Bootstrap 用 CDN 引入 CSS framework ，換到 Tailwind CSS 不知到如何開始。

這些，情境都可以在這堂課來聽奶綠茶老師分享，一起開始你的 Tailwind CSS 開發之旅！

🛎 課程提醒，上課之前你需要具備：

• HTML/CSS 網頁架構與知識：

  • 知道 HTML 網頁架構

  • CSS 開發能力，能清楚的知道 flex 的屬性。

  • 如果你尚未有這些知識，歡迎參考：

    • 我們的課程：網頁前端設計女性專班

    • 線上資源：學習該如何開發 Web 入門

  • 如何評估自己是否適合這麼課？

    • 在不使用任何 CSS framework 下，能手刻以下頁面(含 RWD)

    • Album example | Bootstrap

• JavaScript 基礎觀念：

  • 課程會用到一些簡單的 JavaScript

  • 如果想要學 JavaScript 歡迎參考：

    • 我們的課程： JavaScript / jQuery 前端開發入門實戰

    • 書籍與線上資源：0 陷阱！0 誤解！8 天重新認識 JavaScript 、JavaScript 指南 | MDN 文件