❤️ 🍰 🌹 🎬 🚴♀️ 🏋️♀️ 💻 🚀 💜
這裡記錄了我的學習和開發筆記，歡迎交流 (*´∀`)~♥
© 2024. All rights reserved.
本文主要由此投影片「Start your app the better way with Styled System」之講稿改寫。本文會從 CSS 歷史開始談起，接著會來看過去我們在使用元件庫上遇到的問題，以及怎麼使用 Styled System 來解決這些問題。
February 25, 2020 styled-system styled-components CSS Modules CSS in JS BEM css End-to-End Testing 端對端測試 Media Query Modern Web Loading Performance Responsive Web Design react.js webpack 自動化測試 響應式網頁 加載效能 sharing · 留言
利用 Styled System 建立一個更好的 UI 元件庫！
November 30, 2019 styled-system styled-components CSS Modules CSS in JS OOCSS BEM SMACSS css Bootstrap Critical Rendering Path End-to-End Testing 端對端測試 Loading Performance Media Query Modern Web Rendering Performance Responsive Web Design react.js webpack 加載效能 效能調校 自動化測試 轉譯效能 關鍵轉譯路徑 響應式網頁 sharing 趨勢科技 Trend Micro · 留言
樣式管理一直是前端工程師的痛點（很煩 (╯‵□′)╯︵┴─┴），因此 CSS 的模組化方法從過去的 OOCSS、SMACSS，到近代的 BEM，還有最近的 CSS Modules 與 CSS in JS，企圖讓程式碼簡潔易懂、可重用，進而有效率地開發和維護。這裡記錄我的玩具「吃什麼，どっち」使用 CSS Modules 之 babel-plugin-react-css-modules 的實作過程。
August 14, 2018 CSS Modules CSS in JS styled-components babel react.js BEM css webpack Media Query 吃什麼 · 留言
PostCSS 是一個使用 JavaScript 轉換 CSS 的工具，它可以做的事情很多，像是加入各家瀏覽器的前綴詞（prefix）、將先進的功能轉為目前主流瀏覽器所能支援的語法、語法檢查和報錯、支援 Grid System、使用類似 SASS 的功能等。
August 10, 2018 PostCSS css webpack · 留言
babel-register 無法正確讀取 CSS 相關檔案的解法。
January 3, 2017 webpack babel · 留言