Describe your website.
Launch it in minutes.

import { createSyncClient } from '@sleekcms/client';

const client = await createSyncClient({
  siteToken: 'YOUR_SITE_TOKEN',
  env: 'production'
});

const page   = client.getPage('/about');
const posts  = client.getPages('/blog');
const footer = client.getEntry('footer');
const slugs  = client.getSlugs('/blog');

const page = client.getPage('/');

// Responsive hero image
const heroUrl  = `${page.banner.raw}?w=1200&h=600&fit=cover&fmt=webp`;

// Retina OG image
const ogUrl    = `${page.banner.raw}?w=1200&h=630&dpr=2&fmt=jpg&q=85`;

// Blurred background
const bgUrl    = `${page.banner.raw}?w=1920&blur=20&q=40`;

// Thumbnail
const thumbUrl = `${page.banner.raw}?w=400&h=300&fit=cover&fmt=webp`;

import { usePage } from '@sleekcms/react';

export default function AboutPage() {
  const { page, loading, error } = usePage('/about');

  if (loading) return <Spinner />;
  if (error)   return <ErrorState />;

  return (
    <article>
      <h1>{page.title}</h1>
      <p>{page.description}</p>
    </article>
  );
}