鐵人檔案
這次的參賽是為了寫讓自己更多學習 react 更多更好的寫法，會從 Javascript 和 React 好的寫法開始，加上許多好用的 CSS 套件使用，並在模...
對於程式碼的風格，不管是初學者或是有經驗的開發者，當一個專案執行時，在規劃程式碼的寫法，若沒有考慮到程式碼的可讀性和可維護性，在若干天後或是當別人接手程式時，需...
在 react 的命名原則中，除了 component 和 type 是 Pascal Case，其他大部分會多以 Camel Case 為主，當然有些例外譬如...
在 function 的命名上時常犯的錯會以過度簡單的命名，造成無法理解該 function 做的事 function - 通常以動詞 + 名詞組成 BAD...
在 react 當中有提供了不同的 css 方法,除了常見的 css in css 外, 另外現在前端主流使用的 style system, css in js...
在經歷了傳統 CSS 後，發現了一些 CSS 的缺點 全域污染 - CSS class name 會全域會覆蓋,譬如有個叫 card 的 classnam...
在上一篇我們介紹的 CSS in JS, 那這次我們來使用 CSS in JS 的框架 emotion, 目前 css in js 主流的框架大概有 css m...
使用 react 作法 npm i @emotion/react import { css, jsx } from '@emotion/react' con...
使用 styled 方式 這個方式其實是 emotion 參考 styled-component, 寫法是 `styled.` 任一 html ele...
在前面章節我們介紹過 純 CSS, CSS in JS 那接下來我們要來介紹 utility CSS。什麼是 utility CSS 就如其意思,他是以功能為優...
