Gemini की मदद से, YouTube वीडियो की खास जानकारी देने वाला टूल बनाना

1. परिचय

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

इस लैब के आखिर तक, आपके पास एक ऐसा वेब ऐप्लिकेशन होगा जो YouTube वीडियो से खास जानकारी जनरेट कर सकता है. आपको यह भी बेहतर तरीके से समझ आएगा कि वेब ऐप्लिकेशन बनाने के लिए, Gemini API और Google के जनरेटिव एआई वाले एसडीके का इस्तेमाल कैसे किया जाए और उन्हें एक साथ कैसे इंटिग्रेट किया जाए.

आपका वेब ऐप्लिकेशन ऐसा दिखेगा:

आपको सिर्फ़ YouTube वीडियो का लिंक देना है. बाक़ी काम Gemini कर देगा.

2. शुरू करने से पहले

इस कोडलैब में यह माना गया है कि आपके पास पहले से ही बिलिंग की सुविधा वाला Google Cloud प्रोजेक्ट है. अगर आपके पास यह सुविधा अभी तक नहीं है, तो इसे इस्तेमाल करने के लिए यहां दिया गया तरीका अपनाएं.

Google Cloud Console में, प्रोजेक्ट चुनने वाले पेज पर जाकर, Google Cloud प्रोजेक्ट चुनें या बनाएं.
पक्का करें कि आपके Google Cloud प्रोजेक्ट के लिए बिलिंग चालू हो. किसी प्रोजेक्ट के लिए बिलिंग चालू है या नहीं, यह देखने का तरीका जानें.
आपको Cloud Shell का इस्तेमाल करना होगा. यह Google Cloud में चलने वाला कमांड-लाइन एनवायरमेंट है. इसे ऐक्सेस करने के लिए, Google Cloud Console में सबसे ऊपर मौजूद, Cloud Shell चालू करें पर क्लिक करें.

Cloud Shell से कनेक्ट होने के बाद, यह देखने के लिए कि आपकी पुष्टि हो चुकी है और प्रोजेक्ट को आपके प्रोजेक्ट आईडी पर सेट किया गया है, इस निर्देश का इस्तेमाल करें:

gcloud auth list

यह पुष्टि करने के लिए कि gcloud कमांड को आपके प्रोजेक्ट के बारे में पता है, Cloud Shell में यह कमांड चलाएं.

gcloud config list project

अगर आपका प्रोजेक्ट सेट नहीं है, तो इसे सेट करने के लिए इस निर्देश का इस्तेमाल करें:

gcloud config set project <YOUR_PROJECT_ID>

इसके अलावा, PROJECT_ID आईडी को कंसोल में भी देखा जा सकता है

इस पर क्लिक करने से, आपको अपने सभी प्रोजेक्ट और प्रोजेक्ट आईडी दाईं ओर दिखेंगे

पक्का करें कि ये एपीआई चालू हों. इन्हें चालू करने के लिए, इस निर्देश का इस्तेमाल करें:

Vertex AI API
Cloud Run Admin API
Cloud Build API
Cloud Resource Manager API

gcloud services enable aiplatform.googleapis.com \
                           run.googleapis.com \
                           cloudbuild.googleapis.com \
                           cloudresourcemanager.googleapis.com

gcloud कमांड का इस्तेमाल करने के बजाय, इस लिंक का इस्तेमाल करके कंसोल पर जाएं. gcloud कमांड और उनके इस्तेमाल के बारे में जानने के लिए, दस्तावेज़ देखें.

ज़रूरी शर्तें

Python और एचटीएमएल कोड को पढ़ और लिख सकता हो
Gemini API और Google के जनरेटिव एआई वाले एसडीके के साथ काम करने में आसानी हो
फ़ुल-स्टैक डेवलपमेंट की बुनियादी बातों की जानकारी

आपको क्या सीखने को मिलेगा

Flask API लाइब्रेरी का इस्तेमाल करके, Gemini की मदद से बैक-एंड एपीआई बनाने का तरीका
जेन एआई ऐप्लिकेशन को बनाने का तरीका, जिसमें फ़्रंट-एंड और बैक-एंड को एक साथ लिंक किया जाता है
Cloud Run पर, बनाए गए जेन एआई ऐप्लिकेशन को डिप्लॉय करने का तरीका

आपको इन चीज़ों की ज़रूरत होगी

काम करने वाला कंप्यूटर और भरोसेमंद वाई-फ़ाई
जिज्ञासु मन

3. Cloud Run पर Python Flask ऐप्लिकेशन बनाना

हम Cloud Shell से, अपने-आप जनरेट हुए टेंप्लेट का इस्तेमाल करके, Cloud Run पर Python Flask ऐप्लिकेशन बनाएंगे.

Cloud Shell टर्मिनल पर जाएं और 'एडिटर खोलें' बटन पर क्लिक करें.

पक्का करें कि Cloud Code प्रोजेक्ट, Cloud Shell एडिटर के सबसे नीचे बाईं ओर (स्टेटस बार) में सेट हो. जैसा कि नीचे दी गई इमेज में हाइलाइट किया गया है. साथ ही, यह उस चालू Google Cloud प्रोजेक्ट पर सेट हो जिसमें आपने बिलिंग चालू की है. अगर कहा जाए, तो अनुमति दें पर क्लिक करें.

ध्यान दें: Cloud Shell Editor को शुरू होने और सभी ज़रूरी प्लगिन लोड होने में कुछ समय लग सकता है, ताकि

Cloud Code - Sign In

बटन दिखेगा, कृपया इंतज़ार करें

स्टेटस बार पर मौजूद उस चालू प्रोजेक्ट पर क्लिक करें. इसके बाद, Cloud Code पॉप-अप खुलने का इंतज़ार करें. पॉप-अप में, "नया ऐप्लिकेशन" चुनें.

ऐप्लिकेशन की सूची से, Cloud Run ऐप्लिकेशन चुनें:

दूसरे पेज के लिए, Python Flask टेंप्लेट चुनें:

प्रोजेक्ट का नाम अपनी पसंद के मुताबिक डालें.जैसे, "amazing-gemini-app". इसके बाद, OK पर क्लिक करें:

इससे, अभी सेट अप किए गए नए प्रोजेक्ट का टेंप्लेट खुल जाएगा.

Google Cloud Shell की मदद से, Cloud Run पर Python Flask ऐप्लिकेशन बनाना इतना आसान है.

4. फ़्रंट-एंड बनाना

जैसा कि पहले बताया गया है, फ़ाइनल वेब ऐप्लिकेशन कुछ ऐसा दिखेगा:

इसमें एक इनपुट फ़ील्ड होता है, ताकि उपयोगकर्ता से YouTube लिंक लिया जा सके. इसमें मॉडल फ़ैमिली चुनने का विकल्प, ज़रूरत पड़ने पर अतिरिक्त प्रॉम्प्ट देने के लिए टेक्स्ट एरिया, और फ़ॉर्म सबमिट करने के लिए बटन भी होता है.

अगर आपको चुनौती पसंद है, तो बेझिझक अपना फ़ॉर्म डिज़ाइन करें या सीएसएस प्रॉपर्टी में बदलाव करें. आपके पास नीचे दिए गए कोड को कॉपी करके, templates फ़ोल्डर में मौजूद index.html फ़ाइल के कॉन्टेंट को इससे बदलने का विकल्प भी है.

<!DOCTYPE html>
<html>
 <head>
   <title>YouTube Summarizer</title>
   <style>
     body {
       font-family: sans-serif;
       display: flex;
       justify-content: center;
       align-items: center;
       min-height: 100vh;
       background-color: #f4f4f4;
     }
     .container {
       background-color: white;
       padding: 30px;
       border-radius: 8px;
       box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
       text-align: center;
     }
     h2 {
       text-align: center;
       margin-bottom: 20px;
     }
     input[type="text"], textarea, select {
       width: 100%;
       padding: 10px;
       margin-bottom: 15px;
       border: 1px solid #ccc;
       border-radius: 4px;
       box-sizing: border-box;
     }
     button {
       background-color: #4CAF50;
       color: white;
       padding: 12px 20px;
       border: none;
       border-radius: 4px;
       cursor: pointer;
     }
   </style>
 </head>
 <body>
   <div class="container">
     <h2>YouTube Summarizer</h2>
     <form action="/summarize" target="_blank" method="post">
       <input type="text" name="youtube_link" placeholder="Enter YouTube Link">
       <select name="model">
         <option value="gemini-2.0-flash-001">Gemini 2.0 Flash</option>
       </select>
       <textarea name="additional_prompt" placeholder="Write your additional prompt here. For example: 'explain to me like I am five years old'"></textarea>
       <button type="submit">Summarize</button>
     </form>
   </div>
 </body>
</html>

यह जांचने के लिए कि आपने यह चरण सही तरीके से पूरा किया है या नहीं, app.py पर राइट क्लिक करें. इसके बाद, Run Python File in Terminal चुनें.

अगर सब कुछ ठीक रहा, तो Cloud Editor के सबसे ऊपर दाईं ओर मौजूद Web Preview बटन पर क्लिक करके, अपने वेब ऐप्लिकेशन को ऐक्सेस किया जा सकता है. इसके बाद, Preview on port 8080 को चुनें

5. बैक-एंड बनाना

फ़्रंट-एंड सेट अप करने के बाद, आपको एक बैक-एंड सेवा बनानी होगी. यह सेवा, Gemini मॉडल का इस्तेमाल करके, उपयोगकर्ता के दिए गए YouTube वीडियो की खास जानकारी देगी. ध्यान दें कि इस टास्क को पूरा करने के लिए, आपको app.py फ़ाइल को बदलना होगा.

कोड में बदलाव करने से पहले, आपको एक वर्चुअल एनवायरमेंट बनाना होगा. साथ ही, Gemini कॉम्पोनेंट चलाने के लिए ज़रूरी लाइब्रेरी इंस्टॉल करनी होंगी.

सबसे पहले, आपको Google Gen AI SDK लाइब्रेरी को requirements.txt फ़ाइल में जोड़ना होगा. यह ऐसा दिखना चाहिए:

Flask==2.3.3
requests==2.31.0
debugpy # Required for debugging.
google-genai==1.2.0

दूसरा, आपको एक वर्चुअल एनवायरमेंट बनाना होगा. साथ ही, requirements.txt से पैकेज इंस्टॉल करने होंगे, ताकि बैक-एंड कोड को सही तरीके से चलाया जा सके.

सबसे ऊपर बाएं कोने में मौजूद बार पर क्लिक करें. इसके बाद, टर्मिनल > नया टर्मिनल चुनें. (इसके अलावा, नया टर्मिनल खोलने के लिए Ctrl + Shift + C का इस्तेमाल किया जा सकता है)

2. टर्मिनल में टाइप करके वर्चुअल एनवायरमेंट बनाएं और इसके इंस्टॉल होने का इंतज़ार करें

python -m venv venv
source venv/bin/activate
pip install -r requirements.txt

आपके पास खुद को चुनौती देने का विकल्प है. इसलिए, Flask API का इस्तेमाल करके खुद ही Gemini एंडपॉइंट बनाएं. app.py में मौजूद आपका कोड, यहाँ दिए गए कोड जैसा होना चाहिए.

import os

from flask import Flask, render_template, request
from google import genai
from google.genai import types

app = Flask(__name__)

PROJECT_ID = "REPLACE_WITH_YOUR_PROJECT_ID"

client = genai.Client(
   vertexai=True,
   project=PROJECT_ID,
   location="us-central1",
)

# Define the home page route.
@app.route('/', methods=['GET'])
def index():
   '''
   Renders the home page.
   Returns:The rendered template.
   '''
   return render_template('index.html')


def generate(youtube_link, model, additional_prompt):

   # Prepare youtube video using the provided link
   youtube_video = types.Part.from_uri(
       file_uri=youtube_link,
       mime_type="video/*",
   )

   # If addtional prompt is not provided, just append a space
   if not additional_prompt:
       additional_prompt = " "

   # Prepare content to send to the model
   contents = [
       youtube_video,
       types.Part.from_text(text="""Provide a summary of the video."""),
       additional_prompt,
   ]

   # Define content configuration
   generate_content_config = types.GenerateContentConfig(
       temperature = 1,
       top_p = 0.95,
       max_output_tokens = 8192,
       response_modalities = ["TEXT"],
   )

   return client.models.generate_content(
       model = model,
       contents = contents,
       config = generate_content_config,
   ).text

@app.route('/summarize', methods=['GET', 'POST'])
def summarize():
   '''
   Summarize the user provided YouTube video.
   Returns: Summary.
   '''

   # If the request is a POST request, process the form data.
   if request.method == 'POST':
       youtube_link = request.form['youtube_link']
       model = request.form['model']
       additional_prompt = request.form['additional_prompt']
     
       # Generate the summary.
       try:
           summary = generate(youtube_link, model, additional_prompt)
           return summary

       except ValueError as e:
           raise e
 
   # If the request is a GET request, redirect to the home page.
   else:
       return redirect('/')


if __name__ == '__main__':
   server_port = os.environ.get('PORT', '8080')
   app.run(debug=False, port=server_port, host='0.0.0.0')

असल में, यह कोड ये काम करता है:

ज़रूरी लाइब्रेरी इंपोर्ट करता है:

Flask: वेब ऐप्लिकेशन बनाने के लिए.
os: इसका इस्तेमाल एनवायरमेंट वैरिएबल को ऐक्सेस करने के लिए किया जाता है.
google.genai: इसका इस्तेमाल Google के Gemini एआई से इंटरैक्ट करने के लिए किया जाता है.
google.genai.types: इसका इस्तेमाल Gemini के लिए डेटा स्ट्रक्चर तय करने के लिए किया जाता है.

Gemini क्लाइंट को शुरू करना:

यह Google के Vertex AI से कनेक्शन सेट अप करता है. इससे ऐप्लिकेशन को Gemini के एआई मॉडल का इस्तेमाल करने की अनुमति मिलती है. "REPLACE_WITH_YOUR_PROJECT_ID" की जगह अपना प्रोजेक्ट आईडी डालना न भूलें.

generate फ़ंक्शन को तय करना:

इस फ़ंक्शन में, YouTube वीडियो का लिंक, Gemini मॉडल का आईडी, और एक अतिरिक्त प्रॉम्प्ट को इनपुट के तौर पर लिया जाता है. इसके बाद, यह वीडियो और प्रॉम्प्ट को Gemini को भेजता है और जनरेट किए गए खास जानकारी वाले टेक्स्ट को वापस भेजता है.

होम पेज के रूट (/) को तय करना:

यह फ़ंक्शन, index.html टेंप्लेट को रेंडर करता है. इसमें उपयोगकर्ता को YouTube लिंक डालने के लिए एक फ़ॉर्म दिखता है.

खास जानकारी देने वाले रूट (/summarize) को तय करना:

यह फ़ंक्शन, फ़ॉर्म सबमिट करने की प्रोसेस को मैनेज करता है. यह फ़ॉर्म से YouTube लिंक, मॉडल, और प्रॉम्प्ट को वापस लाता है. इसके बाद, खास जानकारी पाने के लिए जनरेट फ़ंक्शन को कॉल करता है. इसके बाद, result.html टेंप्लेट में खास जानकारी दिखाता है.

ऐप्लिकेशन चलाना:

यह एनवायरमेंट वैरिएबल से सर्वर पोर्ट को वापस पाता है और Flask वेब सर्वर शुरू करता है.

टर्मिनल से app.py चलाकर, कोड की जांच की जा सकती है. फ़्रंट एंड की जांच करने का तरीका. app.py पर राइट क्लिक करें और Run Python File in Terminal को चुनें.

आगे बढ़ें और अपने आवेदन की जांच करें. इसे उम्मीद के मुताबिक काम करना चाहिए.

6. वेब ऐप्लिकेशन को डिप्लॉय करना

अब आपके पास काम करने वाला GenAI ऐप्लिकेशन है. इसलिए, चलिए इस ऐप्लिकेशन को Cloud Run पर डिप्लॉय करते हैं, ताकि आप इसे अपने दोस्तों और सहकर्मियों के साथ शेयर कर सकें.

Cloud Shell टर्मिनल पर जाएं. साथ ही, पक्का करें कि मौजूदा प्रोजेक्ट, आपके एक्टिव प्रोजेक्ट के लिए कॉन्फ़िगर किया गया हो. अगर ऐसा नहीं है, तो प्रोजेक्ट आईडी सेट करने के लिए, gcloud configure कमांड का इस्तेमाल करें:

gcloud config set project [PROJECT_ID]

[PROJECT_ID] की जगह अपना प्रोजेक्ट आईडी डालना न भूलें. पक्का करें कि टर्मिनल में आपकी मौजूदा वर्किंग डायरेक्ट्री **amazing-gemini-app** हो. इसके बाद, एक-एक करके इस क्रम में ये कमांड डालें:

gcloud run deploy --source .

इसके बाद, आपको अपनी सेवा का नाम डालने के लिए कहा जाएगा. मान लें कि आपने "youtube-summarizer" नाम डाला है. "us-central1" क्षेत्र के लिए, उससे जुड़ा नंबर चुनें. जब आपसे पूछा जाए कि क्या आपको बिना पुष्टि किए गए अनुरोधों को अनुमति देनी है, तो "हां" कहें. ध्यान दें कि हम यहां बिना पुष्टि किए ऐक्सेस करने की अनुमति दे रहे हैं, क्योंकि यह एक डेमो ऐप्लिकेशन है. हमारा सुझाव है कि आप अपने एंटरप्राइज़ और प्रोडक्शन ऐप्लिकेशन के लिए, पुष्टि करने के सही तरीके का इस्तेमाल करें.

डप्लॉयमेंट पूरा होने के बाद, आपको यहां दिए गए लिंक जैसा लिंक मिलेगा:

https://amazing-gemini-app-*******.a.run.app/

अब गुप्त विंडो या अपने मोबाइल डिवाइस से ऐप्लिकेशन का इस्तेमाल करें. यह पहले से ही लाइव होना चाहिए.

7. चुनौती

अब आपको लोगों तक पहुंचने से कोई नहीं रोक सकता. क्या आपके पास कोड में बदलाव करने का तरीका है, ताकि वीडियो सीधे अपने कंप्यूटर से अपलोड किए जा सकें?

8. व्यवस्थित करें

इस कोडलैब में इस्तेमाल किए गए संसाधनों के लिए, अपने Google Cloud खाते से शुल्क न लिए जाने के लिए, यह तरीका अपनाएं:

Google Cloud Console में, संसाधन मैनेज करें पेज पर जाएं.
प्रोजेक्ट की सूची में, वह प्रोजेक्ट चुनें जिसे आपको मिटाना है. इसके बाद, मिटाएं पर क्लिक करें.
डायलॉग बॉक्स में, प्रोजेक्ट आईडी टाइप करें. इसके बाद, प्रोजेक्ट मिटाने के लिए बंद करें पर क्लिक करें.
इसके अलावा, कंसोल पर Cloud Run पर जाकर, अभी-अभी डिप्लॉय की गई सेवा को चुनें और उसे मिटाएं.