Tailwind

• Tailwind, and the death of web craftsmanship

  While Tailwind may help with initial development speed, it can reduce craftsmanship and make code harder to work with over time.

• Utility First, Component Second
  • 유틸리티 우선 방법론은 컴포넌트 구성 시점을 늦춤으로써, 개발자가 유틸리티로 빠르게 시작하고 중복이 보일 때 컴포넌트를 만드는 '시점'의 문제로 전환했습니다.
  • 유틸리티 우선 방법론에서 'First'는 유틸리티 중시뿐만 아니라, 컴포넌트 구성 시점을 늦추는 관점을 도입하여 CSS 아키텍처의 난제를 해결하는 데 기여했습니다.

---

Dynamic class names

class = `bg-${ zero ? pageColor : baseColor}` // not work
class = zero ? `bg-${pageColor}` : `bg-${baseColor}` // not work

Unknown at rule @apply css(unknownAtRules)

use lang="postcss" #

webpack css loader에 추가

exports.cssLoaders = function (options) {
  return {
    postcss: generateLoaders("sass"), // // https://vue-loader.vuejs.org/en/configurations/extract-css.html
  }
}

tints.dev - Palette Generator + API for Tailwind CSS

---

Children

1. Tailwind’s @apply Feature is Better Than it Sounds
2. tailwind-is-an-anti-pattern