ऐप्लिकेशन प्रोटोटाइपिंग एजेंट का इस्तेमाल शुरू करना

Firebase Studio में एक वेब-आधारित इंटरफ़ेस शामिल है. इसकी मदद से, एआई के साथ काम करने वाले वेब ऐप्लिकेशन के प्रोटोटाइप को तेज़ी से जनरेट किया जा सकता है. इसके लिए, अलग-अलग तरह के प्रॉम्प्ट का इस्तेमाल किया जाता है. जैसे, नैचुरल लैंग्वेज, इमेज, और ड्रॉइंग टूल. यह एजेंट, Next.js ऐप्लिकेशन के साथ काम करता है. आने वाले समय में, अन्य प्लैटफ़ॉर्म और फ़्रेमवर्क के साथ भी काम करने की सुविधा उपलब्ध कराई जाएगी.

ऐप्लिकेशन प्रोटोटाइपिंग एजेंट, बिना कोड के डेवलपमेंट का एक आसान तरीका है. यह एजेंट, जनरेटिव एआई का इस्तेमाल करके, एजेंटिक वेब ऐप्लिकेशन को डेवलप, टेस्ट, और पब्लिश करता है. साथ ही, इसमें बदलाव भी करता है. इसके लिए, आपको अपने ऐप्लिकेशन के आइडिया के बारे में नैचुरल लैंग्वेज में बताना होता है. इसके बाद, एजेंट ऐप्लिकेशन का ब्लूप्रिंट, कोड, और वेब की झलक जनरेट करता है. आपके फ़ुल-स्टैक ऐप्लिकेशन को डेवलप और पब्लिश करने में मदद करने के लिए, Firebase Studio आपके लिए ये सेवाएं अपने-आप उपलब्ध करा सकता है:

• अगर आपका ऐप्लिकेशन एआई का इस्तेमाल करता है, तो: Firebase Studio, Gemini के साथ काम करने के लिए, Genkit फ़्लो की मदद से आपके ऐप्लिकेशन में Gemini Developer API जोड़ता है. आपके पास अपनी Gemini API पासकोड का इस्तेमाल करने का विकल्प है. इसके अलावा, Firebase Studio को आपके लिए Firebase प्रोजेक्ट और Gemini API पासकोड उपलब्ध कराने की अनुमति भी दी जा सकती है.

• अगर आपको अपना ऐप्लिकेशन वेब पर पब्लिश करना है, तो: Firebase Studio एक प्रोजेक्ट बनाता है और Firebase App Hosting की मदद से, आपके ऐप्लिकेशन को तुरंत पब्लिश करने का तरीका बताता है.

Firebase Studio में, ऐप्लिकेशन को बेहतर बनाने के लिए, सामान्य भाषा, इमेज, और ड्रॉइंग टूल का इस्तेमाल किया जा सकता है. साथ ही, कोड में सीधे बदलाव किया जा सकता है, बदलावों को पहले जैसा किया जा सकता है, ऐप्लिकेशन को पब्लिश किया जा सकता है, और उसकी परफ़ॉर्मेंस को मॉनिटर किया जा सकता है.

ध्यान दें: ऐप्लिकेशन प्रोटोटाइपिंग एजेंट की मदद से, Next.js का इस्तेमाल करके वेब ऐप्लिकेशन बनाए जा सकते हैं. अन्य प्लैटफ़ॉर्म और फ़्रेमवर्क के लिए, यह सुविधा जल्द ही उपलब्ध होगी!

शुरू करें

App Prototyping agent का इस्तेमाल शुरू करने के लिए, यह तरीका अपनाएं:

1. अपने Google खाते में लॉग इन करें और Firebase Studio खोलें.

2. एआई की मदद से ऐप्लिकेशन का प्रोटोटाइप बनाएं फ़ील्ड में, अपने ऐप्लिकेशन के आइडिया के बारे में सामान्य भाषा में बताएं.

   अगर आपको प्रॉम्प्ट के साथ कोई इमेज जोड़नी है, तो ऐसा करें. यह आपके ऐप्लिकेशन के आदर्श यूज़र फ़्लो का डायग्राम हो सकता है. इसके अलावा, यह कोई ऐसी कलर स्कीम भी हो सकती है जिसका इस्तेमाल Firebase Studio करना है. इमेज का साइज़ ज़्यादा से ज़्यादा 3 एमबी होना चाहिए.

   सलाह: बेहतर नतीजों के लिए, ज़्यादा से ज़्यादा सटीक जानकारी दें. अपनी पसंद की सुविधाएं, उपयोगकर्ता वर्कफ़्लो, और डेटा की ज़रूरी शर्तें शामिल करें. यह भी ध्यान रखें कि एआई की मदद से डेवलपमेंट की सबसे असरदार प्रोसेस, बार-बार की जाने वाली प्रोसेस होती हैं. साथ ही, Firebase में Gemini की मदद से, सुविधाओं को बेहतर बनाया जा सकता है और उनमें नई सुविधाएं जोड़ी जा सकती हैं. असरदार प्रॉम्प्ट बनाने के बारे में ज़्यादा जानें.

3. एआई की मदद से प्रोटोटाइप बनाएं पर क्लिक करें.

   ऐप्लिकेशन प्रोटोटाइपिंग एजेंट, ऐप्लिकेशन का ब्लूप्रिंट दिखाता है. इसमें, ऐप्लिकेशन का सुझाया गया नाम, मुख्य सुविधाएं, और स्टाइल के दिशा-निर्देश शामिल होते हैं.

4. ब्लूप्रिंट देखें. Gemini से बेहतर बनाने और बदलाव करने के लिए कहा जा सकता है. साथ ही, ब्लूप्रिंट में सीधे बदलाव भी किए जा सकते हैं:

   • पसंद के मुताबिक बनाएं पर क्लिक करें और सीधे ब्लूप्रिंट में बदलाव करें. बदलाव करने के बाद, सेव करें पर क्लिक करें.

   • चैट पैनल में, बताओ... फ़ील्ड में, सवाल और संदर्भ जोड़ें. आपके पास अन्य इमेज अपलोड करने का विकल्प भी होता है.

5. ब्लूप्रिंट को मंज़ूरी देने के बाद, इस ऐप्लिकेशन का प्रोटोटाइप बनाएं पर क्लिक करें.

   Gemini, ब्लूप्रिंट से कोड जनरेट करता है और आपको समीक्षा के लिए वेब की झलक दिखाता है.

   Firebase में मौजूद Gemini, ऐसा आउटपुट जनरेट कर सकता है जो आपको सही लगे, लेकिन असल में गलत हो. यह गलत जानकारी दे सकता है, जो Google की राय से अलग हो सकती है. Gemini से मिलने वाले किसी भी तरह के आउटपुट का इस्तेमाल करने से पहले, उसकी पुष्टि कर लें. साथ ही, प्रोडक्शन में ऐसे जनरेट किए गए कोड का इस्तेमाल न करें जिसकी जांच न की गई हो. चैट में, व्यक्तिगत पहचान से जुड़ी जानकारी (पीआईआई) या उपयोगकर्ता का डेटा डालने से बचें.

6. अगर आपका ऐप्लिकेशन एआई का इस्तेमाल करता है, तो आपसे Gemini API पासकोड जोड़ने या जनरेट करने के लिए कहा जाएगा. अपने-आप जनरेट करें पर क्लिक करने पर,Firebase Studio आपके लिए एक Firebase प्रोजेक्ट और Gemini API पासकोड उपलब्ध कराया जाएगा.

   सलाह: आने वाले समय में अपनी Gemini API कुंजी को कॉपी या मिटाने के लिए, Google Cloud कंसोल का इस्तेमाल करें.

शुरुआती ऐप्लिकेशन बनाने के बाद, ये काम किए जा सकते हैं:

• अपने ऐप्लिकेशन की समीक्षा करना और उससे इंटरैक्ट करना: कोड जनरेट होने के बाद, आपके ऐप्लिकेशन की झलक दिखती है. इसकी जांच करने के लिए, सीधे झलक के साथ इंटरैक्ट किया जा सकता है. ज़्यादा जानने के लिए, अपने ऐप्लिकेशन की झलक देखना लेख पढ़ें.

• सामान्य भाषा का इस्तेमाल करके टेस्ट करें और बदलाव करें: अपने ऐप्लिकेशन की अच्छी तरह से जांच करें और App Prototyping agent का इस्तेमाल करके, कोड और ब्लूप्रिंट में तब तक बदलाव करें, जब तक आपको इनसे संतुष्टि न मिल जाए.

  Prototyper mode, you can also use the following helpful features: में रहते हुए

  • प्रीव्यू विंडो पर सीधे ड्रॉ करने के लिए, एनोटेट करें पर क्लिक करें. उपलब्ध आकार, इमेज, और टेक्स्ट टूल का इस्तेमाल करें. साथ ही, टेक्स्ट प्रॉम्प्ट का इस्तेमाल करके विज़ुअल तौर पर बताएं कि आपको App Prototyping agent में क्या बदलाव करना है. हालांकि, टेक्स्ट प्रॉम्प्ट का इस्तेमाल करना ज़रूरी नहीं है.

  • कोई एलिमेंट चुनने के लिए, चुनें पर क्लिक करें. इसके बाद, App Prototyping agent के लिए निर्देश डालें. इसकी मदद से, किसी आइकॉन, बटन, टेक्स्ट या दूसरे एलिमेंट को तुरंत टारगेट किया जा सकता है. किसी इमेज पर क्लिक करने पर, आपके पास Unsplash से स्टॉक इमेज खोजने और चुनने का विकल्प भी होता है.

• सीधे कोड में डीबग करें और उसमें बदलाव करें: Code व्यू खोलने के लिए, कोड पर स्विच करें पर क्लिक करें. यहां आपको अपने ऐप्लिकेशन की सभी फ़ाइलें दिखेंगी और सीधे अपने कोड में बदलाव किया जा सकेगा. Prototyper mode at any time. पर वापस स्विच किया जा सकता है

  Code व्यू में, इन मददगार सुविधाओं का भी इस्तेमाल किया जा सकता है:

  • अपने ऐप्लिकेशन की जांच करने, उसे डीबग करने, और उसका ऑडिट करने के लिए, Firebase Studio की डीबग करने और रिपोर्ट करने की सुविधाएं इस्तेमाल करें.

  • Firebase में Gemini का इस्तेमाल करके एआई की मदद पाना. इसके लिए, कोड में इनलाइन या इंटरैक्टिव चैट का इस्तेमाल किया जा सकता है. दोनों ही सुविधाएं डिफ़ॉल्ट रूप से उपलब्ध हैं. इंटरैक्टिव चैट की मदद से, समस्याओं का पता लगाया जा सकता है, उनके समाधान दिए जा सकते हैं, और ऐप्लिकेशन को तेज़ी से ठीक करने के लिए टूल चलाए जा सकते हैं. चैट को ऐक्सेस करने के लिए, वर्कस्पेस में सबसे नीचे मौजूद sparkGemini पर क्लिक करें.

• Firebase App Hosting की मदद से अपना ऐप्लिकेशन पब्लिश करना: App Hosting पर अपना ऐप्लिकेशन पब्लिश करने के लिए, पब्लिश करें पर क्लिक करें.

  Firebase App Hosting के लिए Cloud Billing खाता होना ज़रूरी है. किसी बिलिंग खाते को Firebase प्रोजेक्ट से लिंक करने पर, आपका प्रोजेक्ट पे-ऐज़-यू-गो Blaze कीमत वाले प्लान पर अपने-आप अपग्रेड हो जाता है. साथ ही, आपके Gemini API के इस्तेमाल को पैसे चुकाकर इस्तेमाल किए जाने वाले टीयर पर अपग्रेड कर दिया जाता है. बिना शुल्क के मिलने वाले कोटे के बाद, पैसे चुकाकर ली जाने वाली सेवाओं के इस्तेमाल पर आपसे शुल्क लिया जाएगा. ज़्यादा जानकारी के लिए, इन पेजों पर जाएं: ऐप्लिकेशन होस्टिंग की कीमतों के बारे में जानें, Firebase की कीमतें, और Gemini Developer API की कीमतें.

• अपने ऐप्लिकेशन और एआई की सुविधाओं पर नज़र रखना और उन्हें ऑप्टिमाइज़ करना: App Hosting में मौजूद ऑब्ज़र्वेबिलिटी की मदद से, अपने वेब ऐप्लिकेशन की परफ़ॉर्मेंस और इस्तेमाल पर नज़र रखें. साथ ही, Genkit में मौजूद Firebase टेलीमेट्री की मदद से, अपने जनरेटिव एआई फ़्लो पर नज़र रखें. ज़्यादा जानने के लिए, वेब ऐप्लिकेशन को मॉनिटर करना लेख पढ़ें.

सलाह: App Prototyping agent की मदद से, ऐप्लिकेशन के पूरे लाइफ़साइकल के बारे में जानने के लिए, Firebase Studio की मदद से फ़ुल-स्टैक वेब ऐप्लिकेशन डेवलप, पब्लिश, और मॉनिटर करने का तरीका लेख पढ़ें. इसमें, ऐप्लिकेशन बनाने से लेकर पब्लिश किए गए वेब ऐप्लिकेशन को मॉनिटर करने तक की जानकारी दी गई है.

अगले चरण

• Firebase Studio की मदद से, फ़ुल-स्टैक वेब ऐप्लिकेशन डेवलप करना, पब्लिश करना, और उसे मॉनिटर करना.
• टेंप्लेट या समाधान के साथ किसी भी फ़्रेमवर्क का इस्तेमाल करके ऐप्लिकेशन बनाएं.