> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kazzle.com/llms.txt
> Use this file to discover all available pages before exploring further.

# पूर्वावलोकन

> ऐप ड्राफ्ट के लिए डेव सर्वर पूर्वावलोकन।

# पूर्वावलोकन

जब आप कोई ऐप ड्राफ्ट खोलते हैं, तो Kazzle एक डेव सर्वर शुरू कर सकता है और लाइव पूर्वावलोकन दिखा सकता है।

## यह कैसे काम करता है

1. साइडबार से ड्राफ्ट टैब खोलें
2. पूर्वावलोकन स्वचालित रूप से शुरू होता है (या "पूर्वावलोकन शुरू करें" पर क्लिक करें)
3. Kazzle आपके `kazzle.config.ts` से `lifecycle.dev` पढ़ता है
4. डेव कमांड असाइन किए गए पोर्ट पर चलता है
5. पूर्वावलोकन URL ड्राफ्ट टैब में दिखाई देता है

## डेव कमांड कॉन्फ़िगर करना

अपने UI कंपोनेंट पर `lifecycle.dev` सेट करें:

```typescript theme={"theme":"material-theme-darker"}
import { defineConfig } from '@kazzle/app';

export default defineConfig({
  components: [
    {
      name: 'My App',
      type: 'ui',
      path: '.',
      lifecycle: { dev: 'bun run dev' }
    }
  ]
});
```

यदि `lifecycle.dev` सेट नहीं है, तो पूर्वावलोकन सिस्टम सामान्य डेव सर्वर डिटेक्शन (Vite, Next.js, आदि) पर वापस आता है।

## पूर्वावलोकन URL

प्रत्येक ऐप को अपने सैंडबॉक्स पर एक समर्पित पोर्ट मिलता है। पूर्वावलोकन URL इस पैटर्न का अनुसरण करता है:

```
http://localhost:{PORT}
```

`PORT` पर्यावरण चर स्वचालित रूप से पूर्वावलोकन सिस्टम द्वारा सेट किया जाता है।

## हॉट रीलोड

आपके कोड में परिवर्तन आपके डेव सर्वर के हॉट रीलोड (HMR) द्वारा उठाए जाते हैं। जैसे ही आप या AI फ़ाइलों को संपादित करते हैं, पूर्वावलोकन रीयल टाइम में अपडेट होता है।

## मैनुअल नियंत्रण

* **पूर्वावलोकन शुरू करें** — डेव सर्वर शुरू करता है यदि यह चल नहीं रहा है
* **पूर्वावलोकन बंद करें** — डेव सर्वर प्रक्रिया को समाप्त करता है
* **पुनः शुरू करें** — बंद करें + शुरू करें (कॉन्फ़िगरेशन परिवर्तन के बाद उपयोगी)

## सत्यापन

एक पूर्वावलोकन तभी सत्यापित होता है जब ऐप-डेव टैब खुलता है और अपेक्षित UI दिखाता है। टाइमआउट, विफल टैब खुलना, रुकी हुई प्रक्रिया, या लापता पूर्वावलोकन URL का मतलब है कि पूर्वावलोकन अभी तक सत्यापित नहीं है।

जब AI एक ऐप बनाता है, तो इसे ड्राफ्ट शुरू करने या बदलने के बाद ऐप-डेव टैब खोलना चाहिए। इसे केवल कमांड आउटपुट से ऐप चल रहा है यह दावा नहीं करना चाहिए।