# 시작하기

## 설치

```bash
composer require tailwindphp/tailwindphp
```

TailwindPHP에는 `ctype` 및 `mbstring` 확장 기능이 포함된 PHP 8.2 이상과 Composer가 필요합니다. 두 확장 기능은 대부분의 PHP 빌드 및 공식 Docker 이미지에 포함되어 있습니다. 아직 `composer.json`에는 나열되지 않았으므로([#11](https://github.com/inline0/tailwindphp/issues/11)), 확장 기능이 없는 빌드에서는 패키지가 설치된 뒤 런타임에 실패합니다. Node.js 의존성이나 빌드 단계가 필요 없으며, Docker 이미지나 CI에 npm도 필요하지 않습니다. `composer require`만 실행한 뒤 API를 호출하세요.

## 첫 CSS 생성하기

```php
<?php

require __DIR__ . '/vendor/autoload.php';

use TailwindPHP\tw;

$css = tw::generate('<div class="flex items-center p-4 bg-blue-500">Hello</div>');
```

`generate()`은 마크업을 스캔하고 발견한 클래스 이름을 추출한 뒤, 해당 클래스에 필요한 CSS만 출력합니다. 그 외에는 출력하지 않습니다. 두 번째 인수를 지정하지 않으면 테마, [Preflight](https://tailwindphp.inline0.dev/ko/docs/usage/imports), 유틸리티 레이어를 불러오는 기본 `@import "tailwindcss"`을 사용합니다.

## CSS 문자열로 맞춤 설정하기

입력 CSS 문자열을 두 번째 인수로 전달하면 `@theme` 변수, 사용자 정의 규칙 또는 지시문을 추가할 수 있습니다. 새로운 테마 값은 자동으로 유틸리티가 됩니다:

```php
use TailwindPHP\tw;

$css = tw::generate(
    '<div class="bg-brand p-4">Hello</div>',
    '@import "tailwindcss"; @theme { --color-brand: #3b82f6; }'
);
// .bg-brand now resolves to var(--color-brand)
```

사용 가능한 테마 네임스페이스 전체는 [테마](https://tailwindphp.inline0.dev/ko/docs/usage/theme)를 참조하세요.

## 배열 입력

한 줄을 넘는 내용에는 `content` 및 `css` 키가 있는 배열을 전달하세요. `@apply`로 컴포넌트를 정의하는 곳입니다:

```php
use TailwindPHP\tw;

$css = tw::generate([
    'content' => '<div class="flex p-4 btn">Hello</div>',
    'css' => '
        @import "tailwindcss";

        @theme {
            --color-brand: #3b82f6;
            --font-heading: "Inter", sans-serif;
        }

        .btn {
            @apply px-4 py-2 rounded-lg bg-brand text-white;
        }
    ',
]);
```

배열 형식은 `minify`, `importPaths`, `cache`, `cacheTtl`도 지원합니다. 입력 형식은 [사용법](https://tailwindphp.inline0.dev/ko/docs/usage)을, `@apply`, `@theme`, `@utility` 등을 포함한 지시문은 [지시문](https://tailwindphp.inline0.dev/ko/docs/usage/directives)을 참조하세요.

## 파일에 쓰기

`generate()`은 문자열을 반환하므로 스타일시트를 한 줄로 작성할 수 있습니다:

```php
use TailwindPHP\tw;

file_put_contents('dist/styles.css', tw::generate([
    'content' => file_get_contents('templates/page.html'),
    'css' => '@import "tailwindcss";',
]));
```

템플릿 디렉터리를 스캔하는 파일 기반 빌드와 감시 모드에는 [CLI](https://tailwindphp.inline0.dev/ko/docs/cli)를 사용하세요. `@tailwindcss/cli` 빌드 옵션을 사용하지만, 현재 콘텐츠 스캔 방식은 Tailwind와 다릅니다. 스캔 대상은 CLI 페이지에 나와 있습니다.

## 프로덕션용으로 축소하기

생성 중 출력을 압축하려면 `minify => true`을 전달하거나, 기존 문자열에 `tw::minify()`을 호출하세요:

```php
use TailwindPHP\tw;

// Minify during generation
$css = tw::generate([
    'content' => '<div class="flex p-4">Hello</div>',
    'minify' => true,
]);

// Or minify separately
$css = tw::generate('<div class="flex p-4">Hello</div>');
$minified = tw::minify($css);
```

축소기는 주석을 제거하고, 공백을 줄이고, 16진수 색상(`#ffffff`에서 `#fff`로)을 짧게 표기하며, 0 값의 단위(`0px`에서 `0`로)를 제거합니다. 캐싱 옵션은 [캐싱 및 축소](https://tailwindphp.inline0.dev/ko/docs/advanced/caching)를 참조하세요.

## 다음 단계

- [사용법](https://tailwindphp.inline0.dev/ko/docs/usage) — 생성 워크플로, 콘텐츠 스캔, 입력 형식.
- [클래스 유틸리티](https://tailwindphp.inline0.dev/ko/docs/class-utilities) — `cn()`, `merge()`, `join()`, `variants()`.
- [플러그인](https://tailwindphp.inline0.dev/ko/docs/plugins) — 타이포그래피, 폼, 사용자 정의 플러그인.
- [API](https://tailwindphp.inline0.dev/ko/docs/api) — 전체 `tw` API와 재사용 가능한 컴파일러 인스턴스.
- [CLI](https://tailwindphp.inline0.dev/ko/docs/cli) — Node.js 없이 파일 기반 및 감시 빌드.