অ্যাপ হোস্টিং ব্যবহার করা শুরু করা

GitHub রিপোজিটরিতে আগে থেকেই থাকা Next.js বা Angular অ্যাপ (Next.js ভার্সন 13.5.x+ বা Angular 18.2.x+) থাকলে, App Hosting-এর সাথে শুরু করাটা App Hosting ব্যাকএন্ড তৈরি করার মতো সহজ হতে পারে এবং তারপরে আপনার লাইভ ব্রাঞ্চে পুশ করার মাধ্যমে রোল-আউট শুরু করা যেতে পারে। আপনার কাছে কোনও অ্যাপ না থাকলে, এই নির্দেশিকায় বর্ণিত ধাপগুলি অনুসরণ করতে আমাদের নমুনা অ্যাপগুলির মধ্যে একটি ব্যবহার করুন।

AI সহায়তা পেতে, নিচে দেওয়া প্রম্পটটি আপনার AI কোডিং এজেন্টে (যেমন Antigravity, Claude Code, Codex ও Cursor) কপি করুন। আপনি প্রম্পট কাস্টমাইজ করতে এবং এজেন্টের সাথে আইটেরেট করতে পারবেন। ইনস্টলেশন সংক্রান্ত বিস্তারিত তথ্য পেতে Firebase এজেন্ট দক্ষতা দেখুন। 

Help me use Firebase in my app.
1. Make sure that **Firebase agent skills** are installed and updated. For Claude Code, Codex, or Cursor agents, help me install the Firebase plugin. For other agents, run `npx skills add firebase/agent-skills`.  Always try to use **Firebase agent skills** for Firebase-related tasks.
2. Help me use Firebase to host my web app. Set up my app to use Firebase, and then deploy my app.

GitHub রিপোজিটরিতে নতুন কমিট করা হলে, প্রতিবার অটোমেটিক ডিপ্লয় করার জন্য Firebase কনসোলে কীভাবে App Hosting সেট-আপ করতে হয় তা এই নির্দেশিকায় বর্ণনা করা হয়েছে। এই ফ্লোয়ের শেষে আপনার কাছে একটি লাইভ Next.js বা Angular উদাহরণ অ্যাপ থাকবে যা আপনার GitHub রিপোজিটরির main ব্রাঞ্চে নতুন পরিবর্তন কমিট করার সাথে সাথে আবার ডিপ্লয় করা হবে।

যদিও এই নির্দেশিকায় সাজেস্ট করা Firebase কনসোল ফ্লোয়ের উপর জোর দেওয়া হয়েছে, তবে ডেপ্লয় করার অন্যান্য উপায়ও আছে, যার মধ্যে Firebase GitHub কানেকশন ছাড়াই লোকাল কোড ডেপ্লয় করার জন্য CLI ব্যবহার করা অন্তর্ভুক্ত।

ধাপ ১: ডেমো রিপোজিটরি ফর্ক করুন

https://github.com/firebase/apphosting-adapters লিঙ্কে গিয়ে ফর্ক বিকল্প বেছে নিন।

ধাপ ২: App Hosting ব্যাকএন্ড তৈরি করুন

  1. Firebase কনসোলে, হোস্টিং ও সার্ভারলেস > অ্যাপ হোস্টিং বিকল্পে নেভিগেট করুন।

  2. শুরু করুন বিকল্পে ক্লিক করুন।

  3. প্রম্পট করা হলে, App Hosting ব্যবহার করতে পে-অ্যাজ-ইউ-গো Blaze প্রাইসিং প্ল্যানে আপগ্রেড করুন।

অ্যাপ হোস্টিং ব্যাকএন্ড সেট-আপের স্ক্রিনশট।

এইসব ধাপ সম্পূর্ণ করতে প্রম্পট অনুসরণ করুন:

  • একটি প্রাথমিক অঞ্চল বেছে নিন (সাধারণত আপনার ব্যবহারকারীদের সবচেয়ে কাছের অঞ্চল)।
  • GitHub-এ কানেক্ট করুন। আপনি যে apphosting-adapters রিপোজিটরি ফর্ক করে এইমাত্র তৈরি করেছেন সেটি বেছে নিন।
  • নিচের যেকোনও একটিতে আপনার অ্যাপের রুট ডিরেক্টরি সেট করুন:
  • লাইভ ব্রাঞ্চকে মূল হিসেবে সেট করুন।
  • অটোমেটিক রোল-আউট চালু করুন (অটোমেটিক রোল-আউট ডিফল্ট হিসেবে চালু থাকে)।
  • আপনার ব্যাকএন্ডের জন্য একটি নাম অ্যাসাইন করুন।
  • আপনার রানটাইম এনভায়রনমেন্ট বেছে নিন। ডিফল্ট হিসেবে, সাজেস্ট করা সবচেয়ে নতুন Node.js ভার্সন আপনার জন্য আগে থেকেই বেছে নেওয়া থাকে।
    • অটোমেটিক বেস ইমেজ আপডেট (ABIU) কনফিগার করুন। ABIU ডিফল্ট হিসেবে চালু থাকে এবং আপনার অন্তর্নিহিত এনভায়রনমেন্টে অটোমেটিক নিরাপত্তা প্যাচ প্রয়োগ করে। আপনার রানটাইমের জন্য "নির্দিষ্ট করা নেই" বিকল্প বেছে নিয়ে আপনি ABIU থেকে অপ্ট-আউট করতে পারবেন।
  • নতুন Firebase ওয়েব অ্যাপ তৈরি করুন।

সম্পূর্ণ ও ডেপ্লয় করুন বিকল্প বেছে নিন।

ধাপ ৩: ডেপ্লয় করা অ্যাপ দেখুন

আপনি কোনও ব্যাকএন্ড তৈরি করলে, Firebase আপনাকে একটি ফ্রি সাবডোমেন দেয় যেখানে শেষ ব্যবহারকারীরা আপনার ওয়েব অ্যাপ দেখতে পারেন। এটির ফর্ম্যাট হল backend-id--project-id.us-central1.hosted.app।

আপনার ব্যাকএন্ডের ড্যাশবোর্ডে ব্যাকএন্ড তথ্য সারিতে, আপনার নতুন ওয়েবসাইট দেখতে আপনার লাইভ ব্যাকএন্ডের লিঙ্ক বেছে নিন:

লাইভ অ্যাপ লিঙ্ক সহ ব্যাকএন্ড তথ্যের সারির একটি স্ক্রিনশট হাইলাইট করা হয়েছে।

ধাপ ৪: কোনও পরিবর্তন পুশ করে রোলআউট ট্রিগার করা

আপনার ব্যাকএন্ড তৈরি হয়ে গেলে এবং লাইভ URL থাকলে, আপনি GitHub রিপোজিটরির লাইভ ব্রাঞ্চে কোনও পরিবর্তন পুশ করলেই ওয়েব অ্যাপের নতুন ভার্সন রোল-আউট করার প্রসেস ট্রিগার করতে পারবেন। আপনার App Hosting সেট-আপের টেস্ট করতে:

  1. ডেমো GitHub রিপোজিটরির আপনার ফর্কে, ডেমো অ্যাপের হোম পেজের সোর্সে নেভিগেট করুন, আপনার পছন্দমতো কোনও শনাক্তযোগ্য এডিট করুন এবং তারপরে আপনার পরিবর্তন মূল ব্রাঞ্চে পুশ করুন। আপনার হোম পেজ খুঁজে পেতে:

    • Next.js: /starters/nextjs/basic/src/app/page.tsx
    • Angular: /starters/angular/basic/src/app/pages/home/home.component.html

  2. Firebase কনসোলে, মনিটর করুন App Hosting কারণ আপনার নতুন পরিবর্তন প্রোডাকশনে রোল-আউট করা হয়েছে। রোল-আউট সম্পূর্ণ হয়ে গেলে, আপনি অ্যাপের হোমপেজে পরিবর্তন দেখতে পাবেন।

পরবর্তী ধাপ