# Початок роботи

## Встановлення

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

Для TailwindPHP потрібна PHP версії 8.2 або новіша з розширеннями `ctype` і `mbstring`, а також Composer. Обидва розширення входять до більшості збірок PHP і офіційних образів Docker; `composer.json` ще не вказує їх ([#11](https://github.com/inline0/tailwindphp/issues/11)), тому збірка без них встановить пакет, але він не працюватиме під час виконання. Залежність від Node.js не потрібна, етапу збірки немає, і npm не потрібен у вашому образі Docker чи CI. Просто `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, потрібні цим класам, — нічого зайвого. Якщо не передати другий аргумент, використовується типовий `@import "tailwindcss"`, який додає тему, [Preflight](https://tailwindphp.inline0.dev/uk/docs/usage/imports) і шар утиліт.

## Налаштування через рядок 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)
```

Повний перелік просторів імен теми див. у розділі [Theme](https://tailwindphp.inline0.dev/uk/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`. Формати вхідних даних описано в розділі [Usage](https://tailwindphp.inline0.dev/uk/docs/usage), а `@apply`, `@theme`, `@utility` та інші директиви — у [Directives](https://tailwindphp.inline0.dev/uk/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/uk/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);
```

Мінімізатор видаляє коментарі, стискає пробіли, скорочує шістнадцяткові кольори (`#ffffff` до `#fff`) і прибирає одиниці виміру в нульових значеннях (`0px` до `0`). Параметри кешування описано в розділі [Caching & minification](https://tailwindphp.inline0.dev/uk/docs/advanced/caching).

## Наступні кроки

- [Usage](https://tailwindphp.inline0.dev/uk/docs/usage) — робочий процес генерації, сканування вмісту та формати вхідних даних.
- [Class utilities](https://tailwindphp.inline0.dev/uk/docs/class-utilities) — `cn()`, `merge()`, `join()` і `variants()`.
- [Plugins](https://tailwindphp.inline0.dev/uk/docs/plugins) — типографіка, форми та власні плагіни.
- [API](https://tailwindphp.inline0.dev/uk/docs/api) — повний набір можливостей `tw` і повторно використовувані екземпляри компілятора.
- [CLI](https://tailwindphp.inline0.dev/uk/docs/cli) — збірки на основі файлів і в режимі спостереження без Node.js.