v0 के साथ शुरुआत करें: प्रॉम्प्ट से लेकर प्रोडक्शन तक
VVercel
Computing/SoftwareSmall Business/StartupsInternet Technology
Transcript
00:00:00यह एक इवेंट लैंडिंग पेज है जिसे मैंने खुद कुछ ही मिनटों में बनाया है।
00:00:05इसमें एआई-संचालित वर्चुअल ट्राई-ऑन अनुभव भी शामिल है।
00:00:09मेरे बॉस ने मुझे यह प्रोजेक्ट सौंपा था और V0 ने मेरे विचारों को वास्तविक सॉफ़्टवेयर में बदलने में मदद की।
00:00:14इस वीडियो में, मैं आपको दिखाऊंगा कि V0 क्या है और कदम-दर-कदम प्रोजेक्ट्स कैसे बनाएं।
00:00:19तो V0 क्या है?
00:00:21एआई कोड जनरेट करना आसान बनाता है।
00:00:23V0 उस शक्ति का उपयोग एक ऐसे फॉर्मेट में करता है जिससे किसी के लिए भी वास्तविक ऐप बनाना आसान हो जाता है
00:00:28और वेबसाइटें बनाना या डेवलपर्स के साथ सहयोग करना आसान हो जाता है।
00:00:30V0 को आपको जितनी जल्दी हो सके शून्य से शिप करने में मदद करने के लिए डिज़ाइन किया गया है।
00:00:36V0 इस तरह काम करता है।
00:00:37आप उस ऐप, एजेंट या वेबसाइट का विवरण देते हैं जो आप चाहते हैं, और फिर V0 लाइव प्रिव्यू में
00:00:42कोड जनरेट करता है।
00:00:43आप V0 से बात करके अपने प्रोजेक्ट में बदलाव और संशोधन कर सकते हैं, उसे बताएं कि क्या बदलाव करने हैं,
00:00:48और वह उन्हें आपके लिए कर देगा।
00:00:49V0, Vercel और Next.js का उपयोग करके वास्तविक सॉफ़्टवेयर जनरेट करता है, लेकिन V0 केवल एक वेबसाइट बिल्डर नहीं है।
00:00:56यह वास्तविक ऐप्स जनरेट कर सकता है, उन्हें एआई और डेटाबेस से जोड़ सकता है, और ऐसा कोड जनरेट कर सकता है जिसे डेवलपर्स
00:01:00उपयोग और डिप्लॉय कर सकते हैं।
00:01:02यह इसलिए संभव है क्योंकि V0 को Next.js कोडिंग फ्रेमवर्क के निर्माता Vercel द्वारा बनाया गया है,
00:01:08जिसका उपयोग Under Armour, Stripe और Notion जैसे ब्रांडों द्वारा किया जाता है।
00:01:11इसलिए जब V0 आपके Next.js ऐप को बनाता और डिप्लॉय करता है, तो आप उसी कोड और सुरक्षित
00:01:15इन्फ्रास्ट्रक्चर का उपयोग कर रहे होते हैं जो दुनिया की शीर्ष कंपनियां करती हैं।
00:01:19आइए कुछ प्रोजेक्ट्स दिखाते हैं ताकि आप V0 को काम करते हुए देख सकें और जान सकें कि शुरुआत करना कितना आसान है।
00:01:24तो मैं एक मार्केटिंग टीम में हूँ, और मुझे इस सप्ताह दो बड़े प्रोजेक्ट करने हैं।
00:01:27पहला, मुझे एक नए प्रोडक्ट के लॉन्च के लिए एक इवेंट पेज बनाना है जिसे हम पेश कर रहे हैं।
00:01:31और दूसरा, मुझे हमारी वेबसाइट पर एक लैंडिंग पेज को अपडेट करना है।
00:01:34आइए पहले इवेंट पेज से शुरुआत करते हैं।
00:01:36इवेंट एक प्रोडक्ट रिलीज़ पार्टी के लिए है जहाँ हम "सन ऑफ़ अली" नामक एक नई घड़ी पेश करेंगे।
00:01:40अली।
00:01:41मैं लैंडिंग पेज को स्टाइलिश और रोमांचक बनाना चाहता हूँ ताकि उत्साह बढ़े और विज़िटर्स के लिए
00:01:45एक आकर्षक वर्चुअल ट्राई-ऑन अनुभव तैयार हो ताकि वे रजिस्ट्रेशन करें।
00:01:48इसलिए मैं V0 को बिल्कुल यही करने के लिए कहने जा रहा हूँ।
00:01:53मैंने अपना प्रॉम्प्ट लिखना पूरा कर लिया है।
00:01:54तो अब मैं अपने निर्देश सबमिट करूँगा, और V0 बनाना शुरू कर देगा।
00:01:59जब तक V0 निर्माण कर रहा है, मैं आपको दिखाना चाहता हूँ कि यह इतना शक्तिशाली क्यों है।
00:02:02यदि आप सेटिंग्स और फिर इंटीग्रेशन पर क्लिक करते हैं, तो आपको वे सभी इंटीग्रेशन दिखाई देंगे
00:02:07जो आपके लिए V0 में उपलब्ध हैं।
00:02:09पहले आप देख सकते हैं कि V0 में एआई पहले से ही इन-बिल्ट है।
00:02:12यह एआई फीचर्स बनाने के लिए AI SDK का उपयोग करेगा और आपके ऐप को सैकड़ों एआई मॉडल तक
00:02:17ऑटोमैटिक एक्सेस देने के लिए एआई गेटवे का उपयोग करेगा।
00:02:20आप अपने ऐप के बैकएंड को संचालित करने के लिए डेटाबेस भी बना या कनेक्ट कर सकते हैं और यहाँ तक कि
00:02:25Stripe के माध्यम से पेमेंट भी स्वीकार कर सकते हैं।
00:02:27इन इंटीग्रेशन के साथ, आप वास्तविक, फुल-स्टैक एआई-सक्षम ऐप्स बना सकते हैं।
00:02:32ठीक है, आइए अपने इवेंट पेज को चेक करते हैं।
00:02:34V0 ने इस पहले वर्ज़न को बनाना पूरा कर लिया है, तो आइए इसका परीक्षण करें।
00:02:38तो मैं अपनी एक इमेज अपलोड करने जा रहा हूँ, और इसे हमें वे चार
00:02:44जनरेशन देने चाहिए जो हमने वर्चुअल वॉच ट्राई-ऑन के साथ मांगे थे।
00:02:49शानदार, तो V0 ने वास्तव में मेरे निर्देशों को लिया है और कोड को अपडेट कर दिया है।
00:02:55अगर हम एडिटर को देखें, तो आप देख सकते हैं कि V0 सक्रिय रूप से Next.js कोड को अपडेट कर रहा है।
00:03:00एडिटर डेवलपर्स के लिए कोड की समीक्षा करना और उसे एडिट करना भी आसान बनाता है।
00:03:04ठीक है, V0 ने बदलाव करना पूरा कर लिया है और वे बहुत अच्छे लग रहे हैं।
00:03:09इसे पब्लिश करने से पहले, मैं फीडबैक के लिए इसे अपनी टीम के साथ शेयर करना चाहता हूँ।
00:03:12तो मैं शेयर पर क्लिक कर सकता हूँ और फिर लिंक को कॉपी करके चैट और प्रिव्यू अपनी टीम को भेज सकता हूँ।
00:03:18इस प्रिव्यू के साथ वे जो देखेंगे, वह बिल्कुल वही होगा जो पेज को सार्वजनिक करने पर यूज़र्स देखेंगे,
00:03:22इसलिए मुझे वास्तव में डिप्लॉय करते समय किसी भी बदलाव की चिंता करने की ज़रूरत नहीं है।
00:03:26एक बार जब मेरी टीम पेज की समीक्षा कर लेती है, तो मैं इसे एक कस्टम यूआरएल देने और पब्लिश करने के लिए तैयार हूँ।
00:03:31इससे भी बड़ी बात यह है कि इसने वास्तव में मेरे द्वारा बनाए गए इस V0 क्रिएशन के लिए Vercel पर एक प्रोजेक्ट बना दिया है।
00:03:36बनाया है।
00:03:37तो अगर मैं Vercel पर Inspect पर क्लिक करता हूँ, तो मैं जाकर वास्तव में उस प्रोजेक्ट को देख सकता हूँ।
00:03:42उस प्रोजेक्ट के अंदर, मैं सभी एनालिटिक्स, एरर्स और डिप्लॉयमेंट का पूरा इतिहास देख सकता हूँ।
00:03:48ठीक है बहुत बढ़िया, तो मैंने इस ऐप को प्रोडक्शन में पब्लिश कर दिया है।
00:03:51तो अब मैं वास्तव में लाइव साइट पर जा सकता हूँ और यह वही होगा जो यूज़र्स देखेंगे और मैं
00:03:56उस लिंक को शेयर कर सकता हूँ और वे इसे सार्वजनिक रूप से एक्सेस कर सकते हैं।
00:03:59V0 के साथ वास्तव में जो अच्छी बात है वो यह है कि मैं एक कस्टम डोमेन जोड़ने का विकल्प चुन सकता हूँ।
00:04:03मैं .vercel.app पर डोमेन को कस्टमाइज़ कर सकता हूँ, डोमेन खरीद सकता हूँ, या ऐसा डोमेन जोड़ सकता हूँ जो मेरे पास पहले से
00:04:09है।
00:04:10चूंकि यह एक बार होने वाले इवेंट का पेज है, इसलिए मैं बेस डोमेन को कस्टमाइज़ करूँगा और
00:04:14फिर इसे दोबारा पब्लिश करूँगा।
00:04:15बहुत बढ़िया।
00:04:16ठीक है, अब वह डोमेन अपडेट हो गया है और मैं उसी पेज को उस नए डोमेन पर एक्सेस कर सकता हूँ जिसे
00:04:21मैंने एडिट किया है और जोड़ा है।
00:04:23और बस हो गया।
00:04:24V0 ने अब मेरे ऐप को Vercel के इन्फ्रास्ट्रक्चर पर डिप्लॉय कर दिया है और यह किसी के भी एक्सेस करने के लिए सार्वजनिक है।
00:04:30अब आइए अपने अगले प्रोजेक्ट पर चलते हैं, जो हमारी मार्केटिंग साइट पर पहले से ही पब्लिश हो चुके
00:04:34एक लैंडिंग पेज को अपडेट करना है।
00:04:36हमारी डेवलपमेंट टीम साइट को मैनेज करती है और GitHub के माध्यम से कोड के वर्ज़न को कंट्रोल करती है, इसलिए मुझे
00:04:41यह अपडेट उनके वर्कफ़्लो के हिस्से के रूप में करना होगा।
00:04:44अच्छी खबर यह है कि V0 मेरे लिए बिल्कुल यही करना आसान बनाता है।
00:04:48मैं एक नई V0 विंडो खोलूँगा और GitHub से इम्पोर्ट पर क्लिक करूँगा।
00:04:52मेरे पास वास्तव में इस GitHub रेपो का यूआरएल पहले से ही है जिसे मैं एक्सेस करने की कोशिश कर रहा हूँ, इसलिए मैं
00:04:56इसे उस टॉप बार में पेस्ट करूँगा और इम्पोर्ट पर क्लिक करूँगा।
00:05:01और बस ऐसे ही, V0 रेपो को इम्पोर्ट कर लेता है।
00:05:05तो अब V0 ने रेपो इम्पोर्ट कर लिया है और मैं बदलाव करने के लिए तैयार हूँ।
00:05:08मैं इस मार्केटिंग पेज के शीर्ष पर एक बैनर जोड़ना चाहूँगा जो लोगों को
00:05:12हमारे द्वारा अभी बनाए गए इवेंट लैंडिंग पेज पर निर्देशित करे ताकि वे सन ऑफ़ अली लॉन्च
00:05:17इवेंट के लिए साइन अप कर सकें।
00:05:18तो मैं V0 को बिल्कुल यही करने के लिए कहूँगा।
00:05:21जब तक V0 बदलाव करता है, मैं आगे बढ़कर Git पर क्लिक करने जा रहा हूँ।
00:05:27आप देख सकते हैं कि V0 ने मेरे लिए ऑटोमैटिक रूप से एक ब्रांच बना दी है, जिससे मेरे
00:05:31डेवलपर्स के लिए मेरे द्वारा किए जा रहे बदलावों को मुख्य साइट में मर्ज करने से पहले उनकी समीक्षा और परीक्षण करना
00:05:35आसान हो जाएगा।
00:05:36ठीक है, V0 ने बदलाव कर दिया है, तो अब एक पुल रिक्वेस्ट बनाने का समय आ गया है जिसकी
00:05:42मेरी टीम समीक्षा कर सके।
00:05:44तो मैं आगे बढ़कर open PR पर क्लिक करूँगा और फिर open pull request पर।
00:05:49अब अगर मैं view PR पर क्लिक करता हूँ, तो मैं देख सकता हूँ कि मेरी पुल रिक्वेस्ट GitHub पर खोल दी गई है।
00:05:54और चूँकि हमारी साइट Vercel पर है, एक प्रिव्यू बिल्ड ऑटोमैटिक रूप से बन गया है।
00:05:59तो न केवल मेरे डेवलपर्स कोड की समीक्षा कर सकते हैं, बल्कि बाकी टीम भी देख सकती है कि अपडेट कैसा
00:06:03दिखता है और कमेंट्स के माध्यम से फीडबैक दे सकती है।
00:06:06और बस हो गया।
00:06:07मैंने इंजीनियरिंग के लिए कोई टिकट खोले बिना खुद ही हमारी मार्केटिंग साइट पर एक बदलाव कर दिया
00:06:11और वे अपने मौजूदा प्रोसेस के हिस्से के रूप में इस बदलाव की समीक्षा कर सकते हैं।
00:06:15हमने V0 को उन टीमों के लिए बनाया है जो डेवलपर्स के साथ काम करती हैं, चाहे वह मार्केटिंग हो, प्रोडक्ट हो, फाउंडर्स हों,
00:06:19या खुद इंजीनियर्स ही क्यों न हों।
00:06:22V0 के साथ, कोई भी अपने विचारों को वास्तविक सॉफ़्टवेयर में बदल सकता है और मौजूदा ऐप्स और
00:06:27वेबसाइटों पर सहयोग कर सकता है।
00:06:28आज ही v0.app पर जाएं और अपना पहला प्रोजेक्ट शिप करें।
Community Posts
No posts yet. Be the first to write about this video!
Write about this video