# Memulai

## Instalasi

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

TailwindPHP memerlukan PHP 8.2 atau yang lebih baru dengan ekstensi `ctype` dan `mbstring`, serta Composer. Kedua ekstensi disertakan dalam sebagian besar build PHP dan image resmi Docker; `composer.json` belum mencantumkannya ([#11](https://github.com/inline0/tailwindphp/issues/11)), sehingga build tanpa ekstensi tersebut akan menginstal paket lalu gagal saat runtime. Tidak ada dependensi Node.js, tahap build, atau npm di image atau CI Docker Anda. Cukup `composer require` dan panggil API.

## Buat CSS pertama Anda

```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()` memindai markup, mengambil nama kelas yang ditemukan, lalu menghasilkan hanya CSS yang dibutuhkan kelas tersebut — tidak lebih. Jika argumen kedua tidak diberikan, fitur ini menggunakan `@import "tailwindcss"` default yang menyertakan tema, [Preflight](https://tailwindphp.inline0.dev/id/docs/usage/imports), dan lapisan utilitas.

## Kustomisasi melalui string CSS

Berikan string CSS masukan sebagai argumen kedua untuk menambahkan variabel `@theme`, aturan kustom, atau direktif. Nilai tema baru otomatis menjadi utilitas:

```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)
```

Lihat [Tema](https://tailwindphp.inline0.dev/id/docs/usage/theme) untuk daftar lengkap namespace tema.

## Masukan array

Untuk kebutuhan selain satu baris, berikan array dengan kunci `content` dan `css`. Di sinilah Anda menentukan komponen dengan `@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;
        }
    ',
]);
```

Format array juga menerima `minify`, `importPaths`, `cache`, dan `cacheTtl`. Lihat [Penggunaan](https://tailwindphp.inline0.dev/id/docs/usage) untuk format masukan dan [Direktif](https://tailwindphp.inline0.dev/id/docs/usage/directives) untuk `@apply`, `@theme`, `@utility`, dan lainnya.

## Tulis ke file

`generate()` mengembalikan string, jadi menulis stylesheet hanya perlu satu baris:

```php
use TailwindPHP\tw;

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

Untuk build berbasis file yang memindai direktori templat dan untuk mode pantau, gunakan [CLI](https://tailwindphp.inline0.dev/id/docs/cli) saja. Fitur ini menerima opsi build `@tailwindcss/cli`, tetapi pemindaian kontennya saat ini berbeda dari Tailwind; halaman CLI menjelaskan apa saja yang dipindai.

## Minifikasi untuk produksi

Berikan `minify => true` untuk memadatkan keluaran saat dibuat, atau panggil `tw::minify()` pada string yang sudah ada:

```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);
```

Minifier menghapus komentar, merapatkan spasi kosong, mempersingkat warna hex (`#ffffff` menjadi `#fff`), dan menghapus satuan dari nilai nol (`0px` menjadi `0`). Lihat [Penyimpanan cache & minifikasi](https://tailwindphp.inline0.dev/id/docs/advanced/caching) untuk opsi cache.

## Langkah berikutnya

- [Penggunaan](https://tailwindphp.inline0.dev/id/docs/usage) — alur kerja pembuatan, pemindaian konten, dan format masukan.
- [Utilitas kelas](https://tailwindphp.inline0.dev/id/docs/class-utilities) — `cn()`, `merge()`, `join()`, dan `variants()`.
- [Plugin](https://tailwindphp.inline0.dev/id/docs/plugins) — tipografi, formulir, dan plugin kustom.
- [API](https://tailwindphp.inline0.dev/id/docs/api) — cakupan `tw` lengkap dan instans compiler yang dapat digunakan kembali.
- [CLI](https://tailwindphp.inline0.dev/id/docs/cli) — build berbasis file dan pemantauan tanpa Node.js.