Lizard Sandboxes के साथ एक दिन में Lovable क्लोन बनाएँ

Lovable क्लोन को अपना जनरेट किया हुआ कोड चलाने के लिए कोई जगह चाहिए। मॉडल फ़ाइलें लिखता है, डिपेंडेंसीज़ इंस्टॉल करता है, बिल्ड जाँचता है और प्रीव्यू सर्वर शुरू करता है। हर ग्राहक प्रोजेक्ट को अपना वर्कस्पेस चाहिए।

Lizard Sandboxes के साथ आपका बैकएंड Lizard SDK के ज़रिए वह वर्कस्पेस बनाता है, उसे फ़ाइलें भेजता है, कमांड चलाता है और एक प्राइवेट प्रीव्यू URL लौटाता है। आप सर्वर ख़रीदे बिना या मशीनों का बेड़ा रिज़र्व किए बिना शुरू कर सकते हैं।

जो डेवलपर React और Node.js जानता है और ऐप टेम्प्लेट से शुरू करता है, उसके लिए छोटे MVP का लक्ष्य एक दिन रखना ठीक है: प्रॉम्प्ट डालें, React ऐप जनरेट करें, उसका प्रीव्यू खोलें और बदलाव माँगें। पेमेंट, टीम एक्सेस और पूरा डिप्लॉयमेंट प्रोडक्ट बनाने में और काम लगेगा।

Lizard पर हमने क्या टेस्ट किया

15 अक्टूबर 2026 को हमने Lizard SDK 0.1.69 के साथ us-east-1 में Small Firecracker Sandboxes पर एक्ज़ीक्यूशन वर्कफ़्लो चलाया।

पहले सफल रन में सैंडबॉक्स बनाने से लेकर काम करता प्रीव्यू मिलने तक लगभग 22 सेकंड लगे। इसमें Node.js और npm इंस्टॉल करना, स्टार्टर अपलोड करना, डिपेंडेंसीज़ इंस्टॉल करना और ऐप बिल्ड करना शामिल था। यह एक स्मोक टेस्ट है, स्टार्टअप बेंचमार्क नहीं।

टेस्ट ने पहले ड्राफ़्ट की दो गलतियाँ भी पकड़ीं। सैंडबॉक्स ऑब्जेक्ट अपनी ID sandbox.sandboxId में देता है। और हमें मिले interpreter सैंडबॉक्स में Node.js या npm नहीं था। नीचे का कोड बिल्ड चलाने से पहले Node.js का एक तय वर्ज़न इंस्टॉल करता है।

हमने एक्ज़ीक्यूशन और प्रीव्यू वर्कफ़्लो टेस्ट किया। नीचे दिया गया एक दिन का शेड्यूल बिल्ड का प्लान है; हमने पूरा SaaS प्रोडक्ट बनाने में लगने वाला समय नहीं मापा और किसी बाहरी मॉडल के आउटपुट की क्वालिटी भी टेस्ट नहीं की।

पहला वर्ज़न छोटा रखें

एक React और Vite टेम्प्लेट से शुरू करें। यूज़र्स को सैंपल डेटा के साथ सिंपल डैशबोर्ड, लैंडिंग पेज या इंटरनल टूल बनाने दें।

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

डिपेंडेंसीज़ की लिस्ट तय रखें। मॉडल को पैकेज का एक तय सेट दें और उसे कुछ सोर्स फ़ाइलें एडिट करने दें। इससे फ़ेल हुए बिल्ड ठीक करना आसान हो जाता है।

एक अच्छी पहली रिक्वेस्ट यह हो सकती है:

Build a dashboard for a small gym. Show monthly revenue,
active members, and upcoming classes. Use sample data.

प्रीव्यू चलने के बाद मेंबरशिप फ़िल्टर जोड़ने या बदलने के लिए अगली रिक्वेस्ट भेजें। इससे आपको टेस्ट करने के लिए एक ठोस फ़्लो मिल जाता है।

कंट्रोल अपने बैकएंड के पास रखें

मॉडल कनेक्शन, Lizard API की और यूज़र्स व प्रोजेक्ट्स की मैपिंग आपके बैकएंड के पास रहती है।

User prompt
    |
Your backend: sign-in, project access, model calls
    |
Lizard SDK
    |
Sandbox: source files, dependencies, build, preview
    |
Private preview URL returned to the project owner

मालिक, सैंडबॉक्स ID, बातचीत और सेव किया गया फ़ाइल वर्ज़न अपने डेटाबेस में रखें। लॉग पढ़ने और प्रीव्यू खोलने समेत हर ऑपरेशन से पहले ओनरशिप जाँचें।

प्लेटफ़ॉर्म क्रेडेंशियल्स अपने बैकएंड पर रखें। जनरेट किए गए कोड को न आपकी Lizard API की चाहिए, न मॉडल प्रोवाइडर की API की।

पहले वर्ज़न के लिए मॉडल से appTsx और appCss वाला स्ट्रक्चर्ड आउटपुट माँगें। दोनों स्ट्रिंग्स वैलिडेट करें और रिस्पॉन्स साइज़ की लिमिट तय करें। आपका बैकएंड इन्हें तय पाथ src/App.tsx और src/App.css पर लिखता है। पैकेज फ़ाइलें, लॉकफ़ाइल और बिल्ड स्क्रिप्ट्स उसी के कंट्रोल में रहती हैं।

मॉडल को बताएँ कि स्टार्टर कौन-से इम्पोर्ट सपोर्ट करता है। अगर बिल्ड फ़ेल हो, तो उससे जुड़ा एरर आउटपुट मॉडल को लौटाएँ और ज़्यादा से ज़्यादा दो बार ठीक करने की कोशिश होने दें। फिर एरर यूज़र को दिखाएँ।

सैंडबॉक्स बनाएँ और उसका प्रीव्यू खोलें

अपने Node.js बैकएंड में टेस्ट किया हुआ SDK वर्ज़न इंस्टॉल करें:

npm install @lizard-build/sdk@0.1.69

ऐसी की बनाएँ जो सिर्फ़ उसी Lizard प्रोजेक्ट तक सीमित हो जिसे आपका बिल्डर इस्तेमाल करता है:

lizard keys create lovable-builder --project YOUR_PROJECT_ID --json

बैकएंड एनवायरनमेंट में LIZARD_API_KEY और LIZARD_PROJECT_ID सेट करें। SDK आपका Lizard CLI लॉगिन नहीं पढ़ता और .env फ़ाइल भी अपने-आप लोड नहीं करता।

लॉकफ़ाइल और काम करती npm run build स्क्रिप्ट के साथ एक भरोसेमंद React और Vite स्टार्टर तैयार करें, जो आपके अपने कंट्रोल में हो। हमारे टेस्ट में React 19.2.0, Vite 7.1.12, TypeScript 5.9.3 और Python 3.11.16 इस्तेमाल हुए। अपने स्टार्टर की डिपेंडेंसीज़ अप-टू-डेट रखें और उन्हें अपडेट करने पर दोबारा टेस्ट करें।

नीचे का फ़ंक्शन इस स्टार्टर को रिलेटिव फ़ाइल पाथ से फ़ाइल कंटेंट के मैप के रूप में लेता है। इसे उन्हीं फ़ाइलों से लोड करें जो आपके कंट्रोल में हैं। starterFiles को मॉडल से या बिना ऑथेंटिकेशन वाली रिक्वेस्ट से स्वीकार न करें।

सेटअप स्टेप इस टेस्ट में इस्तेमाल हुए Linux x64 सैंडबॉक्स के लिए है। यह nodejs.org से Node.js 22.23.3 डाउनलोड करता है और आर्काइव को रिलीज़ चेकसम से मिलाकर जाँचता है। वर्कस्पेस जनरेट किए गए कोड को सौंपने से पहले सेटअप चलाएँ।

import { Lizard } from '@lizard-build/sdk'
import { setTimeout as delay } from 'node:timers/promises'

const project = process.env.LIZARD_PROJECT_ID
if (!project) throw new Error('LIZARD_PROJECT_ID is required')

const lizard = new Lizard({ project })

export async function createPreview(
  starterFiles: Record<string, string>,
  appTsx: string,
  appCss: string,
) {
  const sandbox = await lizard.create('interpreter', {
    size: 'small',
    timeoutMs: 10 * 60 * 1000,
    metadata: { purpose: 'lovable-article-smoke-20261015' },
  })

  try {
    const setup = await sandbox.process.exec(['/bin/bash', '-lc', `
set -euo pipefail
version=v22.23.3
archive=node-$version-linux-x64.tar.xz
if [ "$(node --version 2>/dev/null || true)" != "$version" ] || ! command -v npm >/dev/null; then
  cd /tmp
  curl -fsSLO "https://nodejs.org/dist/$version/$archive"
  curl -fsSL "https://nodejs.org/dist/$version/SHASUMS256.txt" | grep "  $archive$" | sha256sum -c -
  tar -xJf "$archive" -C /usr/local --strip-components=1
fi
node --version
npm --version
python --version
`], { timeoutMs: 120_000 })
    if (setup.exitCode !== 0) throw new Error(setup.stderr || setup.stdout)

    for (const [path, content] of Object.entries(starterFiles)) {
      await sandbox.fs.write(`/workspace/app/${path}`, content)
    }
    await sandbox.fs.write('/workspace/app/src/App.tsx', appTsx)
    await sandbox.fs.write('/workspace/app/src/App.css', appCss)

    for (const command of [['npm', 'ci'], ['npm', 'run', 'build']]) {
      const result = await sandbox.process.exec(command, {
        workdir: '/workspace/app',
        timeoutMs: 120_000,
      })
      if (result.exitCode !== 0) {
        throw new Error(result.stderr || result.stdout)
      }
    }

    const server = await sandbox.process.exec(
      ['/bin/bash', '-lc', 'nohup python -m http.server 3000 --bind 0.0.0.0 ' +
      '--directory dist > /tmp/preview.log 2>&1 < /dev/null &'],
      { workdir: '/workspace/app' },
    )
    if (server.exitCode !== 0) throw new Error(server.stderr)

    const route = await sandbox.exposePort(3000)
    for (let attempt = 0; attempt < 15; attempt++) {
      const response = await fetch(`https://${route.hostname}`, {
        headers: { 'X-Lizard-Access-Token': route.accessToken },
        signal: AbortSignal.timeout(3_000),
      }).catch(() => null)

      const ready = response?.ok
      await response?.body?.cancel()
      if (ready) {
        return { sandboxId: sandbox.sandboxId, previewUrl: route.url }
      }
      await delay(500)
    }
    throw new Error('Preview did not become ready')
  } catch (error) {
    await sandbox.kill()
    throw error
  }
}

मॉडल का रिस्पॉन्स वैलिडेट करने के बाद createPreview(starterFiles, result.appTsx, result.appCss) कॉल करें। लौटाया गया sandboxId यूज़र के प्रोजेक्ट के साथ सेव करें और एक्सेस जाँचने के बाद ही previewUrl लौटाएँ।

URL में एक्सेस टोकन होता है। इसे पब्लिक लॉग और एनालिटिक्स से दूर रखें। इससे सैंडबॉक्स के एक्सपोज़ किए गए पोर्ट्स तक एक्सेस मिलता है, इसलिए इसे क्रेडेंशियल की तरह संभालें।

यह उदाहरण बिल्ड किए गए फ़्रंटएंड को Python के HTTP सर्वर से सर्व करता है। इसे प्राइवेट डेवलपमेंट प्रीव्यू के लिए इस्तेमाल करें। शुरुआती ऐप को एक ही रूट पर रखें या हैश रूटिंग इस्तेमाल करें। प्रोडक्शन होस्टिंग एक अलग डिप्लॉयमेंट होनी चाहिए।

Lizard SDK रेफ़रेंस में कमांड, फ़ाइलें, प्राइवेट पोर्ट और सैंडबॉक्स लाइफ़साइकल के ऑपरेशन बताए गए हैं।

आगे के बदलाव और सेव किए गए प्रोजेक्ट संभालें

lizard.connect(sandboxId) के ज़रिए प्रोजेक्ट के सैंडबॉक्स से दोबारा कनेक्ट करें। मंज़ूर की गई सोर्स फ़ाइलें पढ़ें, उन्हें यूज़र की अगली रिक्वेस्ट के साथ मॉडल को भेजें, रिस्पॉन्स वैलिडेट करें, बदलाव लिखें और बिल्ड फिर से चलाएँ।

हमारे टेस्ट में हेडिंग बदली गई और एक सैंपल मेंबर जोड़ा गया। रीबिल्ड करने और उसी प्रीव्यू URL को रीलोड करने के बाद ब्राउज़र ने नया वर्ज़न दिखाया और उसका फ़िल्टर काम कर रहा था।

हर सफल बिल्ड के बाद सोर्स फ़ाइलें सेव करें। सोर्स बंडल स्टोर करने के लिए Managed Object Storage में एक प्राइवेट बकेट इस्तेमाल करें और प्रोजेक्ट रिकॉर्ड Managed Postgres में रखें। ये बैकएंड सर्विसेज़ प्रीव्यू वर्कस्पेस से अलग चलती हैं।

सैंडबॉक्स की मियाद ख़त्म होने के बाद लौटने वाले यूज़र को नया सैंडबॉक्स चाहिए। सेव किया गया सोर्स और स्टार्टर रीस्टोर करें, फिर रीबिल्ड करें। हमने एडिट किया गया सोर्स दूसरे सैंडबॉक्स में लोड करके और बने हुए ऐप को ब्राउज़र में खोलकर इसकी पुष्टि की।

वर्कस्पेस फ़ाइलें बनाए रखने का एक और विकल्प Persistent Volumes हैं। हर वॉल्यूम एक समय में एक ही सैंडबॉक्स से जुड़ता है। ज़रूरी फ़ाइलों की एक बाहरी कॉपी रखें, क्योंकि स्टोरेज एक ही नोड पर रहता है। सैंडबॉक्स स्टोरेज की जानकारी

Firecracker से जनरेट किए गए कोड को आइसोलेट करें

Lizard Sandboxes, Firecracker microVMs के रूप में चलते हैं और हर एक का अपना कर्नेल होता है। रनटाइम की जानकारी

हर एक्टिव ग्राहक प्रोजेक्ट के लिए अलग सैंडबॉक्स बनाएँ। प्रोडक्शन डेटाबेस के क्रेडेंशियल्स और प्लेटफ़ॉर्म API की उस वर्कस्पेस से बाहर रखें। सैंडबॉक्स नेटवर्क रिक्वेस्ट भेज सकता है, इसलिए जनरेट किया गया कोड अंदर रखे किसी भी सीक्रेट को बाहर भेज सकता है।

प्रीव्यू को अपने मुख्य ऐप से अलग ब्राउज़र origin (अलग डोमेन) पर सर्व करें। MVP के लिए प्राइवेट प्रीव्यू को नए टैब में खोलने से इंटीग्रेशन सरल रहता है। अगर बाद में प्रीव्यू एम्बेड करें, तो iframe की परमिशन की समीक्षा करें और मैसेज वैलिडेट करें।

यूज़र्स को बुलाने से पहले दो अकाउंट से टेस्ट करें। प्रोजेक्ट ID बदलकर एक अकाउंट दूसरे अकाउंट की फ़ाइलें, लॉग या प्रीव्यू URL नहीं पढ़ पाना चाहिए। एक्ज़ीक्यूशन की सीमा Firecracker संभालता है; यूज़र एक्सेस आपका एप्लिकेशन संभालता है।

Lovable क्लोन चलाने में कितना ख़र्च आता है?

Small साइज़ की कीमत 2 vCPU, 4 GB RAM और 5 GB लोकल डिस्क के लिए $0.0162 प्रति घंटा है। Lizard चलने के समय का बिल सेकंड के हिसाब से बनाता है।

हर सेशन 10 मिनट मानकर:

ये कंप्यूट के अनुमान हैं। Lizard Pro की कीमत $19 प्रति माह है, जिसमें $19 का उपयोग शामिल है; इससे ज़्यादा उपयोग pay as you go है। 7 दिन के ट्रायल में $5 का उपयोग शामिल है और कार्ड देना ज़रूरी है। कीमतें 15 अक्टूबर 2026 को जाँची गईं। मौजूदा प्राइसिंग

मॉडल टोकन, बैकएंड होस्टिंग, डेटाबेस और पर्सिस्टेंट स्टोरेज भी आपकी कुल लागत पर असर डालते हैं। अपनी कीमतें तय करने से पहले हर प्रोजेक्ट का मॉडल उपयोग और सैंडबॉक्स समय ट्रैक करें।

यूज़र मिलने से पहले आपको सर्वर ख़रीदने या क्षमता रिज़र्व करने की ज़रूरत नहीं पड़ती। लेकिन आइडल पड़ा चलता सैंडबॉक्स भी पैसे ख़र्च करता है। इस्तेमाल न हो रहे सेशन रोकें या बंद करें; रखे गए स्टोरेज पर शुल्क फिर भी लग सकता है।

उदाहरण में सैंडबॉक्स की उम्र 10 मिनट सेट है। कमांड चलाने से यह समय सीमा नहीं बढ़ती। अपने बैकएंड में आइडल सेशन की नीति और एक Stop बटन जोड़ें, और सेशन ख़त्म होने पर पहले उसका सोर्स सेव करें, फिर sandbox.kill() कॉल करें। लाइफ़साइकल रेफ़रेंस

एक दिन का MVP प्लान

यह शेड्यूल मानता है कि आपके पास पहले से ऑथेंटिकेशन वाला वेब ऐप स्टार्टर है।

टेस्टर्स को बुलाने से पहले यूज़र का पूरा फ़्लो जाँचें: ऐप बनाएँ, बदलाव माँगें, सेशन बंद करें और सेव किया गया प्रोजेक्ट दोबारा खोलें। फ़ेल हुए बिल्ड को काम का एरर दिखाना चाहिए और अपना सैंडबॉक्स छोड़ देना चाहिए।

एक टेम्प्लेट और काम करते प्रीव्यू से शुरू करें। Lizard Sandboxes और Lizard SDK उस पहली रिलीज़ के लिए एक्ज़ीक्यूशन, फ़ाइल और लाइफ़साइकल कंट्रोल देते हैं।