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

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

शुरू करें

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

अगले चरण