Gemini 3.1 Pro के साथ बिल्डिंग: अल्टीमेट कोडिंग एजेंट ट्यूटोरियल

Gemini 3.1 Pro Google का तर्क, कोडिंग, और मल्टीमॉडल समझ के लिए सबसे एडवांस्ड फाउंडेशन मॉडल है। यह Gemini 3 सीरीज पर आधारित है और लंबे कॉन्टेक्स्ट में बेहतर प्रदर्शन, उन्नत टूल उपयोग, और अधिक भरोसेमंद स्टेप-बाय-स्टेप रीजनिंग प्रदान करता है। 

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

इस अल्टीमेट गाइड में, मैं आपको एजेंटिक कोडिंग के लिए Gemini 3.1 Pro का सर्वोत्तम उपयोग दिखाऊँगा। आप सीखेंगे कि नए Gemini CLI को कैसे इंस्टॉल और कॉन्फ़िगर करें, एक्सटेंशन सेटअप करें, कस्टम स्किल्स बनाएँ, और Tinder for Geeks नामक ऐप को वाइब-कोड करें। मैं यह भी दिखाऊँगा कि पर्सिस्टेंट कॉन्टेक्स्ट कैसे बनाएँ, मेमोरी में बदलाव करें, विश्वसनीयता और गार्डरेल्स जोड़ें, अपने ऐप का लोकल परीक्षण करें, और उसे क्लाउड पर डिप्लॉय करें।

मैं Google के नवीनतम इमेज जनरेशन मॉडल, Nano Banana 2, पर हमारी गाइड भी देखने की सिफारिश करता हूँ।

Gemini 3.1 Pro एजेंटिक स्टैक

एजेंटिक कोडिंग के लिए Gemini 3.1 Pro का उपयोग करने के चार मुख्य तरीके हैं। सही विकल्प आपके अनुभव स्तर और आपके टेक स्टैक व वर्कफ़्लो पर नियंत्रण की आवश्यकता पर निर्भर करता है।

1. Google AI Studio Build: ब्राउज़र-आधारित गाइडेड बिल्डर जो Gemini 3.1 Pro के साथ तेज़ी से प्रोटोटाइपिंग और वाइब कोडिंग के लिए है।
2. VS Code के लिए Gemini Code Assist: इन-एडिटर AI कोडिंग असिस्टेंट जो एजेंट-स्टाइल वर्कफ़्लोज़ को सीधे आपके IDE में लाता है।
3. Google Antigravity: एंड-टू-एंड स्वायत्त एजेंट-ड्रिवन कोडिंग के लिए डिज़ाइन किया गया पूर्ण AI नेटिव डेवलपमेंट एन्वायरनमेंट।
4. Gemini CLI: एक शक्तिशाली टर्मिनल-आधारित एजेंट जो आपको कॉन्टेक्स्ट, मेमोरी, कस्टम स्किल्स और वर्कफ़्लोज़ पर पूर्ण नियंत्रण देता है।

1. Google AI Studio Build

Build मोड Google AI Studio में शुरुआती और गैर-विशेषज्ञों के लिए सबसे तेज़ ऑन-रैम्प है। आप प्राकृतिक भाषा का उपयोग करके फुल-स्टैक ऐप्स को “वाइब कोड” कर सकते हैं, जिसमें फुल-स्टैक रनटाइम्स, सर्वर-साइड लॉजिक, सीक्रेट्स मैनेजमेंट और npm पैकेजों का समर्थन है। यह तब आदर्श है जब आप पूर्ण लोकल डेवलपमेंट सेटअप पर कमिट करने से पहले ब्राउज़र में तेजी से प्रोटोटाइप बनाना चाहते हैं।

2. VSCode एक्सटेंशंस

यदि आप VS Code में सहज हैं, तो Gemini Code Assist आपको एक एजेंट मोड देता है जो कोड जेनरेट कर सकता है, प्रश्नों का उत्तर दे सकता है, और खुले फ़ाइलों व समर्पित कॉन्टेक्स्ट फ़ाइलों जैसे IDE कॉन्टेक्स्ट का उपयोग कर सकता है। 

यदि आप अधिक लचीले मल्टी-मॉडल सेटअप चाहते हैं, तो Kilo Code जैसे टूल VS Code के अंदर चल सकते हैं और आपको Gemini 3.1 Pro सहित मॉडलों की ओर रूट करने देते हैं, फिर अपने एडिटर के भीतर एजेंट-स्टाइल वर्कफ़्लोज़ के साथ इटरेट करने देते हैं।

3. Google Antigravity

Antigravity Google का एजेंट-फर्स्ट डेवलपमेंट प्लेटफ़ॉर्म है जो एक परिचित IDE अनुभव को “मिशन कंट्रोल” शैली के मैनेजर के साथ जोड़ता है ताकि स्वायत्त एजेंटों का समन्वय किया जा सके। यह एंड-टू-एंड टास्क्स के लिए डिज़ाइन किया गया है, जहाँ एजेंट प्लान करता है, कोड लिखता है, चेक चलाता है, और ऐसे सत्यापनीय आर्टिफैक्ट्स तैयार करता है जिन्हें आप रिव्यू कर सकते हैं। 

इसे तब चुनें जब आप चैट पैनल को एडिटर पर जोड़ने की बजाय एजेंटों के इर्द-गिर्द बना हुआ एक पूर्ण एकीकृत IDE चाहते हैं।

4. Gemini CLI

Gemini CLI Gemini को सीधे आपके टर्मिनल में एक ओपन सोर्स एजेंट के रूप में लाता है, ताकि आप वास्तविक रेपो पर काम कर सकें, फ़ाइलें संपादित कर सकें, वर्कफ़्लोज़ ऑटोमेट कर सकें, और सब कुछ अपने लोकल टूलिंग के करीब रख सकें। 

यह तब सबसे अच्छा विकल्प है जब आप इस पर सूक्ष्म नियंत्रण चाहते हैं कि मॉडल कौन-सा कॉन्टेक्स्ट देख सकता है, कौन-से टूल चला सकता है, मेमोरी का व्यवहार कैसा हो, और आप इसे नए टूल्स व इंटेग्रेशन से कैसे विस्तार दें। यह Gemini Code Assist कोटा से भी जुड़ता है और इस बात पर निर्भर करते हुए अलग-अलग ऑथ विकल्पों का समर्थन करता है कि आप इसे कहाँ चलाते हैं। 

Gemini 3.1 Pro के लिए अपना डेवलपमेंट एन्वायरनमेंट तैयार करना

एक उचित एजेंटिक कोडिंग सेटअप के लिए, हम Gemini CLI का उपयोग करेंगे क्योंकि यह हमें कॉन्टेक्स्ट, परमिशन, मेमोरी, एक्सटेंशंस, स्किल्स, टेस्टिंग और डिप्लॉयमेंट वर्कफ़्लोज़ पर पूर्ण नियंत्रण देता है। 

ब्राउज़र-ओनली बिल्डर्स के विपरीत, Gemini CLI सीधे आपके लोकल डेवलपमेंट एन्वायरनमेंट में चलता है, जिससे आप वास्तविक रिपॉज़िटरीज़ पर काम कर सकते हैं, फ़ाइलों का प्रबंधन कर सकते हैं, और टूल्स को प्रोडक्शन-रेडी तरीके से इंटीग्रेट कर सकते हैं।

इस सेक्शन में, हम Gemini CLI इंस्टॉल करेंगे, उसे ऑथेंटिकेट करेंगे, मॉडल को Gemini 3.1 Pro पर कॉन्फ़िगर करेंगे, एक्सटेंशंस मार्केटप्लेस को एक्सप्लोर करेंगे, आवश्यक एक्सटेंशंस इंस्टॉल करेंगे, और फिर अपनी टेक स्टैक के अनुरूप कस्टम स्किल्स बनाएँगे। 

यह सुनिश्चित करता है कि एजेंट शुरू से ही हमारी आर्किटेक्चर, कोडिंग स्टैंडर्ड्स और डिप्लॉयमेंट टार्गेट्स को समझे।

एजेंटिक डेवलपमेंट के लिए Gemini CLI इंस्टॉल और ऑथेंटिकेट करें 

Gemini CLI इंस्टॉल करने से पहले, सुनिश्चित करें कि आपके पास यह हैं:

• Node.js संस्करण 20 या उससे अधिक
• npm ठीक से इंस्टॉल किया हुआ
• बिलिंग सक्षम के साथ Google Cloud अकाउंट
• Gemini API के माध्यम से Gemini 3.1 Pro तक पहुँच

Gemini CLI को ग्लोबली इंस्टॉल करें:

npm install -g @google/gemini-cliसंचालित द्वारा

अपना प्रोजेक्ट फ़ोल्डर बनाएँ और उसमें जाएँ:

mkdir love-geek
cd love-geekसंचालित द्वारा

Gemini CLI लॉन्च करें:

gemini संचालित द्वारा

पहली बार लॉन्च पर, अपने Google अकाउंट या API कुंजी का उपयोग करके ऑथेंटिकेट करें। यदि आप API कुंजी ऑथेंटिकेशन का उपयोग कर रहे हैं, तो सुनिश्चित करें कि यह आपके एन्वायरनमेंट वेरियेबल्स में ठीक से कॉन्फ़िगर है। Google Cloud में बिलिंग सक्षम रखें ताकि आप Gemini 3.1 Pro तक बिना रुकावट पहुँच सकें।

शुरुआत में हमारा Gemini CLI ऐसा दिखता है। 

Gemini CLI के अंदर, “/model” टाइप करें। इससे मॉडल चयन मेन्यू खुलता है। मैनुअल चयन विकल्प चुनें और उपलब्ध सूची में से नवीनतम Gemini 3.1 Pro प्रीव्यू मॉडल का चयन करें।

सही मॉडल चुनना बहुत महत्वपूर्ण है। एजेंटिक वर्कफ़्लोज़ लंबे कॉन्टेक्स्ट हैंडलिंग, टूल उपयोग और संरचित रीजनिंग पर बहुत निर्भर करते हैं, जो Gemini 3.1 Pro में सबसे मजबूत हैं।

एक्सटेंशंस के साथ Gemini CLI को बढ़ाएँ

Gemini CLI में एक्सटेंशन मार्केटप्लेस शामिल है, जो अवधारणा में VS Code एक्सटेंशंस जैसा है। एक्सटेंशंस आपको MCP सर्वर्स, रिट्रीवल टूल्स, बाहरी APIs, और उन्नत कॉन्टेक्स्ट सिस्टम जोड़ने देते हैं ताकि आपका एजेंट केवल साधारण प्रॉम्प्ट कम्प्लीशन से आगे बढ़कर ऑपरेट कर सके।

हमारे स्टैक के लिए, हम इंस्टॉल करेंगे:

1. Exa MCP Server एडवांस्ड वेब और रिपॉज़िटरी सर्च के लिए
2. Context7 आधुनिक टेक स्टैक्स के लिए अप-टू-डेट डॉ큐मेंटेशन रिट्रीवल के लिए

इन्हें इंस्टॉल करें:

gemini extensions install https://github.com/exa-labs/exa-mcp-server
gemini extensions install https://github.com/upstash/context7संचालित द्वारा

इंस्टॉल होने के बाद, Gemini CLI को रीस्टार्ट करें:

gemini संचालित द्वारा

अब आपको अपने एन्वायरनमेंट में अतिरिक्त MCP सर्वर्स और स्किल्स लोडेड दिखेंगे। ये टूल्स एजेंट को वेब सर्च करने, GitHub रिपॉज़िटरीज़ रिट्रीव करने, और नवीनतम डॉ큐मेंटेशन को सीधे अपनी रीजनिंग कॉन्टेक्स्ट में खींचने देते हैं।

वेब एप्लिकेशन के लिए कस्टम स्किल्स बनाएँ 

इंस्टॉल किए गए एक्सटेंशंस सामान्य प्रयोजन के हैं। प्रोडक्शन-रेडी एप्लिकेशन बनाने के लिए, हमें प्रोजेक्ट-विशिष्ट स्किल्स चाहिए जो हमारे सटीक स्टैक के लिए बेस्ट प्रैक्टिसेज़ एन्कोड करें।

हमारा स्टैक:

• Next.js App Router
• Tailwind CSS + shadcn/ui
• Drizzle ORM के साथ Neon Postgres
• Clerk ऑथेंटिकेशन
• Vitest
• Vercel डिप्लॉयमेंट

मॉड्यूलर कस्टम स्किल्स जनरेट करने के लिए Gemini CLI के अंदर निम्नलिखित प्रॉम्प्ट का उपयोग करें:

Generate the following skills:

1. nextjs-app-router-skill (enforce App Router + Server Components best practices)
2. drizzle-neon-skill (schema, migrations, relations, Neon connection)
3. clerk-auth-skill (middleware, protected routes, secure server-side auth)
4. vitest-testing-skill (unit tests for core logic and edge cases)
5. vercel-deploy-skill (env setup and production deployment rules)"
संचालित द्वारा

सबमिट करने पर, Gemini 3.1 Pro संरचित स्किल डेफिनिशंस जनरेट करेगा। इसके बाद यह आपको उन्हें लोकली इंस्टॉल करने के लिए प्रॉम्प्ट करेगा।

प्रत्येक इंस्टॉलेशन को अप्रूव करें। जब परमिशन के लिए प्रॉम्प्ट आए, तो Shift + Tab दबाकर फोकस टर्मिनल पर लाएँ और “Y” टाइप करें। यह सभी पाँच स्किल्स के लिए दोहराएँ।

इंस्टॉल के बाद, Gemini CLI के भीतर “/skills reload” टाइप करके स्किल्स को रीलोड करें। 

वेरिफाई करने के लिए, “/skills list” टाइप करें। आपको अपनी सभी कस्टम स्किल्स सूचीबद्ध दिखेंगी। यह पुष्टि करता है कि स्किल सफलतापूर्वक जोड़ी गई।

इस बिंदु पर, आपका Gemini 3.1 Pro एजेंट अब जेनेरिक नहीं है। यह आपके स्टैक, आपके डाटाबेस नियमों, आपके ऑथेंटिकेशन कन्स्ट्रेंट्स, आपके टेस्टिंग फ्रेमवर्क, और आपके डिप्लॉयमेंट टार्गेट को समझता है।

हैंड्स-ऑन प्रोजेक्ट: Gemini 3.1 Pro का उपयोग करके “Tinder for Geeks” बनाना

अब हम Gemini 3.1 Pro में पूर्ण एजेंटिक मोड का उपयोग करते हुए एक संपूर्ण एंड-टू-एंड प्रोडक्शन-रेडी Tinder for Geeks एप्लिकेशन की योजना बनाएँगे और बनाएँगे। यह कोई खिलौना डेमो नहीं है। हम आर्किटेक्चर डिज़ाइन करेंगे, स्कीमा जनरेट करेंगे, मैचिंग इंजन लागू करेंगे, ऑथेंटिकेशन जोड़ेंगे, कोर लॉजिक का परीक्षण करेंगे, और उचित प्रोडक्शन स्टैंडर्ड्स के साथ Vercel पर डिप्लॉय करेंगे।

1. ऐप बनाने के लिए प्रारम्भिक प्रॉम्प्ट

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

निम्नलिखित टाइप करें:

Build a production-ready MVP called "Tinder for Geeks".

App Requirements:
- Swipe-based profile browsing (like / dislike)
- Mutual likes create a match
- Matches page
- Authenticated users only
- Clean modern UI using Tailwind + shadcn/ui

Tech Stack (do not change):
- Next.js App Router (TypeScript)
- Server Actions + Route Handlers
- Postgres on Neon
- Drizzle ORM with migrations
- Clerk authentication
- Vitest for unit testing
- Deployment-ready for Vercel

Execution Rules:
1. Show folder structure first.
2. Generate database schema and migrations.
3. Implement API logic and matching engine.
4. Build swipe UI.
5. Add protected routes.
6. Generate unit tests for matching logic.
7. Provide an environment variable checklist for Vercel deployment.

Keep explanations minimal.
Focus on clean, modular, production-ready code.
Validate each step before moving to the next.संचालित द्वारा

प्रॉम्प्ट सबमिट करने पर, Gemini 3.1 Pro तुरंत रैंडम फाइलें जनरेट करना शुरू नहीं करेगा। वह पहले संपूर्ण प्रोजेक्ट स्ट्रक्चर पर विचार करेगा और तय करेगा कि कौन-सी स्टैक-विशिष्ट स्किल्स सक्रिय होनी चाहिए। 

क्योंकि हमने पहले से कस्टम स्किल्स इंस्टॉल की हैं, CLI स्वतः ही Next.js App Router स्किल या Drizzle ORM स्किल जैसे मॉड्यूल सक्षम करने का सुझाव दे सकता है।

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

यदि आप तेज़ वर्कफ़्लो पसंद करते हैं और हर एक्टिवेशन या फ़ाइल राइट को मैन्युअली अप्रूव नहीं करना चाहते, तो आप CTRL + Y दबाकर YOLO मोड में स्विच कर सकते हैं।

YOLO मोड में, एजेंट बिना कन्फर्मेशन प्रॉम्प्ट्स के आगे बढ़ता है। यह तेज़ प्रोटोटाइपिंग के लिए उपयोगी है, लेकिन प्रोडक्शन रिपॉज़िटरीज़ में, जहाँ फ़ाइल परिवर्तन और परमिशन्स पर कड़ा नियंत्रण चाहिए, इसे सावधानी से उपयोग करें।

अंत में, Gemini CLI एक संरचित सारांश प्रदान करता है जिसमें शामिल हैं:

• बनी हुई फाइलें
• लागू की गई विशेषताएँ
• डाटाबेस स्कीमा डेफिनिशंस
• API एंडपॉइंट्स
• आवश्यक एन्वायरनमेंट वेरियेबल्स

यह Vercel डिप्लॉयमेंट चेकलिस्ट भी जनरेट करेगा ताकि आपको ठीक-ठीक पता हो कि डिप्लॉय करने से पहले किन API कुंजियों और एन्वायरनमेंट वेरियेबल्स को कॉन्फ़िगर करना है।

2. कॉन्टेक्स्ट और मेमोरी को पर्सिस्ट करें

अब हम /init कमांड का उपयोग करके एक पर्सिस्टेंट प्रोजेक्ट मेमोरी बनाकर एजेंट को स्टेटफुल बनाएँगे।

यह आपके प्रोजेक्ट रूट में एक GEMINI.md फ़ाइल जनरेट करता है। यह फ़ाइल एजेंट के लिए एक लिविंग मेमोरी की तरह काम करती है। यह आपके प्रोजेक्ट स्ट्रक्चर, टेक स्टैक, कन्वेंशन्स, बिल्ड कमांड्स, टेस्ट कमांड्स और डिप्लॉयमेंट निर्देशों का सारांश देती है।

इसके बाद, हम चाहते हैं कि Gemini एक अनुशासित इंजीनियर की तरह व्यवहार करे, न कि एक साधारण कोड जनरेटर की तरह। मेमोरी में निम्नलिखित निर्देश जोड़ें:

“हर बड़े बदलाव के बाद, स्वतः ही संबंधित फ़ाइलों को स्टेज करें, टाइप्स और टेस्ट्स को वैलिडेट करें, फिर conventional commit फॉर्मेट में छोटा और एटोमिक git कमिट बनाएँ, कभी भी सीक्रेट्स कमिट न करें, और आगे बढ़ने से पहले कमिट संदेश दिखाएँ।”

यह लागू करता है:

• साफ़-सुथरे इनक्रिमेंटल कमिट्स
• टाइप सेफ़्टी वैलिडेशन
• बदलाव फ़ाइनल करने से पहले टेस्ट वेरिफिकेशन
• उचित कमिट हाइजीन

अब एजेंट हर फीचर जोड़ने के बाद स्वतः एक प्रोफ़ेशनल Git वर्कफ़्लो फॉलो करेगा।

हम यह भी चाहते हैं कि एजेंट GitHub CLI का उपयोग करके रिपॉज़िटरी पब्लिशिंग और CI वैलिडेशन संभाले।

मेमोरी में यह जोड़ें:

“मेमोरी अपडेट करें: यदि यह रिपॉज़िटरी अभी तक प्रकाशित नहीं है तो GitHub CLI (gh) का उपयोग करके इसे प्रकाशित करना याद रखें, सभी कमिट्स को मेन ब्रांच पर पुश करें, और फिर वर्तमान GitHub Actions वर्कफ़्लो स्टेटस की जाँच कर रिपोर्ट करें।”

यह सुनिश्चित करता है:

• रिपॉज़िटरी स्वतः प्रकाशित हो जाए
• सभी कमिट्स लगातार पुश हों
• हर अपडेट के बाद CI स्टेटस जाँचा जाए
• यदि कोई वर्कफ़्लो फेल हो तो आपको सूचित किया जाए

अब आपका Gemini 3.1 Pro एजेंट स्टेटलेस नहीं रहा। यह आपके प्रोजेक्ट को समझता है, इंजीनियरिंग अनुशासन का पालन करता है, Git को सही से मैनेज करता है, और CI पर नज़र रखता है। यहीं एजेंटिक कोडिंग वास्तव में शक्तिशाली हो जाती है।

3. विश्वसनीयता और गार्डरेल्स जोड़ें

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

अब हम Gemini 3.1 Pro को सिस्टम को हार्डन करने का निर्देश देंगे।

Gemini CLI के अंदर निम्नलिखित कमांड का उपयोग करें:

“इनपुट वैलिडेशन लागू करके, उचित एरर हैंडलिंग, API रूट्स पर रेट लिमिटिंग, सर्वर पर सुरक्षित Clerk ऑथ वेरिफिकेशन, डुप्लिकेट एक्शंस से सुरक्षा, क्रिटिकल फ़्लोज़ के लिए लॉगिंग, और ब्रेकिंग API परिवर्तनों की रोकथाम के माध्यम से इस प्रोजेक्ट में विश्वसनीयता और गार्डरेल्स जोड़ें।”

4. एन्वायरनमेंट वेरियेबल्स कॉन्फ़िगर करें और लोकली वैलिडेट करें

अब हम अपने एप्लिकेशन को वास्तविक प्रोडक्शन सेवाओं से जोड़ेंगे। हम ऑथेंटिकेशन के लिए Clerk और एक पूर्ण-प्रबंधित Postgres डाटाबेस के लिए Neon का उपयोग कर रहे हैं। यह चरण हमारे जेनरेटेड कोड को एक कार्यशील फुल-स्टैक सिस्टम में बदल देता है।

यहाँ जाएँ clerk.com और एक निःशुल्क अकाउंट बनाएँ।

डैशबोर्ड से एक नया एप्लिकेशन बनाएँ। Clerk स्वतः जेनरेट करेगा:

• पब्लिशेबल कुंजी
• सीक्रेट कुंजी

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

अगला, neon.tech पर जाएँ और एक निःशुल्क अकाउंट बनाएँ।

एक नया प्रोजेक्ट बनाएँ। Neon आपके लिए एक प्रबंधित Postgres डाटाबेस प्रोविजन करेगा।

प्रोजेक्ट बनने के बाद:

• डैशबोर्ड खोलें
• कनेक्शन स्ट्रिंग ढूँढें
• पूर्ण Postgres कनेक्शन URL कॉपी करें

यह URL Drizzle ORM द्वारा आपके डाटाबेस से कनेक्ट करने के लिए उपयोग किया जाएगा।

दिए गए .env.example फ़ाइल को टेम्पलेट के रूप में उपयोग करें। एक नई फ़ाइल .env.local बनाएँ।

प्लेसहोल्डर वैल्यूज़ को निम्न से बदलें:

• Clerk पब्लिशेबल कुंजी
• Clerk सीक्रेट कुंजी
• Neon डाटाबेस कनेक्शन स्ट्रिंग

सुनिश्चित करें कि आप कभी भी .env.local Git में कमिट न करें।

एक बार जब आपके एन्वायरनमेंट वेरियेबल्स कॉन्फ़िगर हो जाएँ, तो Gemini CLI पर लौटें और टाइप करें:

“मैंने एन्वायरनमेंट वेरियेबल्स में Clerk और Neon API कुंजियाँ जोड़ दी हैं। कृपया एप्लिकेशन को लोकली चलाएँ, डाटाबेस कनेक्टिविटी वेरिफाई करें, ऑथेंटिकेशन फ़्लो टेस्ट करें, और किसी भी त्रुटि की रिपोर्ट करें।”

अब Gemini 3.1 Pro को यह करना चाहिए:

• डेवलपमेंट सर्वर शुरू करना
• डाटाबेस माइग्रेशंस चलाना
• Neon कनेक्टिविटी की पुष्टि करना
• Clerk सेशन हैंडलिंग को वैलिडेट करना
• प्रोटेक्टेड रूट्स का परीक्षण करना
• किसी भी रनटाइम एरर की रिपोर्ट करना

यदि सब कुछ सही कॉन्फ़िगर हुआ, तो CLI आपको http://localhost:3000 जैसा एक लोकल डेवलपमेंट URL प्रदान करेगा।

URL (http://localhost:3000) को अपने ब्राउज़र में खोलें। 

“Create Account” पर क्लिक करें और सबसे तेज़ सेटअप के लिए Google साइन-इन का उपयोग करें।

ऑथेंटिकेशन के बाद, अपना प्रोफ़ाइल नाम, बायो और डिस्प्ले इमेज के साथ पूरा करें।

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

कुछ ही मिनटों में, अब आपके पास लोकली चलने वाला एक पूरी तरह से कार्यात्मक, ऑथेंटिकेटेड, डाटाबेस-बैक्ड वेब एप्लिकेशन है।

यह Gemini 3.1 Pro के साथ एजेंटिक कोडिंग की ताकत है। जो सामान्यतः सेटअप और डीबगिंग में घंटों लेता है, वह एक संरचित, गाइडेड वर्कफ़्लो में सिमट जाता है जो जल्दी और भरोसेमंद रूप से एक कार्यशील, डिप्लोयेबल एप्लिकेशन तैयार करता है।

5. Vercel के साथ प्रोडक्शन में डिप्लॉय करें

अब जब ऐप लोकली काम कर रहा है, तो इसे प्रोडक्शन में डिप्लॉय करने का समय है। चूँकि हमने पहले Git ऑटोमेशन कॉन्फ़िगर किया है, डिप्लॉयमेंट सीधा हो जाता है।

पहले, Gemini CLI को निर्देश दें:

“सभी बदलावों को GitHub पर कमिट और पुश करें।”

यह सुनिश्चित करता है:

• सभी लोकल बदलाव सही से कमिट हों
• कोई सीक्रेट शामिल न हो
• मेन ब्रांच अप टू डेट हो
• रिपॉज़िटरी डिप्लॉयमेंट के लिए तैयार हो

अब आपकी रिपॉज़िटरी GitHub पर उपलब्ध होनी चाहिए kingabzpro/love-geek।

यहाँ जाएँ https://vercel.com और एक निःशुल्क अकाउंट बनाएँ। प्रॉम्प्ट आने पर अपना GitHub अकाउंट कनेक्ट करें। Vercel सीधे GitHub रिपॉज़िटरीज़ से इंटीग्रेट होता है और हर पुश पर ऑटोमैटिक डिप्लॉयमेंट्स की अनुमति देता है।

कनेक्ट होने के बाद:

• “Add New Project” पर क्लिक करें
• love-geek रिपॉज़िटरी चुनें
• प्रोजेक्ट इम्पोर्ट करें

Vercel स्वतः पहचान लेगा कि यह Next.js एप्लिकेशन है और बिल्ड सेटिंग्स को उसी अनुसार कॉन्फ़िगर करेगा।

डिप्लॉय करने से पहले, Environment Variables सेक्शन तक स्क्रॉल करें।

“Import .env” पर क्लिक करें या मैन्युअली जोड़ें:

• Clerk पब्लिशेबल कुंजी
• Clerk सीक्रेट कुंजी
• Neon डाटाबेस URL
• कोई भी अतिरिक्त एन्वायरनमेंट वेरियेबल्स जो लोकली उपयोग हुए

सुनिश्चित करें कि सभी प्रोडक्शन एन्वायरनमेंट वेरियेबल्स आपके .env.local वैल्यूज़ से मेल खाते हों।

Deploy पर क्लिक करें।

Vercel यह करेगा:

• डिपेंडेंसीज़ इंस्टॉल करना
• Next.js प्रोजेक्ट को बिल्ड करना
• प्रोडक्शन बिल्ड चलाना
• डिप्लॉयमेंट प्रोविजन करना

पूरा होने पर, आपका एप्लिकेशन यहाँ लाइव होगा https://love-geek.vercel.app.

लाइव URL खोलें और इनका परीक्षण करें:

• ऑथेंटिकेशन फ़्लो
• प्रोफ़ाइल क्रिएशन
• स्वाइप फ़ंक्शनैलिटी
• मैच क्रिएशन
• प्रोटेक्टेड रूट्स

यदि सब कुछ काम कर रहा है, तो अब आपके पास प्रोडक्शन में चलने वाला, ऑथेंटिकेटेड, डाटाबेस-बैक्ड वेब एप्लिकेशन है।

आइडिया से लेकर डिप्लॉयड प्रोडक्ट तक, 30 मिनट से भी कम में।

अब, जब भी आप GitHub पर नए फीचर्स पुश करेंगे, Vercel आपके एप्लिकेशन को स्वतः फिर से डिप्लॉय करेगा। स्ट्रक्चर, मेमोरी और गार्डरेल्स को मैनेज करता Gemini 3.1 Pro होने के साथ, आप आत्मविश्वास से फीचर्स जोड़ना जारी रख सकते हैं और इसे कुछ दिनों में प्रोडक्शन-रेडी स्टार्टअप फ़ाउंडेशन में विकसित कर सकते हैं।

अंतिम विचार

यदि आप मुझसे ईमानदारी से पूछें, तो मैं पहले बिल्ड से वास्तव में प्रभावित था। ऐप एंड-टू-एंड काम कर रहा था—ऑथेंटिकेशन, डाटाबेस इंटीग्रेशन, स्वाइप लॉजिक, और डिप्लॉयमेंट—सब कुछ एक संरचित तरीके से हैंडल हुआ। टेस्टिंग के दौरान कुछ छोटे गैप थे, जैसे स्वाइप फ़ंक्शनैलिटी को ठीक से टेस्ट करने के लिए अस्थायी सीड प्रोफाइल्स का मैन्युअल अनुरोध करना। यह मॉडल की सीमा नहीं थी, बस मुझे इसे और स्पष्ट रूप से बताना चाहिए था।

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

इसके आसपास का इकोसिस्टम बड़ा फ़र्क़ पैदा करता है। Gemini CLI, कस्टम स्किल्स, एक्सटेंशंस, पर्सिस्टेंट मेमोरी, और YOLO मोड का संयोजन एक शक्तिशाली डेवलपमेंट वर्कफ़्लो बनाता है। मेमोरी सिस्टम ने बार-बार की जाने वाली व्याख्याओं को घटाया, कस्टम स्किल्स ने आर्किटेक्चरल अनुशासन लागू कराया, और एक्सटेंशंस ने डॉ큐मेंटेशन व सर्च की सटीकता सुधारी।

लागत की दृष्टि से, इस फुल-स्टैक एप्लिकेशन का निर्माण, डीबगिंग और डिप्लॉयमेंट करने में मुझे API उपयोग में लगभग 5 डॉलर लगे। उच्च-स्तरीय कोडिंग मॉडलों की तुलना में, यह काफ़ी वाजिब है। 

मैंने उन सीमित फ्री टियर्स या सब्सक्रिप्शन-आधारित कोडिंग प्लेटफ़ॉर्म्स पर निर्भर न रहने का भी विकल्प चुना जो अक्सर डिसकनेक्ट होते हैं या उपयोग पर प्रतिबंध लगाते हैं। स्थिर, उच्च-गुणवत्ता के अनुभव के लिए भुगतान करना सार्थक था।

कुल मिलाकर, यह सिर्फ़ ऐप बनाना नहीं था। यह एजेंटिक डेवलपमेंट में सीखने का अनुभव था। मेमोरी को मैनेज करना, कस्टम स्किल्स बनाना, Gemini एक्सटेंशंस का उपयोग करना, और रणनीतिक रूप से YOLO मोड में स्विच करना—इन सबने मेरे AI-एसिस्टेड इंजीनियरिंग के दृष्टिकोण को बदल दिया।

मैं इस वर्कफ़्लो की सिफारिश किसी भी व्यक्ति को करूँगा, खासकर वाइब कोडर्स को जो त्वरित प्रोटोटाइप से आगे बढ़कर संरचित, प्रोडक्शन-रेडी एप्लिकेशन तेज़ी से और कम डीबगिंग सिरदर्द के साथ बनाना चाहते हैं।

यदि आप एजेंटिक AI के साथ बिल्डिंग के बारे में और सीखने के इच्छुक हैं, तो मैं Designing Agentic Systems with LangChain कोर्स देखने की सिफारिश करता हूँ।