অ্যাপস স্ক্রিপ্ট: জেমিনি সিএলআই এবং এমসিপি সার্ভারের সাহায্যে জিমেইল অ্যাড-অনটি ভাইব-কোড করুন

1. সংক্ষিপ্ত বিবরণ

এই ল্যাবটি আপনাকে একটি আধুনিক, AI-চালিত কর্মপ্রবাহের মাধ্যমে পরিচালনা করবে যাতে আপনি শুরু থেকেই একটি গতিশীল Gmail অ্যাড-অন তৈরি করতে পারেন। আপনি Gemini CLI ব্যবহার করে একটি শক্তিশালী স্থানীয় উন্নয়ন পরিবেশ তৈরি করতে পারবেন, MCP (মডেল কনটেক্সট প্রোটোকল) সার্ভার এবং Gemini CLI এক্সটেনশন ব্যবহার করে gcloud এবং clasp এর মতো সরঞ্জামগুলিকে একীভূত করতে পারবেন।

আপনার তৈরি অ্যাড-অনটি গুগল ক্লাউডের ভার্টেক্স এআই প্ল্যাটফর্মে একটি ইমেজ মডেল কল করে চাহিদা অনুযায়ী একটি অনন্য বিড়ালের ছবি তৈরি করবে এবং প্রদর্শন করবে।

শেষ নাগাদ, আপনার কাছে একটি সম্পূর্ণ কার্যকরী Gmail অ্যাড-অন থাকবে যা Vertex AI API কে কল করে সরাসরি Gmail ইন্টারফেসের মধ্যে অনন্য ছবি তৈরি করবে, যা আপনার স্থানীয় কমান্ড লাইন থেকে পরিচালিত হবে।

২. তুমি যা শিখবে

এই ল্যাবটি সম্পন্ন করার মাধ্যমে, আপনি শিখবেন কিভাবে:

  • এক্সটেনশন সহ জেমিনি সিএলআই সেট আপ করুন এবং ব্যবহার করুন
  • একটি জিমেইল অ্যাড-অন তৈরি করুন যা একটি বহিরাগত API কল করে
  • ছবি তৈরি করতে Vertex AI API কল করতে অ্যাড-অনটি পরিবর্তন করুন।
  • অ্যাপস স্ক্রিপ্ট ইউজার ইন্টারফেস থেকে Google Workspace অ্যাড-অনের একটি পরীক্ষামূলক সংস্করণ স্থাপন করুন

৩. সেটআপ এবং প্রয়োজনীয়তা

ল্যাব শুরু করার আগে

  1. যদি আপনার ইতিমধ্যেই একটি Google অ্যাকাউন্ট না থাকে, তাহলে আপনাকে অবশ্যই একটি Google অ্যাকাউন্ট তৈরি করতে হবে। কর্মক্ষেত্র বা স্কুল অ্যাকাউন্টের পরিবর্তে একটি ব্যক্তিগত অ্যাকাউন্ট ব্যবহার করুন। কর্মক্ষেত্র এবং স্কুল অ্যাকাউন্টগুলিতে এমন বিধিনিষেধ থাকতে পারে যা আপনাকে এই ল্যাবের জন্য প্রয়োজনীয় API গুলি সক্ষম করতে বাধা দেয়।
  2. গুগল ক্লাউড কনসোলে সাইন-ইন করুন।
  3. ক্লাউড কনসোলে বিলিং সক্ষম করুন ।
  1. একটি নতুন প্রকল্প তৈরি করুন অথবা বিদ্যমান প্রকল্পটি পুনরায় ব্যবহার করতে বেছে নিন।

ল্যাবের প্রয়োজনীয়তা

এই ল্যাব থেকে সর্বাধিক সুবিধা পেতে, আপনার প্রয়োজন হবে:

  • ওয়েব ব্রাউজার: Chrome এর মতো একটি স্ট্যান্ডার্ড ওয়েব ব্রাউজার (প্রস্তাবিত)।
  • নিবেদিত সময়: ল্যাবের কার্যকলাপে মনোনিবেশ করার জন্য পর্যাপ্ত সময় আলাদা করুন।

৪. আপনার গুগল ক্লাউড এনভায়রনমেন্ট সেট আপ করুন

  1. অ্যাক্টিভেট ক্লাউড শেল আইকনে ক্লিক করুন। অনুসরণ : কনসোলের হেডারের উপরের ডানদিকের কোণায়, "Activate Cloud Shell" লেখা টার্মিনাল আইকনের উপর কার্সার রেখে ক্লিক করুন।
  2. অনুমোদন করুন ।
  3. আরম্ভের জন্য অপেক্ষা করুন: আপনার কনসোল উইন্ডোর নীচে একটি নতুন ফ্রেমে একটি ক্লাউড শেল সেশন খুলবে। সেশনটি শুরু হতে কয়েক মিনিট সময় লাগবে কারণ এটি আপনার জন্য একটি অস্থায়ী ডেবিয়ান-ভিত্তিক ভার্চুয়াল মেশিন (VM) সরবরাহ করে।
  4. সেশনটি শুরু হয়ে গেলে, আপনি একটি কমান্ড-লাইন প্রম্পট ( user@cloudshell:~ $ ) দেখতে পাবেন।
  5. আপনি আপনার ক্লাউড শেল উইন্ডোটি প্রসারিত করতে পারেন প্রসারিত বোতামে ক্লিক করে উইন্ডোর আকার বাড়াতে।
  6. আপনার প্রকল্প যাচাই করুন: কমান্ডটি চালান: 
gcloud config list project
  1. আপনার প্রকল্প পরিবর্তন করুন (প্রয়োজনে): 
gcloud config set project [YOUR_PROJECT_ID]

তুমি ল্যাবের কার্যক্রম শুরু করার জন্য প্রস্তুত!

৫. আপনার স্থানীয় উন্নয়ন পরিবেশ কনফিগার করুন

এই কাজে, আপনি আপনার টার্মিনাল থেকে আপনার ক্লাউড এবং অ্যাপস স্ক্রিপ্ট প্রকল্পগুলি পরিচালনা করার জন্য জেমিনি সিএলআই এবং এর এক্সটেনশনগুলি সেট আপ করবেন।

  1. ক্লাউড শেল পরিবেশের অংশ হিসেবে জেমিনি সিএলআই ইতিমধ্যেই ইনস্টল করা আছে, তাই এটি ইনস্টল করার কোন প্রয়োজন নেই।
  2. ক্লাউড শেল পরিবেশের অংশ হিসেবে ক্ল্যাস্প ইতিমধ্যেই ইনস্টল করা আছে, তবে আমরা নিশ্চিত করব যে আমরা এই ল্যাবে সর্বশেষ সংস্করণটি ব্যবহার করছি। 
npm install -g @google/clasp@latest
  1. নিম্নলিখিত কমান্ডটি প্রবেশ করে এবং নীচের নির্দেশাবলী অনুসরণ করে ক্ল্যাস্পকে আপনার অ্যাকাউন্ট অ্যাক্সেস করার অনুমতি দিন: 
clasp login --no-localhost

টার্মিনালে তৈরি URL-এ ক্লিক করে clasp অনুমোদন করুন। লগইন করার জন্য স্টুডেন্ট ল্যাব অ্যাকাউন্ট ব্যবহার করুন, এবং অনুমতি চাওয়া হলে Select all নির্বাচন করুন এবং Continue এ ক্লিক করুন। এরপর আপনি নীচের মত একটি ত্রুটি বার্তা দেখতে পাবেন।

db77651c2ce19d7f.png সম্পর্কে

আপনার ব্রাউজার উইন্ডো থেকে URL টি কপি করুন (যা http://localhost:8888/?code=xxx দিয়ে শুরু হয়) এবং এটি আপনার খোলা ক্লাউড শেল সেশনে পেস্ট করুন এবং এন্টার টিপুন। clasp অনুমোদনের প্রবাহ চালিয়ে যাবে এবং যদি আপনার লগইন সফল হয়, তাহলে আপনি You are logged in as user@gmail.com মতো একটি নিশ্চিতকরণ দেখতে পাবেন।

  1. ক্ল্যাস্প জেমিনি সিএলআই এক্সটেনশন ইনস্টল করুন। 
gemini extensions install https://github.com/google/clasp --consent
  1. gcloud Gemini CLI এক্সটেনশন ইনস্টল করুন। 
gemini extensions install https://github.com/gemini-cli-extensions/gcloud --consent
  1. গুগল ওয়ার্কস্পেস ডেভেলপার জেমিনি সিএলআই এক্সটেনশন ইনস্টল করুন। 
gemini extensions install https://github.com/googleworkspace/developer-tools --consent
  1. একটি খালি প্রকল্প ডিরেক্টরি তৈরি করুন: 
mkdir genai-cat-add-on
  1. আপনার নতুন তৈরি প্রকল্প ডিরেক্টরিতে পরিবর্তন করুন: 
cd genai-cat-add-on
  1. এই প্রকল্পের জন্য জেমিনি সিএলআই প্রসঙ্গ ফাইল কনফিগার করুন: 
cat << 'END_OF_FILE' > GEMINI.md
## **Gemini CLI Instructions for Gmail Add-on Development**

You are a methodical **Google Workspace extensibility and integration expert**. Your goal is to build a Gmail Add-on for the `genai-cat-add-on` project by writing Apps Script code and using command-line tools.

---

## **Tools Available**

*   **`clasp`**: Use this tool for all Apps Script project operations like pushing files.
*   **`gcloud`**: Use this tool for Google Cloud operations, such as enabling APIs or managing IAM permissions.
*   **`workspace-developer`**: Use this tool to search the official Google Workspace documentation for correct syntax, manifest properties, and required OAuth scopes.

---

## **Development Workflow and Validation**

You MUST follow the workflow below when building the add-on:

1.  **Mandatory Documentation Check**: Before creating, committing, or modifying any code (especially manifest files or Apps Script functions), you **MUST** first utilize the **`workspace-developer` tool** and use **search_workspace_docs** to search and validate the necessary Apps Script syntax, OAuth scopes, Apps Script services such as GmailApp, and best practices. Always refer to the official Google Workspace developer documentation via this tool for authoritative information.
2.  **Security and Scopes**: For every code commit or structural change, you must first **verify the manifest file (`appsscript.json`) includes the necessary OAuth scopes** for Gmail access and external API calls, ensuring you use the **minimal required scopes** and nothing more to adhere to the principle of least privilege.
3.  **Versioning/Persistence**: After any successful file creation, update, or deletion, you must ensure the changes are persistently saved and pushed using the appropriate `clasp` tool command.
4.  **Error Handling**: Include appropriate debugging and robust error handling code in all Apps Script functions.

---

## **Project and API Specifications**

* **Project Focus:** All work is centered on the **`genai-cat-add-on`** Apps Script project.
* **Vertex AI Details:** If asked to generate images, you must use the **`gemini-2.5-flash-image`** model on **Vertex AI**. Do NOT use imagen. All Vertex AI operations must use the currently logged-in user's credentials and the current Google Cloud project.
END_OF_FILE
  1. আপনার স্টুডেন্ট ল্যাব অ্যাকাউন্টে Google Apps Script API সক্রিয় করুন, এবং Google Apps Script API-এ ক্লিক করুন এবং এটিকে Off থেকে On এ টগল করুন।

অনুসরণ

৬. জেমিনি সিএলআই সেটআপ শুরু করুন এবং যাচাই করুন

  1. আপনার প্রজেক্ট ডিরেক্টরিতে জেমিনি শুরু করুন। 
gemini
  1. ডিফল্টরূপে, জেমিনি সিএলআই আপনাকে ফাইলগুলিতে পরিবর্তনগুলি পর্যালোচনা এবং গ্রহণ করতে বলবে। এই ল্যাবের জন্য, আমরা আপনাকে সময়মতো ল্যাব শেষ করতে সহায়তা করার জন্য স্বয়ংক্রিয়ভাবে সম্পাদনাগুলি গ্রহণ করতে Shift + Tab টিপে এটি বন্ধ করার পরামর্শ দিচ্ছি। আপনার স্ক্রিনে এখন এই বিকল্পটি লাল রঙে হাইলাইট করা উচিত।

31a7326896719d73.png সম্পর্কে

  1. GEMINI.md ফাইলটি লোড হয়েছে কিনা তা যাচাই করুন এবং Gemini CLI এর প্রসঙ্গে এটি কী লোড হয়েছে তা দেখান: 
/memory show
  1. MCP সার্ভারগুলি সঠিকভাবে কনফিগার করা আছে কিনা তা যাচাই করুন। gcloud MCP সার্ভারটি শুরু হতে কিছুটা সময় নিতে পারে, তাই এটি সংযোগ বিচ্ছিন্ন দেখাচ্ছে কিনা তা দেখে আতঙ্কিত হবেন না। কয়েক মিনিট অপেক্ষা করুন এবং আবার চেষ্টা করুন। 
/mcp list

৭. একটি জিমেইল অ্যাড-অন তৈরি করুন

  1. জেমিনিকে আমাদের জিমেইল অ্যাড-অনের প্রথম সংস্করণ তৈরি করতে বলুন: 
Use Apps Script to create a new Google Workspace add-on that displays a random cat image using the Cat-as-a-Service API upon opening the add-on in Gmail. Make sure you update the code and manifest files, use the correct scopes, and use the API documentation at https://cataas.com/doc.html.

Once done, provide a link to view the project.
  1. জেমিনি আপনার প্রম্পটে সাড়া দেওয়া শেষ করলে, প্রদত্ত লিঙ্কে ক্লিক করুন, অথবা অ্যাপস স্ক্রিপ্টের হোম পেজে যান এবং genai-cat-add-on প্রজেক্টে ক্লিক করুন।
  2. প্রজেক্ট সেটিংস আইকনে ক্লিক করুন (গিয়ার আইকন) 9485fddc5bf46369.png সম্পর্কে পৃষ্ঠার বাম দিকে।

2bc043bb3c3a216d.png সম্পর্কে

  1. " এডিটরে 'appsscript.json' ম্যানিফেস্ট ফাইল দেখান " বিকল্পটি নির্বাচন করুন।

e74dca570d64e540.png সম্পর্কে ৯. এডিটর স্ক্রিনে যান এবং Code.gs এ জেনারেট করা কোড এবং appsscript.json এ প্রজেক্ট কনফিগার করে এমন ম্যানিফেস্ট ফাইলটি দেখুন।

৮. অ্যাড-অনটি ইনস্টল এবং পরীক্ষা করুন

  1. অ্যাপস স্ক্রিপ্ট প্রকল্প পৃষ্ঠায় ফিরে যান।
  2. উপরে "স্থাপন" বোতামটি খুঁজুন।
  3. Deploy এর পাশের তীরটিতে ক্লিক করুন এবং Test deployments নির্বাচন করুন।
  4. "টেস্ট ডিপ্লয়মেন্ট" ডায়লগ বক্সে, আপনি অপ্রকাশিত অ্যাড-অনটি ইনস্টল করার জন্য একটি বিকল্প দেখতে পাবেন।
  5. ইনস্টল বোতামে ক্লিক করুন।
  6. একটি নিশ্চিতকরণ বার্তা আসবে। স্থাপনার ডায়ালগ বন্ধ করতে নীচে সম্পন্ন ক্লিক করুন।
  7. জিমেইল হোম পেজটি খুলুন এবং রিফ্রেশ করুন ।
  8. অ্যাড-অনটি এখন উপলব্ধ হওয়া উচিত। অ্যাড-অনটি ডান পাশের প্যানেলে প্রদর্শিত হবে।
  9. প্রথমবার যখন আপনি অ্যাড-অনের সাথে ইন্টারঅ্যাক্ট করবেন, তখন আপনাকে প্রয়োজনীয় ডেটা বা অনুমতি অ্যাক্সেস করার জন্য এটিকে অনুমোদন করতে বলা হবে। অনুমতি দেওয়ার জন্য অন-স্ক্রিন প্রম্পটগুলি অনুসরণ করুন।
  10. তুমি বিড়ালের একটি ছবি দেখতে পাবে। যদি না পাও, তাহলে ত্রুটি বার্তাটি শেয়ার করে জেমিনি CLI দিয়ে সমস্যা সমাধান করুন।

৯. এআই ইমেজ জেনারেশন লজিক বাস্তবায়ন করুন

  1. জেমিনিকে এখন একটি ছবি তৈরি করার জন্য যুক্তি যোগ করতে বলুন: 
Now update the add-on to display an AI-generated image using the samples in https://docs.cloud.google.com/vertex-ai/generative-ai/docs/multimodal/image-generation#use-image-generation. 

The image should show a cute cat if I open my inbox, and should add a speech bubble saying "<email sender name> rocks!" with the actual sender name when I open an email.
  1. জিমেইল হোম পেজ রিফ্রেশ করুন এবং অ্যাড-অনটি আবার খুলুন। নতুন কোনও অনুমতি চাইলে তা গ্রহণ করুন।
  2. এখন একটি AI-জেনারেটেড বিড়ালের ছবি প্রদর্শিত হবে। যদি কোনও ছবি দেখা না যায়, তাহলে ত্রুটি বার্তাটি শেয়ার করে এবং এর নির্দেশাবলী অনুসরণ করে Gemini CLI-এর সাথে সমস্যা সমাধান করুন।
  3. একটি ইমেল খুলুন এবং লক্ষ্য করুন কিভাবে ছবিটি পরিবর্তিত হয়ে প্রেরকের নাম সহ একটি স্পিচ বাবল দেখায়। পূর্ববর্তী ধাপের মতো জেমিনি CLI-এর সাথে যেকোনো সমস্যা সমাধান করুন।

১০. [ঐচ্ছিক] পশুর ধরণ ড্রপডাউন যোগ করুন

  1. জেমিনিকে বিড়ালের ছবি ছাড়াও অন্যান্য প্রাণী তৈরির বিকল্প যোগ করতে বলুন। 
Add a dropdown menu that lets the user choose the type of animal image it wants. Choose 2 random animals to add to the list in addition to the cat image.
  1. তিনটি উল্লম্ব বিন্দুতে ক্লিক করে এবং রিফ্রেশ ক্লিক করে অ্যাড-অনটি রিফ্রেশ করুন, অথবা জিমেইল হোম পেজ রিফ্রেশ করে আবার অ্যাড-অনটি খুলুন।
  2. অন্য একটি প্রাণীর ছবি নির্বাচন করে নতুন কার্যকারিতা পরীক্ষা করুন। যদি কোনও ত্রুটি থাকে, যেমন UI রিফ্রেশ হচ্ছে না বা কোনও ত্রুটি দেখা যাচ্ছে, তাহলে ত্রুটি বার্তাটি শেয়ার করে এবং এর নির্দেশাবলী অনুসরণ করে Gemini CLI-এর সাথে সমস্যা সমাধান করুন।

১১. পরিষ্কার করা

জেমিনি সিএলআই থেকে প্রস্থান করুন

জেমিনি সিএলআই থেকে বেরিয়ে আসুন এবং নিম্নলিখিত কমান্ডটি ব্যবহার করে আপনার ব্যবহারের পরিসংখ্যান দেখুন: 

/quit

গুগল ক্লাউড প্রোজেক্ট মুছুন

এই কোডল্যাবে ব্যবহৃত রিসোর্সের জন্য আপনার Google ক্লাউড অ্যাকাউন্টে চার্জ এড়াতে, আমরা আপনাকে Google ক্লাউড প্রোজেক্টটি মুছে ফেলার পরামর্শ দিচ্ছি। 

gcloud projects delete $GOOGLE_CLOUD_PROJECT

অ্যাপস স্ক্রিপ্ট প্রজেক্ট মুছুন

ক্লিক করুন dc2524b2c9878567.png সম্পর্কে বাম নেভিগেশন প্যানেলে তথ্য আইকন, এবং তারপর 4ad389ddfeda5d7f.png সম্পর্কে অ্যাপস স্ক্রিপ্ট প্রজেক্টটি সরাতে স্ক্রিনের ডানদিকে ট্র্যাশ আইকন।

১২. সমস্যা সমাধানের টিপস

  • যদি আপনার জেমিনি সিএলআই এবং এক্সটেনশন নিয়ে সমস্যা হয়, তাহলে আপনি জেমিনি সিএলআই-এর একটি নির্দিষ্ট কার্যকরী সংস্করণ চালানোর জন্য নিম্নলিখিত কমান্ডটি ব্যবহার করতে পারেন: 
npx https://github.com/google-gemini/gemini-cli#v0.12.0
  • যদি তুমি কোন ত্রুটির সম্মুখীন হও, তাহলে জেমিনিকে বলো যেন সেগুলি ঠিক করে দেয় এবং ত্রুটি এবং প্রেক্ষাপট (যেখানে এটি ঘটছে) শেয়ার করে।
  • যদি জেমিনি ত্রুটি লগিং প্রয়োগ করে এবং আপনাকে কোনও ত্রুটি শেয়ার করতে বলে, তাহলে ত্রুটির কারণ হওয়া পদক্ষেপগুলি পুনরায় চালান এবং তারপরে জেমিনির সাথে ফলাফল শেয়ার করুন।
  • আপনি এই ধরনের একটি প্রম্পট চেষ্টা করতে পারেন: 
You have my permission to fix any errors. Please go ahead and make it work.
  • যদি আপনি আটকে থাকেন এবং মিথুন রাশিকে সাহায্য করতে চান, তাহলে আপনি নিম্নলিখিত প্রম্পটটি ব্যবহার করতে পারেন: 
Use the following Github repo as a reference implementation to make my add-on work: https://github.com/googleworkspace/add-ons-samples/tree/main/apps-script/generative-ai/cat-add-on

১৩. অভিনন্দন!

তুমি ল্যাবটি সফলভাবে সম্পন্ন করেছ এবং একটি Gmail অ্যাড-অন ভাইব-কোড করার জন্য Gemini CLI ব্যবহার করেছ।

এই ল্যাবে, আপনি শিখেছেন কিভাবে:

  • জেমিনি সিএলআই ব্যবহার করুন।
  • MCP (মডেল কনটেক্সট প্রোটোকল) সার্ভার ব্যবহার করে টুল ইনস্টল করুন এবং জেমিনি CLI প্রসারিত করুন।
  • একটি Gmail অ্যাড-অন তৈরি করুন, স্থাপন করুন এবং ইনস্টল করুন।

তুমি এখন আমাদের পরবর্তী ল্যাবে যাওয়ার জন্য প্রস্তুত।