---
title: "Memulai dengan Sanity × Nuxt UI · Sanity × Nuxt UI"
description: "Hubungkan template ke proyek Sanity, impor konten contoh, lalu jalankan Studio dan situs berdampingan."
canonical_url: "https://sanity-nuxtui.vercel.app/id/blog/memulai"
meta:
  "og:description": "Hubungkan template ke proyek Sanity, impor konten contoh, lalu jalankan Studio dan situs berdampingan."
  "og:image": "https://cdn.sanity.io/images/kdwtvkc2/production/968d3f7c1d70f1f84af4b4ee50ab9eef07803bea-1600x1067.jpg?fit=crop&w=1200&h=630&auto=format"
  "og:image:alt": "Laptop di atas meja"
  "og:image:height": "630"
  "og:image:width": "1200"
  "og:title": "Memulai dengan Sanity × Nuxt UI · Sanity × Nuxt UI"
---

> Index of every page on this site: [llms.txt](https://sanity-nuxtui.vercel.app/llms.txt)

[Blog](https://sanity-nuxtui.vercel.app/id/blog)·10 Oktober 2026

# **Memulai dengan Sanity × Nuxt UI**

Hubungkan template ke proyek Sanity, impor konten contoh, lalu jalankan Studio dan situs berdampingan.

**AM**

**Ada Morgan**

Editor

![Laptop di atas meja](https://cdn.sanity.io/images/kdwtvkc2/production/968d3f7c1d70f1f84af4b4ee50ab9eef07803bea-1600x1067.jpg?w=2400&h=1600&auto=format)

Template ini memadukan ****Sanity Studio**** untuk menyunting dan ****Nuxt UI**** untuk menampilkan. Editor membangun halaman dari blok, dan setiap blok menjadi komponen Nuxt UI di situs.

## 1. Hubungkan proyekmu

Salin file env contoh, lalu isi project ID dari [**sanity.io/manage**](https://www.sanity.io/manage).

terminal

```
cp apps/studio/.env.example apps/studio/.envcp apps/web/.env.example apps/web/.env
```

## 2. Tambahkan konten contoh

Skrip seed membuat halaman, tiga koleksi (Blog, Galeri, Proyek) beserta entrinya, dan penulis, jadi kamu bisa melihat semua blok bekerja.

terminal

```
pnpm installpnpm --filter studio exec sanity loginpnpm seed
```

**Sudah punya konten?**

Skrip seed berhenti kalau dataset sudah berisi konten. Jalankan "pnpm seed --replace" untuk menghapusnya dulu.

## 3. Jalankan

- `pnpm dev` menjalankan Studio di port 3333 dan situs di port 3000.
- Sunting halaman di Studio, terbitkan, lalu muat ulang situs.
- Buka tool ****Presentation**** untuk menyunting dengan pratinjau langsung.

Tag: [panduan](https://sanity-nuxtui.vercel.app/id/blog?tag=panduan) [persiapan](https://sanity-nuxtui.vercel.app/id/blog?tag=persiapan)

## **Baca juga**

![Laptop dan buku catatan di atas meja](https://cdn.sanity.io/images/kdwtvkc2/production/ae96f58c01fdb1cefac7d0aa96b01e36bde32af9-1600x1067.jpg?w=676&h=380&fit=crop&auto=format)

panduan12 Oktober 2026

## Membuat bagian baru tanpa kode

Blog, Galeri, dan Proyek semuanya koleksi. Editor bisa menambah koleksi baru, seperti Layanan atau Tim, langsung dari Studio.

**AM**

**Ada Morgan**

Editor

![Seseorang bekerja di depan laptop](https://cdn.sanity.io/images/kdwtvkc2/production/3c5959bf9dc0555105bc0bcb466cd95a1608141a-1600x1067.jpg?w=676&h=380&fit=crop&auto=format)

panduan6 Oktober 2026

## Cara menambahkan blok baru

Komponen Nuxt UI apa pun bisa jadi blok. Cukup satu schema, satu komponen Vue, dan satu baris di registry.

**LH**

**Leo Hart**

Frontend Engineer

![Laptop dan buku catatan di atas meja](https://cdn.sanity.io/images/kdwtvkc2/production/58818fdb1451d82abff05bee983b2b52e136add6-1600x1067.jpg?w=676&h=380&fit=crop&auto=format)

penyuntingan2 Oktober 2026

## Menyunting dengan pratinjau langsung

Aktifkan Visual Editing, lalu klik teks mana pun di situs untuk langsung membuka field-nya di Studio.

```json
{"@context":"https://schema.org","@graph":[{"@id":"https://sanity-nuxtui.vercel.app/#website","@type":"WebSite","name":"Sanity × Nuxt UI","url":"https://sanity-nuxtui.vercel.app/","publisher":{"@id":"https://sanity-nuxtui.vercel.app/#identity"}},{"@id":"https://sanity-nuxtui.vercel.app/id/blog/memulai#webpage","@type":"WebPage","dateModified":"2026-10-16T00:42:53Z","datePublished":"2026-10-10T09:00:00Z","description":"Hubungkan template ke proyek Sanity, impor konten contoh, lalu jalankan Studio dan situs berdampingan.","name":"Memulai dengan Sanity × Nuxt UI","url":"https://sanity-nuxtui.vercel.app/id/blog/memulai","isPartOf":{"@id":"https://sanity-nuxtui.vercel.app/#website"},"potentialAction":[{"@type":"ReadAction","target":["https://sanity-nuxtui.vercel.app/id/blog/memulai"]}]},{"@id":"https://sanity-nuxtui.vercel.app/#identity","@type":"Organization","name":"Sanity × Nuxt UI","url":"https://sanity-nuxtui.vercel.app"},{"@id":"https://sanity-nuxtui.vercel.app/id/blog/memulai#article","@type":"Article","dateModified":"2026-10-16T00:42:53Z","datePublished":"2026-10-10T09:00:00Z","description":"Hubungkan template ke proyek Sanity, impor konten contoh, lalu jalankan Studio dan situs berdampingan.","headline":"Memulai dengan Sanity × Nuxt UI","inLanguage":"en","thumbnailUrl":"https://cdn.sanity.io/images/kdwtvkc2/production/968d3f7c1d70f1f84af4b4ee50ab9eef07803bea-1600x1067.jpg?w=1200&auto=format","author":{"@id":"https://sanity-nuxtui.vercel.app/#/schema/person/1"},"image":{"@id":"https://sanity-nuxtui.vercel.app/#/schema/image/1"},"isPartOf":{"@id":"https://sanity-nuxtui.vercel.app/id/blog/memulai#webpage"},"mainEntityOfPage":{"@id":"https://sanity-nuxtui.vercel.app/id/blog/memulai#webpage"},"publisher":{"@id":"https://sanity-nuxtui.vercel.app/#identity"}},{"@id":"https://sanity-nuxtui.vercel.app/#/schema/person/1","@type":"Person","name":"Ada Morgan"},{"@id":"https://sanity-nuxtui.vercel.app/#/schema/image/1","@type":"ImageObject","contentUrl":"https://cdn.sanity.io/images/kdwtvkc2/production/968d3f7c1d70f1f84af4b4ee50ab9eef07803bea-1600x1067.jpg?w=1200&auto=format","inLanguage":"en","url":"https://cdn.sanity.io/images/kdwtvkc2/production/968d3f7c1d70f1f84af4b4ee50ab9eef07803bea-1600x1067.jpg?w=1200&auto=format"}]}
```

## Sitemap

See the full [sitemap](https://sanity-nuxtui.vercel.app/sitemap.md) for all pages.