AI से साइट बनाना और डिप्लॉय करना

इससे पहले AI से स्टैटिक पेज माइग्रेट करना में हमने यह देखा कि पहले से बने एक स्टैटिक पेज को WEEGLOO द्वारा प्रबंधित कंटेंट-आधारित सेवा में कैसे स्थानांतरित किया जाता है। इस बार हम पेज को शुरू से नया बनाने के चरण तक को शामिल करते हुए एक व्यापक प्रवाह को कवर करते हैं।

इस सहायता लेख में हम LLM एजेंट और WEEGLOO MCP का उपयोग करते हुए, खाली स्थिति से शुरुआत करके पाँच कार्य क्रमवार करते हैं। सबसे पहले एक AI-आधारित डिज़ाइन टूल से पेज का डिज़ाइन और इम्प्लीमेंटेशन पूरा करते हैं, फिर बनाए गए पेज का विश्लेषण करके Content Type को स्वतः परिभाषित करते हैं, और उसके बाद पेज में लिखे डेटा को Content के रूप में लोड करते हैं। इसके बाद पेज को CDA से डेटा प्राप्त करने योग्य बनाने के लिए कोड में बदलाव करते हैं, और अंत में WEEGLOO के Web Hosting से पेज को बाहरी रूप से प्रकाशित करते हैं।

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

पूर्व तैयारी

काम शुरू करने से पहले तीन चीज़ें तैयार होनी चाहिए।

पहली, WEEGLOO में एक नया Space खाली स्थिति में बना होना चाहिए। आगे जो Content Type और Content बनाए जाएँगे, वे सब इसी Space के भीतर प्रबंधित होंगे। Organization और Space के बारे में विस्तृत जानकारी पहुँच और अनुमतियाँ में दी गई है।

दूसरी, LLM एजेंट WEEGLOO MCP से जुड़ा होना चाहिए। यह सहायता लेख Cursor IDE को आधार मानकर आगे बढ़ता है, लेकिन Claude Desktop जैसे MCP को सपोर्ट करने वाले किसी भी एनवायरनमेंट में आप इसी प्रवाह से काम कर सकते हैं। इंस्टॉल करने का तरीका MCP में दिया गया है।

तीसरी, एक AI टूल की ज़रूरत है जो पेज का डिज़ाइन और इम्प्लीमेंटेशन स्वतः बना दे। यह सहायता लेख सुविधा के लिए Vercel v0 का उपयोग करता है, लेकिन Lovable या Bolt.new जैसा कोई भी टूल जो केवल प्राकृतिक भाषा के अनुरोध से डिज़ाइन और कोड दोनों बना देता है, चलेगा। यदि आपको कोड खुद लिखने वाला एनवायरनमेंट अधिक परिचित लगता है, तो आप Cursor IDE जैसे अपने सामान्य LLM एजेंट से भी डिज़ाइन और इम्प्लीमेंटेशन दोनों के लिए अनुरोध कर सकते हैं।

पेज का डिज़ाइन और इम्प्लीमेंटेशन

सबसे पहला काम है पेज का डिज़ाइन और इम्प्लीमेंटेशन पूरा करना। इस चरण में आप किस तरह का पेज बनाना चाहते हैं, उसे प्राकृतिक भाषा में सँवारकर AI टूल को सीधे वैसे ही देते हैं।

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

पेज में API के बारे में स्वयं की जानकारी (नाम, टैगलाइन, संक्षिप्त परिचय) के साथ-साथ, प्रत्येक एंडपॉइंट के बारे में जानकारी (HTTP मेथड, पाथ, सारांश, विवरण) शामिल होती है। पेज का ठोस स्वरूप या इसमें शामिल एंडपॉइंट की संख्या आप जिस API को चला रहे हैं उसके अनुसार स्वतंत्र रूप से तय कर सकते हैं, और संचालन के दौरान जितना चाहें उतना विस्तृत कर सकते हैं। इन आवश्यकताओं को नीचे दिए अनुसार प्राकृतिक भाषा में सँवारकर AI टूल को दिया जाता है।

Hey, I want to build a docs site for an analytics API called Pulse.
Standard API reference layout — an overview area with the API's name,
tagline, and a short intro, plus an endpoint reference section showing
the HTTP method, path, summary, and description for each. Clean,
dev-friendly, not too colorful — think Stripe-style readable.

अनुरोध मिलने पर AI टूल एक डिज़ाइन प्रारूप बनाता है और उसके अनुरूप मार्कअप तथा स्टाइल भी साथ में लिखता है। इस समय अभी तक कोई कंटेंट प्रबंधन प्रणाली जुड़ी नहीं होती, इसलिए पेज पर दिखने वाला सारा डेटा कोड के भीतर ही सीधे लिखा हुआ होता है।

इस तरह बनाए गए पेज के कोड को डाउनलोड करके Cursor IDE जैसे LLM एजेंट एनवायरनमेंट में लाते हैं। इसके बाद के सभी काम इसी कोड के आधार पर आगे बढ़ते हैं, और AI से स्टैटिक पेज माइग्रेट करना में देखे गए प्रवाह जैसे ही चरणों से गुज़रते हैं।

कंटेंट मॉडलिंग

इस चरण में हम पहले बनाए गए पेज की डेटा संरचना को Content Type के रूप में परिभाषित करते हैं। Content Type डेटा के ब्लूप्रिंट की तरह होता है, जो पहले से तय करता है कि किन Field वाले डेटा को WEEGLOO में प्रबंधित किया जाएगा।

पेज के कोड को देखें तो उसमें API के बारे में स्वयं की जानकारी और प्रत्येक एंडपॉइंट के बारे में जानकारी साथ-साथ मौजूद होती है, और इन दोनों तरह के डेटा के बीच एक-से-अनेक का संबंध बनता है। इसीलिए यह पेज स्वाभाविक रूप से दो Content Type में बँट जाता है: एक जो API की जानकारी रखता है और दूसरा जो एंडपॉइंट की जानकारी रखता है।

यह विश्लेषण और Content Type का निर्माण LLM एजेंट से नीचे दिए अनुसार अनुरोध करने मात्र से स्वतः हो जाता है।

Hey, I just dropped the page from v0 into the project.
The data's all hardcoded for now (the API info up top, the endpoints down
below).
 
I want to migrate it over to Weegloo so the page can pull its content from
a CMS instead of having it all baked in. Let's take it step by step rather
than doing the whole thing in one go.
 
To kick things off, could you take a look and figure out
what content types would make sense for it, then go ahead and create them
in Weegloo? We'll deal with the actual content and the API wiring in the
following steps.

अनुरोध मिलने पर LLM एजेंट कोड की संरचना को देखकर डेटा की किस्म और संबंध का अनुमान लगाता है, प्रत्येक Field के लिए उपयुक्त टाइप तय करता है, और फिर WEEGLOO MCP से Content Type बनाता है।

काम पूरा होने के बाद WEEGLOO कंटेंट स्टूडियो के Content Type पेज को देखें तो आपको API को दर्शाने वाला Content Type और एंडपॉइंट को दर्शाने वाला Content Type, दो नए बने हुए दिखाई देंगे। API वाले Content Type में नाम, टैगलाइन, परिचय जैसे Field होते हैं, और एंडपॉइंट वाले Content Type में HTTP मेथड, पाथ, सारांश, विवरण के साथ-साथ यह दर्शाने वाला रेफरेंस (Reference) Field होता है कि वह किस API से संबंधित है।

इस तरह Content Type परिभाषित हो जाने पर इस संरचना के आधार पर वास्तविक डेटा लोड करने की तैयारी पूरी हो जाती है। Content Type के बारे में विस्तृत जानकारी Content मॉडलिंग में दी गई है।

कंटेंट निर्माण

Content Type केवल डेटा का स्वरूप परिभाषित करता है, उसमें स्वयं कोई डेटा नहीं होता। इस चरण में हम पहले परिभाषित किए गए Content Type के आधार पर, पेज के कोड में लिखे वास्तविक डेटा को Content के रूप में स्थानांतरित करते हैं।

LLM एजेंट से नीचे दिए अनुसार अनुरोध करने पर वह कोड के डेटा का विश्लेषण करके Content Type के अनुरूप Content बनाता है और प्रकाशन तक का काम साथ में संभाल लेता है।

Alright, the content types look good. Now let's move on to actually loading
the data.
 
Could you go through project again, pull out the actual content
that's hardcoded in there, and create entries in Weegloo using the content
types we just made? Once everything's in, go ahead and publish them too
so they're ready to be served.

अनुरोध मिलने पर LLM एजेंट कोड का फिर से विश्लेषण करके डेटा को मद-दर-मद बाँटता है, और फिर WEEGLOO MCP से API की जानकारी और प्रत्येक एंडपॉइंट की जानकारी क्रमवार पंजीकृत करता है। पंजीकृत Content को बाहर से प्राप्त किया जा सके, इसके लिए साथ ही प्रकाशित भी कर दिया जाता है।

काम पूरा होने के बाद WEEGLOO कंटेंट स्टूडियो की Content सूची को देखें तो API की जानकारी और एंडपॉइंट की जानकारी, दोनों प्रकाशित स्थिति में पंजीकृत मिलती हैं। इस बिंदु से आगे पेज के कोड को सीधे बदले बिना भी, कंटेंट स्टूडियो या LLM एजेंट से डेटा को स्वतंत्र रूप से बदला जा सकता है।

Content के निर्माण और प्रकाशन के बारे में विस्तृत जानकारी Content लेखन और प्रकाशन में दी गई है।

CDA इंटीग्रेशन

डेटा भी तैयार हो जाने पर, इस बार हम कोड में ऐसा बदलाव करते हैं कि पेज कोड में सीधे लिखे डेटा के बजाय WEEGLOO के CDA से डेटा प्राप्त करे। CDA एक रीड-ओनली API है जो प्रकाशित Content को बाहरी सेवाओं से प्राप्त करने के लिए उपलब्ध कराया गया है, और यह वेब पेज या मोबाइल ऐप को WEEGLOO का डेटा सीधे प्राप्त करके उपयोग करने में सक्षम बनाता है।

यह काम भी LLM एजेंट से नीचे दिए अनुसार अनुरोध करने पर स्वतः हो जाता है।

Okay, almost there. The content's all in Weegloo and published, so now
let's hook the page up to actually use it.
 
Could you update project so that instead of having all that data
hardcoded in the markup, it fetches from Weegloo's CDA on load and
renders the page from the response? Basically the same page as before,
just pulling from the API now.

अनुरोध मिलने पर LLM एजेंट कोड में जड़े हुए स्टैटिक डेटा को हटा देता है, और उसकी जगह CDA कॉल तथा प्रतिक्रिया के डेटा को स्क्रीन पर दर्शाने वाला कोड भर देता है। जहाँ एंडपॉइंट की जानकारी थी, वहाँ एंडपॉइंट Content की सूची प्राप्त करने वाला CDA कॉल आता है, और जहाँ API की जानकारी थी, वहाँ API Content को एकल रूप में प्राप्त करने वाला कॉल आता है।

बदले हुए पेज को लोकल पर चलाने के बाद ब्राउज़र के डेवलपर टूल के Network टैब को देखें तो आप देख सकते हैं कि पेज लोड होते समय WEEGLOO के CDA को वास्तविक अनुरोध भेजा जाता है और प्रतिक्रिया प्राप्त होती है। CDA के बारे में विस्तृत जानकारी Content Delivery API में दी गई है।

वेब होस्टिंग

अंतिम चरण है अब तक बनाए गए पेज को बाहरी रूप से प्रकाशित करना। WEEGLOO पेज को सीधे होस्ट करने के लिए Web Hosting सुविधा प्रदान करता है। इसके माध्यम से आप अलग से होस्टिंग इन्फ्रास्ट्रक्चर खुद बनाए बिना ही, पूर्ण पेज को ऐसी स्थिति में प्रकाशित कर सकते हैं जहाँ उस तक कोई भी पहुँच सके।

LLM एजेंट से नीचे दिए अनुसार अनुरोध करें।

Last thing — let's get this live.
 
Could you set up a WebHosting in Weegloo for this project and deploy the
page to it?

अनुरोध मिलने पर LLM एजेंट पेज के बिल्ड परिणाम को Web Hosting पर अपलोड करता है, और स्वतः जारी होने वाले सबडोमेन के माध्यम से पेज को इस तरह डिप्लॉय करता है कि उस तक बाहर से पहुँचा जा सके।

डिप्लॉयमेंट पूरा होने पर जारी किए गए सबडोमेन पते से कहीं से भी पेज तक पहुँचा जा सकता है। इस बिंदु से आगे आप केवल WEEGLOO कंटेंट स्टूडियो में Content को बदल दें, तो अलग से बिल्ड या दोबारा डिप्लॉय किए बिना ही बदली हुई सामग्री तुरंत लाइव साइट पर प्रतिबिंबित हो जाती है। नया एंडपॉइंट जुड़ना या किसी मौजूदा एंडपॉइंट का विवरण बदलना जैसे, API डॉक्यूमेंट संचालन में अक्सर होने वाले काम भी कोड में बदलाव किए बिना निपटाए जा सकते हैं।

आगे संचालन के चरण में यदि आप अपना खुद का डोमेन उपयोग करना चाहें, तो WEEGLOO कंटेंट स्टूडियो में Custom Domain जोड़ सकते हैं। Web Hosting और Custom Domain के बारे में विस्तृत जानकारी वेबसाइट डिप्लॉयमेंट में दी गई है।

यहाँ तक हमने खाली स्थिति से शुरुआत करके डिज़ाइन और इम्प्लीमेंटेशन, कंटेंट प्रबंधन तथा डिप्लॉयमेंट तक की पूरी प्रक्रिया को केवल LLM एजेंट और WEEGLOO के साथ पूरा किया। यही प्रवाह अधिक जटिल साइटों पर भी वैसे ही लागू किया जा सकता है, और संचालन के दौरान नया Content Type जोड़ना या Content की मात्रा बढ़ाना जैसे काम भी इसी तरीके से स्वाभाविक रूप से आगे जारी रखे जा सकते हैं।