এই পৃষ্ঠাটি Cloud Translation API অনুবাদ করেছে।

একটি বিদ্যমান অ্যাপ্লিকেশন অন্বেষণ এবং উন্নত করতে কিভাবে Gemini ব্যবহার করবেন

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

এই কোডল্যাবে দেখানো হবে কিভাবে একটি বিদ্যমান এপিআই ব্যাকএন্ডের উপর ভিত্তি করে জেমিনি ব্যবহার করে একটি ক্লায়েন্ট অ্যাপ্লিকেশন তৈরি করা যায়।

আপনি যা শিখবেন

এই ল্যাবটির উদ্দেশ্য হলো একটি বিদ্যমান অ্যাপ্লিকেশনের সাথে জেমিনি ব্যবহারের পদ্ধতি দেখানো। এই ল্যাবে, আপনি নিম্নলিখিত বিষয়গুলো করতে শিখবেন:

AI/ML ইমেজ প্রসেসিং জাম্প স্টার্ট সলিউশনটি স্থাপন করুন
এপিআই অ্যাপ্লিকেশনটি অন্বেষণ করতে জেমিনি ব্যবহার করুন।
এপিআই অ্যাপ্লিকেশনের জন্য একটি ক্লায়েন্ট তৈরি করতে জেমিনি ব্যবহার করুন।

সেটআপ - একটি নতুন প্রজেক্ট তৈরি করুন

আপনার প্রতিষ্ঠানের নীতিমালার ওপর নির্ভর করে, আপনি এই সমাধানটি সঠিকভাবে প্রয়োগ করতে সক্ষম নাও হতে পারেন।

পরামর্শ: কোম্পানি বা শিক্ষা প্রতিষ্ঠানের অ্যাকাউন্টের পরিবর্তে এমন একটি অ্যাকাউন্ট ব্যবহার করুন যেখানে আপনার সম্পূর্ণ অনুমতি রয়েছে (যেমন ব্যক্তিগত অ্যাকাউন্ট)।

দ্রষ্টব্য: আপনি যদি সম্প্রতি এমন একটি প্রজেক্ট তৈরি করে থাকেন যেখানে আপনার সম্পূর্ণ অনুমতি রয়েছে এবং সেই প্রজেক্টে ইতিমধ্যেই Gemini API সক্রিয় করা আছে, তাহলে আপনি এই ধাপটি এড়িয়ে গিয়ে সেই প্রজেক্টটি ব্যবহার করা চালিয়ে যেতে পারেন। উদাহরণস্বরূপ, আপনি যদি সম্প্রতি অন্য কোনো Gemini কোডল্যাব সম্পন্ন করে থাকেন, তাহলে আপনি এই ধাপটি এড়িয়ে যেতে পারেন।

গুগল ক্লাউড কনসোলে যান
বর্তমান প্রজেক্ট ড্রপডাউনটিতে ক্লিক করুন।
নতুন প্রকল্পে ক্লিক করুন
একটি প্রজেক্টের নাম যোগ করুন এবং CREATE-এ ক্লিক করুন।
- পরামর্শ: একটি অনন্য প্রজেক্ট নাম ব্যবহার করুন যাতে Project name এবং Project ID একই হয়।

২. জাম্প স্টার্ট সলিউশনটি স্থাপন করুন

জাম্প স্টার্ট সলিউশন হলো গুগল ক্লাউডের পূর্ব-নির্মিত সলিউশন টেমপ্লেট। এই ল্যাবে একটি জাম্প স্টার্ট সলিউশন ব্যবহার করে দেখানো হয়েছে, কীভাবে জেমিনি একটি পূর্ব-বিদ্যমান অ্যাপ্লিকেশনকে উন্নত করতে সাহায্য করতে পারে।

AI/ML ইমেজ প্রসেসিং জাম্প স্টার্ট সলিউশনের বিস্তারিত পৃষ্ঠায় যান
- হ্যামবার্গার মেনুতে ক্লিক করুন
- Products & solutions সাবমেনুতে, Jump Start Solutions-এ ক্লিক করুন।
- ক্লাউড ফাংশনে AI/ML ইমেজ প্রসেসিং-এ ক্লিক করুন
DEPLOY ক্লিক করুন
- আপনার প্রজেক্টে বিলিং চালু করা না থাকলে, বিলিং চালু করুন ।
- প্রকল্পের নাম নিশ্চিত করুন এবং চালিয়ে যান-এ ক্লিক করুন।
- অঞ্চল হিসেবে us-central1 (Iowa) নির্বাচন করুন।
- অন্য কোনো ইনপুট দিতে বলা হলে, ডিফল্টগুলো গ্রহণ করুন।
- DEPLOY-তে ক্লিক করুন।
- এতে ১৫ মিনিট পর্যন্ত সময় লাগতে পারে।
- আপনাকে কোনো পরিবর্তন করতে হবে না, তবে আপনি নির্দ্বিধায় জাম্প স্টার্ট সলিউশন ডেপ্লয়মেন্টটি অন্বেষণ করতে পারেন।

সমস্যা সমাধান

সমস্যা: আপনি কি Partial deployment. লেখা কোনো ত্রুটি দেখতে পাচ্ছেন?
- সমাধান: দুর্ভাগ্যবশত, এর মানে হলো আপনাকে সম্ভবত ডেপ্লয়মেন্টটি ডিলিট করে আবার নতুন করে শুরু করতে হবে। সেখানে DELETE DEPLOYMENT লেখা একটি বাটন থাকার কথা। সেই বাটনটিতে ক্লিক করুন এবং তারপর জাম্প স্টার্ট সলিউশনটি পুনরায় ডেপ্লয় করুন।

৩. মিথুন রাশি সক্রিয় করুন

আপনার কোড সম্পাদনার পরিবেশ সেট আপ করুন এবং জেমিনি সক্রিয় করুন।

ক্লাউড শেল এডিটরে যান
- গুগল ক্লাউড কনসোলে ফিরে যান
- সার্চ বারে Cloud Shell Editor টাইপ করুন এবং ড্রপডাউন থেকে Cloud Shell Editor-এ ক্লিক করুন।
- আপনি যদি লিগ্যাসি এডিটর ব্যবহার করে থাকেন, তাহলে ‘নতুন এডিটরটি ব্যবহার করে দেখুন’ বিকল্পে ক্লিক করুন।
  - দ্রষ্টব্য: আপনি যদি ‘Try the new Editor’ বাটনটি দেখতে না পান, তাহলে সম্ভবত আপনি ইতিমধ্যেই নতুন এডিটরটি ব্যবহার করছেন। লিগ্যাসি এডিটরটি কাজ করবে, কিন্তু ভিউগুলো দেখতে কিছুটা ভিন্ন হবে।
- নতুন উইন্ডোতে খুলুন আইকনটিতে ক্লিক করুন
অনুরোধ করা হলে, লগ ইন করুন অথবা আপনার অ্যাকাউন্ট অনুমোদন করুন।
- আপনার সেটিংসের উপর নির্ভর করে, এই ল্যাব চলাকালীন আপনাকে একাধিকবার আপনার অ্যাকাউন্ট অনুমোদন করতে বলা হতে পারে; যখন জিজ্ঞাসা করা হবে, প্রতিবার 'অনুমোদন করুন' (authorize) নির্বাচন করুন।
দেখানো অনুযায়ী নিচের স্ট্যাটাস বারে থাকা ক্লাউড কোড - সাইন ইন বোতামটিতে ক্লিক করুন। নির্দেশনা অনুযায়ী প্লাগইনটি অনুমোদন করুন।
অনুরোধ করা হলে, 'Select a Google Cloud project'-এ ক্লিক করুন এবং তারপর আপনি যে প্রজেক্টটি ব্যবহার করছেন সেটি নির্বাচন করুন।
মিথুন রাশি সক্রিয় করুন
- ক্লিক ক্লাউড কোড
  - দ্রষ্টব্য: আপনার স্ক্রিনের আকারের উপর নির্ভর করে, এতে এক বা দুই ধাপ সময় লাগতে পারে।
- HELP AND FEEDBACK বিভাগে Change Settings- এ ক্লিক করুন
- Gemini: Enable
- চেকবক্সটি নির্বাচন করুন (যদি এটি আগে থেকে নির্বাচিত না থাকে)।
- আপনার IDE পুনরায় লোড করুন।
- এর ফলে ক্লাউড কোডে জেমিনি সক্রিয় হয় এবং আপনার IDE-তে জেমিনি স্ট্যাটাস বারটি প্রদর্শিত হয়।
দেখানো অনুযায়ী নিচের ডান কোণায় থাকা জেমিনি বাটনে ক্লিক করুন এবং সঠিক গুগল ক্লাউড প্রজেক্টটি নির্বাচন করুন।
- যদি আপনি এমন কোনো ত্রুটি দেখতে পান যে Gemini has not been enabled for your selected project , তাহলে Enable Gemini API-তে ক্লিক করুন।
নিচে দেখানো স্ট্যাটাস বারে, বাম দিকে সঠিক Google Cloud প্রজেক্ট (আপনি আপনার প্রজেক্টের নাম দেখতে পাবেন) এবং ডান দিকে Gemini চালু আছে কিনা তা নিশ্চিত করুন:

৪. ক্লাউড ফাংশন কোডটি ডাউনলোড করুন

কোডটি ডাউনলোড করুন এবং জাম্প স্টার্ট সলিউশনস ও আপনার ডেপ্লয় করা কোড সম্পর্কে আরও জানতে জেমিনি ব্যবহার করুন।

আপনি যদি অন্য কোথাও চলে গিয়ে থাকেন, তাহলে ক্লাউড কোড-এ ক্লিক করুন।
ক্লিক ক্লাউড ফাংশন
- যদি আপনি ‘প্রজেক্ট নির্বাচন করুন’ বাটনটি দেখতে পান, তাহলে সেটিতে ক্লিক করুন এবং যে প্রজেক্টটি নিয়ে কাজ করছেন সেটি নির্বাচন করুন।
- annotate-http ফাংশনটিতে ক্লিক করুন
- নতুন ওয়ার্কস্পেসে ডাউনলোড করার আইকনে ক্লিক করুন
ওয়ার্কস্পেসের নাম হিসেবে annotate-http-1 ব্যবহার করুন (এটিই ডিফল্ট থাকা উচিত) এবং OK-তে ক্লিক করুন।
main.py ফাইলটি খুলুন
- এক্সপ্লোরার আইকনে ক্লিক করুন
- main.py ফাইলটি খুলতে ক্লিক করুন।
জেমিনি চ্যাট আইকনে ক্লিক করুন
- দ্রষ্টব্য: আপনার স্ক্রিনের আকারের উপর নির্ভর করে, এতে এক বা দুই ধাপ সময় লাগতে পারে।
মিথুন রাশিকে একটি প্রশ্ন জিজ্ঞাসা করার চেষ্টা করুন। এই ধরনের একটি প্রম্পট লিখুন:
- What is a Jump Start Solution in Google Cloud?
- Explain this code.

জেমিনি চ্যাট রিসেট করা হচ্ছে

প্রম্পটগুলো ভবিষ্যতের প্রম্পটগুলোকে প্রভাবিত করে। উদাহরণস্বরূপ, আপনি যদি প্রজেক্ট আইডি বা অঞ্চলের নামে টাইপ করার সময় কোনো ভুল করেন, তবে সেই ভুলগুলো ভবিষ্যতের প্রম্পট এবং উত্তরগুলোতেও থেকে যাবে, যা আপনার অভিজ্ঞতাকে নেতিবাচকভাবে প্রভাবিত করতে পারে। আপনি যদি টাইপ করার সময় কোনো ভুল করে থাকেন বা অন্য কোনো কারণে হিস্ট্রি মুছে ফেলতে চান, তাহলে চ্যাটটি রিসেট করার জন্য ট্র্যাশ ক্যান আইকনটি ব্যবহার করতে পারেন।

ডুয়েট চ্যাট ট্র্যাশ ক্যান হাইলাইট রিসেট করুন

৫. বিদ্যমান ক্লাউড ফাংশন এন্ডপয়েন্টকে কল করা

কোডটি অন্বেষণ করুন এবং জাম্প স্টার্ট সলিউশনে আপনার স্থাপন করা এন্ডপয়েন্টটি কল করুন।

প্রম্পটটি প্রবেশ করান:
- গুরুত্বপূর্ণ: নিম্নলিখিত প্রম্পটে my-project-with-duet পরিবর্তে আপনার প্রজেক্ট আইডি ব্যবহার করুন।
- The region is us-central1 and the project id is my-project-with-duet. Write a curl post for the /annotate-http/annotate Cloud Function endpoint that performs label detection on the default eiffel tower image.
- আপনি এমন একটি প্রতিক্রিয়া পাবেন যাতে এই ধরনের একটি কার্ল কমান্ড অন্তর্ভুক্ত থাকবে:
```
curl -X POST \
    -H "Authorization: Bearer $(gcloud auth print-access-token)" \
...
```
- পরবর্তী ধাপে ব্যবহারের জন্য এই কার্ল (curl) কমান্ডটি কপি করুন।
একটি নতুন টার্মিনালে কমান্ডটি পরীক্ষা করে দেখুন
- হ্যামবার্গার মেনুতে ক্লিক করুন
- টার্মিনালে ক্লিক করুন
- নতুন টার্মিনালে ক্লিক করুন
- পূর্ববর্তী ধাপ থেকে curl কমান্ডটি টার্মিনালে পেস্ট করুন এবং কমান্ডটি চালানোর জন্য Enter চাপুন।
- আপনি এমন একটি প্রতিক্রিয়া পাবেন যা এইভাবে শুরু হবে:
```
{
    "labelAnnotations": [
    {
    "mid": "/m/0csby",
    "description": "Cloud",
    "score": 0.97885925,
    "topicality": 0.97885925,
...
```
(ঐচ্ছিক) পাবলিক ইন্টারনেট থেকে অন্য কোনো ছবি ব্যবহার করে এটি করার জন্য, ডুয়েটকে নিচের মতো কিছু দিয়ে নির্দেশ দিন:
- Do the same thing with the image https://storage.googleapis.com/cloud-samples-data/vision/eiffel_tower.jpg

সমস্যা সমাধান

অনির্দিষ্টতা সম্পর্কে দ্রষ্টব্য: জেমিনি এবং লার্জ ল্যাঙ্গুয়েজ মডেল (LLM) দ্বারা চালিত অন্যান্য পণ্যগুলি অনির্দিষ্ট প্রকৃতির; অর্থাৎ, একই ইনপুট দিলেও আপনি ভিন্ন আউটপুট পেতে পারেন। এমনকি আপনি ধাপগুলি নিখুঁতভাবে অনুসরণ করলেও, কার্যকরী কমান্ড নাও পেতে পারেন। এই সমস্যা সমাধানের ধাপগুলি আপনাকে সেই পরিস্থিতিগুলি কাটিয়ে উঠতে সাহায্য করবে।

তৈরি হওয়া কার্ল কমান্ডটি দেখতে অনেকটা এইরকম হবে:

curl -X POST \
    -H "Authorization: Bearer $(gcloud auth print-access-token)" \
    -H "Content-Type: application/json" \
    -d '{
  "image_uri": "gs://cloud-samples-data/vision/eiffel_tower.jpg",
  "features": "LABEL_DETECTION"
}' \
    "https://us-central1-my-project-with-duet.cloudfunctions.net/annotate-http/annotate"

জেমিনি তার main.py ফাইলে TEST_IMAGE ব্যবহার করছে, যেটি আইফেল টাওয়ারের একটি ছবি ।

যদি `curl` কমান্ডটি আপনার ক্ষেত্রে কাজ না করে, তাহলে এখানে কয়েকটি বিষয় যাচাই করে দেখতে পারেন:

সমস্যা: URL এন্ডপয়েন্টে কি .a.run.app অন্তর্ভুক্ত আছে?
- সমাধান: Duet মনে করতে পারে যে আপনি Cloud Run-এ ডেপ্লয় করছেন। সঠিক Cloud Functions এন্ডপয়েন্টটি পেতে https://us-central1-my-project-with-duet.cloudfunctions.net/annotate-http/annotate এ my-project-with-duet এর জায়গায় আপনার প্রজেক্ট আইডি বসান এবং curl কমান্ডের জন্য সেটি ব্যবহার করুন।
সমস্যা: URL এন্ডপয়েন্টটিতে কি my-project-with-duet অন্তর্ভুক্ত আছে?
- সমাধান: my-project-with-duet এর জায়গায় আপনার প্রজেক্ট আইডি বসান।
সমস্যা: URL এন্ডপয়েন্টটিতে কি us-central1 অনুপস্থিত?
- সমাধান: নিশ্চিত করুন যে URL-টি us-central1 দিয়ে শুরু হয়, যেমন: https://us-central1-my-project-with-duet.cloudfunctions.net/annotate-http/annotate এবং সাথে আপনার প্রজেক্ট আইডি।
সমস্যা: ব্যবহৃত প্রম্পটের উপর নির্ভর করে, কখনও কখনও তৈরি হওয়া এন্ডপয়েন্টটি cloudfunctions.net/annotate-http অথবা cloudfunctions.net/annotate এর মতো দেখায়। URL এন্ডপয়েন্টটির শেষে কি /annotate-http/annotate নেই?
- সমাধান: নিশ্চিত করুন যে URL এন্ডপয়েন্টটি সম্পূর্ণ API অ্যাপ্লিকেশন পাথ cloudfunctions.net/annotate-http/annotate দিয়ে শেষ হয়।
সমস্যা: cURL রিকোয়েস্টটি কাজ করছে, কিন্তু খুব বেশি তথ্য ফেরত আসছে না। রিকোয়েস্টটিতে কি ফিচার অন্তর্ভুক্ত আছে?
- সমাধান: এটি কোনো বড় সমস্যা নয়। কোনো কিছু পরিবর্তন না করে চালিয়ে গেলে ল্যাবের বাকি অংশ ঠিকঠাক কাজ করবে। আপনি যদি আরও তথ্য পেতে চান, তাহলে cURL অনুরোধে নতুন ফিচার যোগ করার জন্য Duet-কে বলতে পারেন।
সমস্যা: উত্তরগুলো ভুল বলে মনে হচ্ছে অথবা সেগুলোতে কোড-নির্দিষ্ট প্রেক্ষাপটের অভাব রয়েছে। আপনি কি ক্লাউড শেল এডিটরের মধ্যে জেমিনি চ্যাট ব্যবহার করছেন?
- সমাধান: ক্লাউড শেল এডিটর-এর মধ্যে জেমিনি চ্যাট ব্যবহার করার সময় main.py ফাইলটি খুলে আপনার প্রম্পট সম্পর্কিত কোডটি হাইলাইট করার চেষ্টা করুন। গুগল ক্লাউড জুড়ে জেমিনি অ্যাসিস্ট্যান্টের প্রেক্ষাপট ভিন্ন হয়, যার ফলে উত্তরও ভিন্ন ভিন্ন হবে।
সমস্যা: তাৎক্ষণিক প্রতিক্রিয়াটি এখনও পুরোপুরি সঠিক নয়।
- সমাধান: একটি ভিন্ন প্রম্পট ব্যবহার করে দেখুন, যেখানে আপনি জেমিনিকে আরও বেশি নির্দেশনা দেবেন যে আপনি কী তৈরি করতে চান। my-project-with-duet এর জায়গায় আপনার প্রজেক্ট আইডি বসাতে ভুলবেন না। এখানে একটি উদাহরণ দেওয়া হলো:
```
Give me the curl command for:

1- Cloud Function running in us-central1 and project my-project-with-duet
2- HTTP POST to the following endpoint: /annotate-http/annotate endpoint
3- JSON in the body: { "image_uri": "gs://cloud-samples-data/vision/eiffel_tower.jpg", "features": "LABEL_DETECTION" }
```
সমস্যা: এই সমস্ত সমস্যা সমাধানের পদক্ষেপগুলো অনুসরণ করার পরেও এটি এখনও কাজ করছে না।
- সমাধান: এলএলএম-এর অনির্দিষ্ট প্রকৃতির কারণে, এমনটা হতে পারে যে ডুয়েট এমন একটি প্রতিক্রিয়া তৈরি করেছে যা কাজ করবে না। যদি এমনটা হয়, তবে উপরের উদাহরণ কার্ল (curl) কমান্ডটি কপি করে টার্মিনালে চালানোর চেষ্টা করুন। অবশ্যই my-project-with-duet এর জায়গায় আপনার প্রজেক্ট আইডি বসাবেন।

৬. এপিআই-এর জন্য একটি ওয়েব অ্যাপ্লিকেশন ক্লায়েন্ট তৈরি করুন।

Gemini ব্যবহার করে একটি index.html ফাইল তৈরি করুন যা Jump Start Solution Cloud Function এন্ডপয়েন্টকে কল করে। এরপর, কোডটির কার্যকারিতা দেখতে index.html ফাইলটি Firebase হোস্টিং- এ ডিপ্লয় করুন।

ক্লায়েন্ট-সাইড কোড তৈরি করুন
- জেমিনি চ্যাট বক্সে ফিরে এসে, এই প্রম্পটটি লিখুন:
  - Write an index.html file that takes two inputs: a text input for the image_uri and a dropdown for the features. It should make a post request and display the raw json result to the DOM. The fetch call should use the full url beginning with https. The default image_uri should be gs://cloud-samples-data/vision/eiffel_tower.jpg.
- রেসপন্সে তৈরি হওয়া index.html ফাইলটি কপি করুন।
  - দ্রষ্টব্য: পরবর্তীতে আপনার এই কোডটির প্রয়োজন হবে, তাই এটি হারিয়ে যাওয়ার আশঙ্কা থাকলে কোথাও সংরক্ষণ করে রাখুন।
- main.py বন্ধ করুন।
একটি নতুন frontend ডিরেক্টরি তৈরি করুন
- আপনি মিথুন রাশিকে এইরকম কিছু জিজ্ঞাসা করতে পারেন:
  - What are the console commands to create and navigate to a new frontend directory?
- আপনি mkdir frontend এবং cd frontend মতো ফলাফল দেখতে পাবেন।
- আপনি এখনও annotate-http-1 ডিরেক্টরিতে আছেন কিনা তা নিশ্চিত করতে ক্লাউড শেল টার্মিনাল ব্যবহার করুন এবং এই কমান্ডগুলো চালান:
  - cd ~/annotate-http-1
  - mkdir frontend
  - cd frontend
ক্লাউড শেল টার্মিনালে আপনি সঠিক প্রজেক্টে লগ ইন করেছেন কিনা তা নিশ্চিত করুন।
- আপনি মিথুন রাশিকে এইরকম কিছু জিজ্ঞাসা করতে পারেন:
  - What is the gcloud command to set my project?
- আপনি gcloud config set project my-project-with-duet মতো একটি ফলাফল দেখতে পাবেন।
  - প্রজেক্ট আইডিটি সঠিক কিনা তা নিশ্চিত করুন, তারপর ক্লাউড শেল টার্মিনালে কমান্ডটি চালান।
ফায়ারবেস সক্রিয় করুন
- একটি নতুন ট্যাবে (আপনার বর্তমান ক্লাউড শেল এডিটর খোলা রাখুন), https://console.firebase.google.com/ এ যান।
- প্রজেক্ট যোগ করুন ক্লিক করুন
- আপনার প্রজেক্ট আইডি টাইপ করুন এবং ড্রপডাউনে এটি প্রদর্শিত হওয়ার জন্য অপেক্ষা করুন।
- আপনার প্রজেক্ট আইডিতে ক্লিক করুন
- চালিয়ে যান ক্লিক করুন
- প্ল্যান নিশ্চিত করতে ক্লিক করুন
- চালিয়ে যান ক্লিক করুন
- এই প্রোজেক্টের জন্য Google Analytics সক্ষম করার বিকল্পটি অনির্বাচিত করুন।
  - ফায়ারবেস গুগল অ্যানালিটিক্স ব্যবহারের সুপারিশ করলেও, এই অ্যাপ্লিকেশনে তা ব্যবহার করা হবে না।
- চালিয়ে যান ক্লিক করুন
- এই ট্যাবটি বন্ধ করুন এবং ক্লাউড শেল এডিটর-এ ফিরে যান।
- দ্রষ্টব্য: এই ধাপগুলো শুধুমাত্র সেইসব ব্যবহারকারীদের জন্য প্রয়োজন যারা আগে ফায়ারবেস ব্যবহার করেননি, তবে এটি সবাইকে একই পথ অনুসরণ করার সুযোগ দেয়। আপনি যদি ভবিষ্যতে আবার এটি করেন, তাহলে এই ধাপটি বাদ দিতে পারেন।
ক্লাউড শেলে ফায়ারবেসে লগ ইন করুন
- ক্লাউড শেল এডিটর টার্মিনালে firebase login --no-localhost কমান্ডটি চালান।
- প্রদত্ত URL-টি ভিজিট করুন।
  - হ্যাঁ ক্লিক করুন, আমি এইমাত্র এই কমান্ডটি চালিয়েছি।
  - হ্যাঁ, এটি আমার সেশন আইডি-তে ক্লিক করুন।
  - কপি করতে ক্লিক করুন
- ক্লাউড শেল এডিটর টার্মিনালে ফিরে যান
- টার্মিনালে যেখানে ' Enter authorization code: লেখা আছে, সেখানে কপি করা মানটি পেস্ট করুন।
- Enter চাপুন
ফায়ারবেস হোস্টিং-এ একটি নতুন ওয়েবসাইট স্থাপন করুন
- একটি নতুন ফায়ারবেস প্রজেক্ট শুরু করুন
  - আপনি মিথুন রাশিকে এইরকম কিছু জিজ্ঞাসা করতে পারেন:
    - What are the commands to initialize and deploy a new firebase application?
  - আপনি firebase init এবং firebase deploy মতো ফলাফল ও নির্দেশনা দেখতে পাবেন।
  - যেহেতু আপনার পছন্দের উপর নির্ভর করে মিথুন রাশি এটি করার জন্য অনেক সম্ভাব্য উপায়ের পরামর্শ দিতে পারে, তাই এখানে আপনার অনুসরণ করার জন্য একটি নির্দিষ্ট সুপারিশ দেওয়া হলো:
    - firebase init
      - Hosting: Configure files for Firebase Hosting and (optionally) set up GitHub Action deploys
        Space বার চাপুন
        Enter চাপুন
      - Use an existing project করতে নিচের অ্যারোতে ক্লিক করুন।
        Enter চাপুন
      - যদি আপনি প্রজেক্টের একটি তালিকা দেখতে পান, তাহলে অ্যারো দিয়ে নিচে নেমে আপনি আজ যে প্রজেক্টটি ব্যবহার করছেন সেটিতে যান।
        Enter চাপুন
      - Please input the ID of the Google Cloud Project you would like to add Firebase:
        আপনার প্রজেক্টের প্রজেক্ট আইডি টাইপ করুন।
        Enter চাপুন
      - বাকি সব প্রম্পটের জন্য Enter চাপুন।
    - firebase deploy
ক্লাউড ফাংশনস এপিআই এন্ডপয়েন্টে একটি কলের মাধ্যমে আপনার অ্যাপ্লিকেশনটি পুনরায় ডিপ্লয় করুন।
- পূর্ববর্তী কমান্ডগুলো আপনার আগে তৈরি করা frontend ডিরেক্টরির ভিতরে একটি index.html ফাইলসহ একটি public ডিরেক্টরি তৈরি করবে। ~/annotate-http-1/frontend/public/index.html ফাইলটিতেই আপনাকে পরবর্তী কয়েকটি পরিবর্তন করতে হবে।
- index.html ফাইলটি খুলুন।
  - এক্সপ্লোরার আইকনে ক্লিক করুন
  - frontend ফোল্ডারে ক্লিক করুন
  - public ফোল্ডারে ক্লিক করুন
  - index.html ফাইলটিতে ক্লিক করুন
- বিদ্যমান index.html ফাইলটি খালি করে দিন।
- পূর্বে কপি করা কোডটি index.html ফাইলে পেস্ট করুন।
- নতুন অ্যাপ্লিকেশনটি ডেপ্লয় করতে firebase deploy চালান।
- এটি কাজ করছে কিনা তা দেখতে ফায়ারবেস হোস্টিং ইউআরএল-টি ভিজিট করুন!
  - দ্রষ্টব্য: আপনার আপডেটগুলি দেখতে সম্ভবত ওয়েবসাইটটি হার্ড রিফ্রেশ করতে হবে।

সমস্যা সমাধান

index.html ফাইলটি দেখতে অনেকটা এইরকম হবে:

<!DOCTYPE html>
<html>
<head>
<title>Vision API Annotate Image</title>
</head>
<body>
<h1>Vision API Annotate Image</h1>
<form id="annotate-form" action="https://us-central1-my-project-with-duet.cloudfunctions.net/annotate-http/annotate" method="POST">
    <label for="image-uri">Image URI:</label>
    <input type="text" id="image-uri" name="image_uri" value="gs://cloud-samples-data/vision/eiffel_tower.jpg">
    <br>
    <label for="features">Features:</label>
    <select id="features" name="features">
    <option value="LABEL_DETECTION">LABEL_DETECTION</option>
    <option value="TEXT_DETECTION">TEXT_DETECTION</option>
    <option value="IMAGE_PROPERTIES">IMAGE_PROPERTIES</option>
    </select>
    <br>
    <input type="submit" value="Annotate">
</form>

<div id="result"></div>

<script>
    const form = document.getElementById('annotate-form');

    form.addEventListener('submit', (event) => {
    event.preventDefault();

    const imageUri = document.getElementById('image-uri').value;
    const features = document.getElementById('features').value;

    const data = {
        image_uri: imageUri,
        features: features,
    };

    fetch('https://us-central1-my-project-with-duet.cloudfunctions.net/annotate-http/annotate', {
        method: 'POST',
        headers: {
        'Content-Type': 'application/json',
        },
        body: JSON.stringify(data),
    })
        .then((response) => response.json())
        .then((result) => {
        const resultElement = document.getElementById('result');
        resultElement.innerHTML = JSON.stringify(result, null, 2);
        });
    });
</script>
</body>
</html>

যদি ওয়েবসাইটটি আপনার জন্য কাজ না করে, তাহলে এখানে কয়েকটি বিষয় যাচাই করে দেখতে পারেন:

সমস্যা: ৪০৪ (খুঁজে পাওয়া যায়নি) fetch মেথডে ব্যবহৃত URL-টিতে কি my-project-with-duet অন্তর্ভুক্ত আছে?
- সমাধান: my-project-with-duet এর জায়গায় আপনার প্রজেক্ট আইডি বসান।
সমস্যা: 404 (খুঁজে পাওয়া যায়নি) fetch মেথডে ব্যবহৃত URL-টিতে কি সম্পূর্ণ URL নেই?
- সমাধান: fetch মেথডে সম্পূর্ণ URL-টি অবশ্যই অন্তর্ভুক্ত করুন। এটি দেখতে অনেকটা https://us-central1-my-project-with-duet.cloudfunctions.net/annotate-http/annotate এর মতো হবে।
সমস্যা: তাৎক্ষণিক প্রতিক্রিয়াটি এখনও পুরোপুরি সঠিক নয়।
- সমাধান: একটি ভিন্ন প্রম্পট ব্যবহার করে দেখুন, যেখানে আপনি জেমিনিকে আরও বেশি নির্দেশনা দেবেন যে আপনি কী তৈরি করতে চান। my-project-with-duet এর জায়গায় আপনার প্রজেক্ট আইডি বসাতে ভুলবেন না। এখানে একটি উদাহরণ দেওয়া হলো:
  - Write an index.html file that takes two inputs: a text input for the image_uri and a dropdown for the features. It should make a post request and display the raw json result to the DOM. The fetch call should use https://us-central1-my-project-with-duet.cloudfunctions.net/annotate-http/annotate. The default image_uri should be gs://cloud-samples-data/vision/eiffel_tower.jpg.
সমস্যা: আপনার সাইটটি ডেপ্লয় করা হয়েছে, কিন্তু এটি কাজ করছে না?
- সমাধান: এলএলএম-এর অনির্দিষ্ট প্রকৃতির কারণে, এমনটা হতে পারে যে ডুয়েট এমন একটি প্রতিক্রিয়া তৈরি করেছে যা কাজ করবে না। যদি এমনটা হয়, তবে উপরের উদাহরণ index.html ফাইলটি কপি করুন এবং firebase deploy ব্যবহার করে সেটি পুনরায় ডিপ্লয় করার চেষ্টা করুন। my-project-with-duet এর জায়গায় আপনার প্রজেক্ট আইডি বসাতে ভুলবেন না।

৭. (ঐচ্ছিক) উন্মুক্ত অন্বেষণ

আপনার অ্যাপ্লিকেশনে CSS স্টাইল যোগ করতে Gemini এবং এর ইন-এডিটর অ্যাসিস্ট্যান্ট ব্যবহার করুন এবং কাজ শেষ হলে অ্যাপ্লিকেশনটি আবার ডিপ্লয় করুন! আপনি যদি অনুপ্রেরণা খুঁজে থাকেন, তাহলে এখানে একটি উদাহরণ প্রম্পট দেওয়া হলো যা আপনি চেষ্টা করে দেখতে পারেন:
- Make this index.html file use material design.
অন্যান্য যা যা চেষ্টা করতে পারেন:
- তৈরি করা ওয়েবসাইটটি যেকোনো পাবলিক http ইমেজের সাথে কাজ করবে। পেজে ইমেজটি প্রদর্শন করতে Duet ব্যবহার করুন।

৮. (ঐচ্ছিক) প্রজেক্টটি মুছে ফেলুন

আজ আপনার তৈরি করা রিসোর্সগুলোর জন্য যদি আপনি কোনো চার্জ এড়াতে চান, তাহলে কীভাবে তা করতে হয় তা আপনি ডুয়েটকে জিজ্ঞাসা করতে পারেন।

প্রম্পটটি প্রবেশ করান:
- How can I delete my project?
- আপনি gcloud projects delete my-project-with-duet মতো একটি ফলাফল দেখতে পাবেন।
- গুরুত্বপূর্ণ: পূর্ববর্তী কমান্ডে my-project-with-duet পরিবর্তে আপনার প্রজেক্ট আইডি ব্যবহার করুন।
আজ আপনার তৈরি করা সমস্ত রিসোর্স মুছে ফেলার জন্য gcloud projects delete কমান্ডটি চালান।