@aero-cms/react-sdk

AeroCMS Headless API için React SDK.

Kurulum

npm install @aero-cms/react-sdk

Kullanım

import { CmsProvider, usePage, useMenu, BlockRenderer } from '@aero-cms/react-sdk';

function App() {
  return (
    <CmsProvider config={{ baseUrl: 'http://localhost:8080' }}>
      <HomePage />
    </CmsProvider>
  );
}

function HomePage() {
  const { data: page, loading } = usePage('anasayfa');
  const { data: menu } = useMenu('header');

  if (loading) return <div>Yükleniyor...</div>;
  if (!page) return <div>Sayfa bulunamadı</div>;

  return (
    <div>
      <h1>{page.title}</h1>
      <BlockRenderer blocks={page.blocks} />
    </div>
  );
}

Hook'lar

| Hook | Açıklama | |------|----------| | usePage(slug) | Sayfa verisi | | usePages(params?) | Sayfa listesi | | useMenu(location) | Menü ağacı | | useSiteSettings(prefix) | Site ayarları | | useSearch(query, params?) | Arama | | useSuggest(query, limit?) | Arama önerileri | | useForm(slug) | Form yapısı | | useLanguages() | Dil listesi |

BlockRenderer

import { BlockRenderer } from '@aero-cms/react-sdk';

// Varsayılan block bileşenleri ile
<BlockRenderer blocks={page.blocks} />

// Özel block bileşenleri ile
<BlockRenderer
  blocks={page.blocks}
  components={{
    text: MyCustomTextBlock,
    image: MyCustomImageBlock,
  }}
/>