बधाई हो!
Next.js वेबसाइट डेवलपमेंट एनवायरनमेंट तैयार है
इंस्टॉल किए गए टूल्स
आपके PC पर बना प्रोजेक्ट स्ट्रक्चर
📁 ~/my-first-app/ ├── 📂 public/ ← इमेज, आइकन ├── 📂 src/ │ ├── 📂 app/ ← पेज (Next.js) │ │ ├── layout.tsx │ │ ├── page.tsx │ │ └── globals.css │ ├── 📂 domain/ ← बिज़नेस लॉजिक │ │ ├── models/ │ │ └── services/ │ ├── 📂 ports/ ← इंटरफ़ेस डेफ़िनिशन │ └── 📂 adapters/ ← बाहरी इंटीग्रेशन │ ├── api/ │ └── ui/ ├── 📄 CLAUDE.md ← AI आर्किटेक्चर नियम ├── 📄 next.config.ts ← Next.js सेटिंग्स ├── 📄 tailwind.config.ts ← स्टाइल सेटिंग्स ├── 📄 tsconfig.json ← TypeScript सेटिंग्स └── 📄 package.json
AI से पहली बात कहें
Claude Code या Cursor — कोई भी चलेगा। पहली बार में परफेक्ट होना ज़रूरी नहीं। बातचीत में सुधारते जाएं।
खाली जगह भरें
मैं एक ___ वेबसाइट बनाना चाहता/चाहती हूँ। सर्विस कैसी है: ___ मुख्य यूज़र: ___ शुरुआत में ज़रूरी 3 फीचर: 1. ___ 2. ___ 3. ___ कहाँ से शुरू करूँ?
ऐसे लिखिए
मैं एक मिलने का दिन तय करने वाली वेबसाइट बनाना चाहता/चाहती हूँ। सर्विस कैसी है: दोस्तों के ग्रुप में "कब फ्री हो?" पूछ-पूछकर थक गया/गई हूँ, एक लिंक शेयर करो और हर कोई अपनी फ्री तारीख पर वोट कर दे। मुख्य यूज़र: 20-30 साल के वर्किंग लोग। बिना साइन अप के, सिर्फ लिंक से तुरंत इस्तेमाल कर सकें। शुरुआत में ज़रूरी 3 फीचर: 1. कई तारीखें डालो और लोग जिस दिन फ्री हों उस पर टिक करें 2. बिना साइन अप, बस नाम डालकर तुरंत हिस्सा लें 3. वोटिंग रिज़ल्ट एक ही स्क्रीन पर दिखे पहले साइट का प्रमोशन लैंडिंग पेज बना दो।
उसके बाद ऐसे आगे बढ़ें
पहला प्रॉम्प्ट भेजने पर AI कोड बना देगा। उसके बाद छोटे-छोटे मैसेज से बात करते जाएँ।
गलत बोल दिया तो कोई बात नहीं। "पिछला वाला कैंसिल करो और दोबारा करो" कह दीजिए।
💡 अगले स्टेप में साइट को इंटरनेट पर डालने के बाद, 5 कैटेगरी (टेक्स्ट · रंग · नया सेक्शन · ग्रेडिएंट · फ़ॉन्ट) में संगठित एक और गाइड मिलेगी।
डिज़ाइन समझ नहीं आ रहा?
Claude Design — AI से पहले स्क्रीन बनाएँ, फिर अपने प्रोजेक्ट में सीधे ले आएँ।
- 1claude.ai/design खोलें और "लॉगिन पेज बनाओ" जैसे अपनी मनचाही स्क्रीन बताएँ
- 2पसंद आए तो Export मेनू में "Send to local coding agent" चुनें और Copy command दबाएँ
- 3प्रोजेक्ट फोल्डर में खुले Claude Code टर्मिनल में पेस्ट करें — डिज़ाइन अपने आप लागू हो जाता है
- 4Cursor जैसे किसी दूसरे AI एजेंट का उपयोग कर रहे हों तो "Download zip instead" चेक करें, ज़िप खोलकर ~/my-first-app/ फोल्डर में रखें
केवल Claude Pro, Max, Team, Enterprise सब्सक्राइबर ही उपयोग कर सकते हैं। यह रिसर्च प्रीव्यू में है और इसकी अपनी अलग साप्ताहिक सीमा है — यहाँ का उपयोग अन्य Claude सीमाओं में नहीं जोड़ा जाता।
अब अपनी साइट को असली इंटरनेट पर डालें?
अपना कोड GitHub पर अपलोड करें और Vercel से डिप्लॉय करें — आपको एक असली URL मिलेगा जिसे दोस्तों के साथ शेयर कर सकते हैं। हम आपको कदम-दर-कदम गाइड करेंगे।
Google से लॉगिन करें और आपका प्रोजेक्ट अपने आप जुड़ जाएगा।