---
title: Genel Bakış
description: ikas Admin Uygulamaları için hazır bileşenler, ekran kalıpları ve grafikler.
---

ikas App UI, ikas paneline yerleşen Admin Uygulamaları için hazırlanmış bir arayüz kütüphanesidir. [shadcn/ui](https://ui.shadcn.com) üzerine kuruludur ve shadcn CLI ile projenize kopyalanır. Böylece sizin yazdığınız ekranlar ile AI agent'ın ürettiği ekranlar aynı görsel dili konuşur.

## Neler var

- [Sayfa yerleşimi](https://builders.ikas.com/tr/docs/app-development/ui-kit/components/page) — Page, Layout ve Card: sayfa çerçevesi ve kolon düzenleri.
- [Veri gösterimi](https://builders.ikas.com/tr/docs/app-development/ui-kit/components/record-table) — Record Table, Stat Card ve Description List.
- [Aksiyonlar ve formlar](https://builders.ikas.com/tr/docs/app-development/ui-kit/components/button) — Variant ve renk sistemiyle Button, Badge ve form kontrolleri.
- [Geri bildirim](https://builders.ikas.com/tr/docs/app-development/ui-kit/components/banner) — Banner, Empty State, Toast ve Unsaved Bar.
- [Uygulama blokları](https://builders.ikas.com/tr/docs/app-development/ui-kit/components/launchpad) — Opt-in modüller, Launchpad, Script Installer gibi tekrar eden bloklar.
- [Grafikler](https://builders.ikas.com/tr/docs/app-development/ui-kit/components/area-chart) — Doğrulanmış paletle Area, Bar, Donut, Bar List ve Meter.
- [Animasyonlu kontroller](https://builders.ikas.com/tr/docs/app-development/ui-kit/components/segmented-control) — Kayan seçimler, açılan bölümler, sayı ve ikon animasyonları.

## Nasıl çalışır

<Steps>
<Step>
### Registry'yi ekleyin

`components.json` içine `@ikas` namespace'ini bir kez tanımlayın.
</Step>
<Step>
### Bileşeni kurun

shadcn CLI, bileşeni bağımlılıklarıyla birlikte projenize kopyalar.
</Step>
<Step>
### Kodu sahiplenin

Dosyalar sizindir. Sürüm kilidi veya çalışma zamanı paketi yoktur; gerektiğinde değiştirebilirsiniz.
</Step>
</Steps>

```bash
npx shadcn@latest add @ikas/theme @ikas/page @ikas/record-table @ikas/area-chart
```

Adım adım kurulum için [Kurulum](https://builders.ikas.com/tr/docs/app-development/ui-kit/installation) sayfasına geçin.

## Öne çıkan örnekler

Bileşenlerin bir araya geldiği tam ekranlar:

- [Panel](https://builders.ikas.com/tr/docs/app-development/ui-kit/examples/dashboard) — Grafikler ve veri bileşenleri bir arada.
- [Otomasyon kuralı](https://builders.ikas.com/tr/docs/app-development/ui-kit/examples/automation-rule) — Hareket bileşenlerinin kullanıldığı bir kural editörü.
- [Uygulama ana sayfası](https://builders.ikas.com/tr/docs/app-development/ui-kit/examples/app-home) — Kurulumdan hemen sonraki ilk ekran: kurulum rehberi ve boş durumlar.
- [Kampanya editörü](https://builders.ikas.com/tr/docs/app-development/ui-kit/examples/campaign-editor) — Form bölümleri ve canlı widget önizlemesi.