Express.js এর সাথে অন্যান্য ফ্রেমওয়ার্ক একত্রিত করুন

কিছু অতিরিক্ত কনফিগারেশনের মাধ্যমে, আপনি বেসিক ফ্রেমওয়ার্ক-অ্যাওয়ার সিএলআই কার্যকারিতার উপর ভিত্তি করে অ্যাঙ্গুলার এবং নেক্সট.জেএস ছাড়াও অন্যান্য ফ্রেমওয়ার্কের জন্য ইন্টিগ্রেশন সাপোর্ট প্রসারিত করতে পারেন।

স্থির বিষয়বস্তু পরিবেশন করুন

স্ট্যাটিক কন্টেন্ট ডেপ্লয় করার আগে, আপনাকে আপনার অ্যাপ্লিকেশনটি কনফিগার করতে হবে।

কনফিগার করুন

আপনার অ্যাপ্লিকেশনটি কীভাবে ডেপ্লয় করতে হবে তা জানার জন্য, Firebase CLI-কে আপনার অ্যাপটি বিল্ড করতে এবং Hosting জন্য নির্ধারিত অ্যাসেটগুলো আপনার টুলিং কোথায় রাখে, তা জানতে সক্ষম হতে হবে। এটি npm build script এবং package.json এর CJS directories ডিরেক্টিভের মাধ্যমে সম্পন্ন করা হয়।

নিম্নলিখিত package.json দেওয়া হলো:

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack",
        "static": "cp static/* dist",
        "prerender": "ts-node prerender.ts"
    },
    
}

Firebase CLI শুধুমাত্র আপনার বিল্ড স্ক্রিপ্টকে কল করে, তাই আপনাকে নিশ্চিত করতে হবে যে আপনার বিল্ড স্ক্রিপ্টটি যেন সম্পূর্ণ হয়।

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack && npm run static && npm run prerender",
        "static": "cp static/* dist",
        "prerender": "ts-node prerender.ts"
    },
    
}

যদি আপনার ফ্রেমওয়ার্ক সরাসরি প্রি-রেন্ডারিং সমর্থন না করে, তাহলে Rendertron-এর মতো কোনো টুল ব্যবহার করার কথা ভাবতে পারেন। Rendertron আপনাকে আপনার অ্যাপের একটি লোকাল ইনস্ট্যান্সে হেডলেস ক্রোম রিকোয়েস্ট পাঠানোর সুযোগ দেবে, ফলে আপনি তৈরি হওয়া HTML ফাইলটি Hosting -এ পরিবেশন করার জন্য সংরক্ষণ করতে পারবেন।

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

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack && npm run static && npm run prerender",
        "static": "cp static/* dist",
        "prerender": "ts-node prerender.ts"
    },
    "directories": {
        "serve": "dist"
    },
    
}

মোতায়েন করুন

আপনার অ্যাপটি কনফিগার করার পর, আপনি স্ট্যান্ডার্ড ডিপ্লয়মেন্ট কমান্ডের মাধ্যমে স্ট্যাটিক কন্টেন্ট পরিবেশন করতে পারেন:

firebase deploy

ডাইনামিক কন্টেন্ট পরিবেশন করুন

Cloud Functions for Firebase এ আপনার Express অ্যাপটি পরিবেশন করতে, নিশ্চিত করুন যে আপনার Express অ্যাপ (বা এক্সপ্রেস-স্টাইলের URL হ্যান্ডলার) এমনভাবে এক্সপোর্ট করা হয়েছে যাতে আপনার লাইব্রেরিটি npm pack করার পরে Firebase এটিকে খুঁজে পেতে পারে।

এটি সম্পন্ন করতে, নিশ্চিত করুন যে আপনার files ডিরেক্টিভে সার্ভারের জন্য প্রয়োজনীয় সবকিছু অন্তর্ভুক্ত আছে, এবং আপনার package.json এ প্রধান এন্ট্রি পয়েন্টটি সঠিকভাবে সেট আপ করা আছে।

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack && npm run static && npm run prerender",
        "static": "cp static/* dist",
        "prerender": "ts-node tools/prerender.ts"
    },
    "directories": {
        "serve": "dist"
    },
    "files": ["dist", "server.js"],
    "main": "server.js",
    ...
}

app নামের একটি ফাংশন থেকে আপনার এক্সপ্রেস অ্যাপটি এক্সপোর্ট করুন:

// server.js
export function app() {
  const server = express();
   
   return server;
}

অথবা আপনি যদি এক্সপ্রেস-স্টাইলের ইউআরএল হ্যান্ডলার এক্সপোর্ট করতে চান, তবে এর নাম দিন handle :

export function handle(req, res) {
   res.send(hello world);
}

মোতায়েন করুন

firebase deploy

এটি আপনার স্ট্যাটিক কন্টেন্ট Firebase Hosting এ ডেপ্লয় করে এবং ফায়ারবেসকে Cloud Functions for Firebase এ হোস্ট করা আপনার এক্সপ্রেস অ্যাপে ফলব্যাক করার সুযোগ দেয়।

ঐচ্ছিক: ফায়ারবেস অথেনটিকেশনের সাথে সংযুক্ত করুন

ওয়েব ফ্রেমওয়ার্ক-সচেতন ফায়ারবেস ডিপ্লয় টুলিং কুকি ব্যবহার করে স্বয়ংক্রিয়ভাবে ক্লায়েন্ট এবং সার্ভারের অবস্থা সিঙ্ক করে রাখবে। অথেনটিকেশন কনটেক্সট অ্যাক্সেস করার জন্য, এক্সপ্রেস res.locals অবজেক্টটিতে ঐচ্ছিকভাবে একটি অথেনটিকেটেড ফায়ারবেস অ্যাপ ইনস্ট্যান্স ( firebaseApp ) এবং বর্তমানে সাইন ইন করা ইউজার ( currentUser ) অন্তর্ভুক্ত থাকে।