Bash দিয়ে ব্রাঞ্চ-স্পেসিফিক Netlify কনফিগারেশন অটোমেট করুন – ধাপে ধাপে গাইড

যখন আপনি একাধিক এনভায়রনমেন্টের সাথে একটি প্রজেক্টে কাজ করছেন – যেমন স্টেজিং এবং প্রোডাকশন – আপনার ব্যাকএন্ড API এবং ফ্রন্টএন্ড ডিপ্লয়মেন্টের জন্য, আপনি নিশ্চিত করতে চান যে আপনার রিপোজিটরির প্রতিটি ব্রাঞ্চের জন্য সঠিক কনফিগারেশন এবং কমান্ড আছে।

এটি চ্যালেঞ্জিং হতে পারে যখন একাধিক ডেভেলপার সক্রিয়ভাবে একটি কোডবেসে কাজ করছে, বিভিন্ন ব্রাঞ্চে পরিবর্তন আনা হচ্ছে, বা একাধিক ব্রাঞ্চ-স্পেসিফিক কনফিগারেশন ম্যানেজ করা হচ্ছে।

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

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

এই আর্টিকেলে, আমি দেখাব কিভাবে একটি সিম্পল Bash স্ক্রিপ্ট ব্যবহার করে ব্রাঞ্চ-স্পেসিফিক কনফিগারেশন (রিডাইরেক্টসহ) একাধিক ব্রাঞ্চের জন্য অটোমেটিকভাবে ম্যানেজ করতে হয়। আমি এছাড়া দেখাব কিভাবে Netlify-এ আপনার স্টেজিং এবং প্রোডাকশন ব্রাঞ্চের জন্য কনটেক্সট-স্পেসিফিক রুলস সফলভাবে মার্জ করতে হয়।

আমরা কী কভার করব:

• প্রজেক্ট স্ট্রাকচার এবং পরিস্থিতি

• রিডাইরেক্ট/রিরাইট কী?

• Netlify কীভাবে রিডাইরেক্ট প্রসেস করে

  • _redirects ফাইল সিনট্যাক্স ব্যবহার

  • netlify.toml কনফিগারেশন ফাইল সিনট্যাক্স ব্যবহার

• সমস্যা: বিভিন্ন ব্রাঞ্চের জন্য একাধিক netlify.toml ফাইল ম্যানেজ করা

• অটোমেটিক্যালি কনফিগারেশন ফাইল তৈরি করার স্ক্রিপ্ট লিখার পদ্ধতি

  • স্যাম্পল Netlify.toml ফাইল

  • স্টেপ ১: স্ক্রিপ্ট ফোল্ডার তৈরি করুন এবং স্ক্রিপ্ট ফাইল যোগ করুন

  • স্টেপ ২: package.json মডিফাই করুন স্ক্রিপ্ট কমান্ড অন্তর্ভুক্ত করতে

• আমাদের ক্লায়েন্টকে Netlify-এ ডিপ্লয় করার পদ্ধতি

  • প্রথম ডিপ্লয়মেন্ট

  • পরবর্তী ডিপ্লয়মেন্ট / ব্রাঞ্চ ডিপ্লয়মেন্ট সেট আপ করার পদ্ধতি

    • স্টেপ ১: Netlify-এ প্রতিটি ব্রাঞ্চ কনটেক্সটের জন্য এনভায়রনমেন্ট ভেরিয়েবল সেট আপ করুন – প্রোডাকশন, স্টেজিং, ইত্যাদি

    • স্টেপ ২: একটি নতুন ডিপ্লয় ট্রিগার করুন

• আপনার ডিপ্লয়মেন্ট পরিদর্শন করুন

• উপসংহার

প্রজেক্ট স্ট্রাকচার এবং পরিস্থিতি

একটি পরিস্থিতি বিবেচনা করুন যেখানে আপনার কাছে একটি প্রজেক্টের জন্য দুটি আলাদা সার্ভার ডিপ্লয়েড আছে: একটি স্টেজিং এনভায়রনমেন্ট সার্ভ করতে (Render-এ ডিপ্লয়েড), আরেকটি প্রোডাকশন এনভায়রনমেন্ট সার্ভ করতে (Google Cloud Run-এ ডিপ্লয়েড)।

আপনার কাছে Netlify-এ দুটি আলাদা ক্লায়েন্ট ডিপ্লয়মেন্টও আছে, প্রতিটির নিজস্ব API_BASE_URL, যেগুলো তাদের নিজস্ব সার্ভার দ্বারা সার্ভ করা হচ্ছে নিচের ilustratioanुसারে:

নিচের ছবিটি একটি sample-project রিপোজিটরি, যার ভিতরে api এবং client ফোল্ডার/ডিরেক্টরি আছে। এটি উপরে বর্ণিত প্রতিটি ব্রাঞ্চের স্ট্রাকচারের ওভারভিউ। প্রতিটি ডিরেক্টরির নিজস্ব package.json ফাইল আছে, স্বতন্ত্র কম্পোনেন্ট হিসেবে বিবেচিত হয়, এবং দুটি আলাদা সার্ভিসে ডিপ্লয় করা যায়।

আপনার ফ্রন্টএন্ড ডিপ্লয়মেন্টে প্রতিটি ক্লায়েন্টের জন্য, /api/v1/ দিয়ে শুরু হওয়া সব রিকোয়েস্ট সার্ভারের দিকে রুট করা হয়। অন্যান্য রুট ফ্রন্টএন্ডের মধ্যে থাকে ক্লায়েন্টের পেজগুলোর মধ্যে নেভিগেট করতে। তাই আপনাকে সঠিক রুল লিখতে হবে যাতে ক্লায়েন্ট বুঝতে পারে কীভাবে এই রিকোয়েস্টগুলো প্রসেস করবে। এগুলাকে রিডাইরেক্ট রুল বা রিরাইট বলে।

রিডাইরেক্ট/রিরাইট কী?

রিডাইরেক্ট বা রিরাইট হলো những রুল যা আপনি তৈরি করতে পারেন যাতে নির্দিষ্ট URLها স্বয়ংক্রিয়ভাবে ইন্টারনেটের যেকোনো নতুন লোকেশনে চলে যায় (সোর্স: WPengine)। এগুলো সাধারণত URL ফরওয়ার্ডিং হিসেবে পরিচিত এবং আপনি এগুলো যেকোনো জায়গায় ব্যবহার করতে পারেন – পুরো ওয়েবসাইট, ওয়েবসাইটের কোনো অংশ, বা পুরো ওয়েব অ্যাপ্লিকেশনে।

ওয়েব অ্যাপ্লিকেশনে, রিডাইরেক্ট প্রায়ই ব্যবহার হয় রিকোয়েস্ট কীভাবে প্রসেস হবে তা নির্ধারণ করতে। Netlify এবং Vercel-এর মতো ওয়েব হোস্টিং প্ল্যাটফর্মও এগুলো ব্যবহার করে, ডেভেলপারদের অপশন দিয়ে তাদের ওয়েব অ্যাপ্লিকেশন কীভাবে রিকোয়েস্ট প্রসেস করবে তা নির্ধারণ করতে।

Netlify কীভাবে রিডাইরেক্ট প্রসেস করে

Netlify-এ রিডাইরেক্ট রুল স্পেসিফাই করার দুটি উপায় আছে। আপনি _redirects ফাইল সিনট্যাক্স বা netlify.toml কনফিগারেশন ফাইল সিনট্যাক্স ব্যবহার করতে পারেন। দুটোই একই লক্ষ্য অর্জন করে, কিন্তু netlify.toml সিনট্যাক্স আপনাকে আরও অপশন এবং ক্ষমতা দেয়।

_redirects ফাইল সিনট্যাক্স ব্যবহার

আপনি যদি রিডাইরেক্ট সিনট্যাক্স ব্যবহার করতে চান, তবে আপনার ক্লায়েন্ট অ্যাপের পাবলিক ফোল্ডারে একটি _redirects ফাইল তৈরি করে সেখানে রিডাইরেক্ট রুল স্পেসিফাই করতে হবে। এটা খুব সহজ। নিচে ফাইলের মধ্যে একটি রিডাইরেক্ট রুলের উদাহরণ দেওয়া হলো:

উপরের রুলটি এমনভাবে ইন্টারপ্রেট করা যায়:

1. আমার /api/v1 ম্যাচ করা সব রিকোয়েস্ট নির্দিষ্ট API URL-এ পাঠাও, এবং ২০০ সাকসেস স্ট্যাটাস কোড রিটার্ন করো। /api/v1/ এর পরে আস্টারিস্ক (*) যেমন /api/v1/* তে দেখা যাচ্ছে, সেটি আসল URL-এর যেকোনো এক্সটেনশন নির্দিষ্ট API URL-এ অ্যাপেন্ড করতে নির্দেশ করে। উদাহরণস্বরূপ, আপনার ফ্রন্টএন্ডে /api/v1/users রুট থাকলে, সেই রিকোয়েস্ট https://your-api-base-url.com/api/v1/users-এ রিডাইরেক্ট হবে। API URL-এ দেখা যাওয়া :splat কেবল একটি প্লেসহোল্ডার।

2. অন্যান্য সব ডিফল্ট রুট index.html ফোল্ডারের মাধ্যমে সার্ভ করো। এটি প্রয়োজন যাতে আপনি অন্য পেজে নেভিগেট করলে এবং "ব্যাক" বাটন ব্যবহার করে পূর্বের পেজে যাওয়ার চেষ্টা করলে ব্রোকেন পেজ এনকাউন্টার না করেন।

netlify.toml কনফিগারেশন ফাইল সিনট্যাক্স ব্যবহার

netlify.toml কনফিগারেশন ফাইল আপনাকে রিডাইরেক্ট রুল স্পেসিফাই করার 데 অনেক বেশি নমনীয়তা দেয়, যার মধ্যে রয়েছে কিন্তু সীমাবদ্ধ নয়: আসল রিকোয়েস্ট রুট ম্যাচ করা, প্রয়োজনীয় ডেস্টিনেশন, পছন্দের স্ট্যাটাস কোড রেসপন্স, হেডার রুল, সিগনেচার, কান্ট্রি রস্ট্রিকশন, রোল এবং আরও অনেক কিছু।

নিচে Netlify-এর ডকুমেন্টেশন থেকে একটি স্যাম্পল netlify.toml ফাইল দেওয়া হলো:

দ্রুত নোট: আমাদের API-তে নির্দিষ্ট রিকোয়েস্ট রিডাইরেক্ট করার জন্য _redirects ফাইল ব্যবহার করা একদম ঠিক। কিন্তু যদি API_BASE_URL প্রাইভেট থাকতে হয়, তবে _redirects ফাইলে প্লেইন টেক্সট হিসেবে API URL যোগ করা নিরাপত্তা ঝুঁকি হতে পারে। কারণ পাবলিক ফোল্ডারের যেকোনো ফাইল পাবলিকই হয় – এবং কেউই এক্সেস করতে পারে।

আপনার অ্যাপে যদি ডায়রেক্ট লোকেশন পাবলিক URL হয়, তবে নিঃসন্দেহে _redirects ফাইল সিনট্যাক্স ব্যবহার করুন। কিন্তু আপনি যদি প্রাইভেট URL পছন্দ করেন, তবে netlify.toml কনফিগারেশন ফাইল এনভায়রনমেন্ট ভেরিয়েবলের সাথে কম্বাইন করে ব্যবহার করা সাধারণত ভালো আইডিয়া।

সমস্যা: বিভিন্ন ব্রাঞ্চের জন্য একাধিক netlify.toml ফাইল ম্যানেজ করা

যখন আপনি netlify.toml ফাইল ব্যবহার করে আপনার বিল্ড কমান্ড এবং এনভায়রনমেন্ট-স্পেসিফিক সেটিং ডিফাইন করেন, এবং আপনি পরিবর্তন করে আপনার রিপোজিটরিতে পুশ করেন এবং পুল রিকোয়েস্ট খোলেন, আপনাকে প্রতিটি ব্রাঞ্চে প্রতিটি netlify.toml ম্যানুয়ালি ইগনোর বা এডিট করতে হয়। এটি চরম agotamientoের কারণ হয়ে ওঠে এবং ত্রুটিসম্ভাব্য হয়।

এছাড়া, আমরা চাই আমাদের API URL হার্ডকোডেড থাকুক না _redirects বা netlify.toml ফাইলে আমাদের প্রজেক্ট কোডবেসে নিরাপত্তার কারণে। আমরা Netlify UI-তে প্রদত্ত এনভায়রনমেন্ট ভেরিয়েবল ব্যবহার করব প্রোডাকশন এবং স্টেজিং কনটেক্সটের জন্য।

উপরোক্ত সমস্যাগুলো এড়াতে, আমরা আমাদের কোডবেসে একটি ছোট স্ক্রিপ্ট ব্যবহার করব প্রতিটি ব্রাঞ্চের জন্য সঠিক netlify.toml ফাইল ডাইনামিক্যালি জেনারেট করতে। এই পদ্ধতিটি দ্বন্দ্ব দূর করে এবং ব্রাঞ্চ স্যুইচ করার সময় বা পুল রিকোয়েস্ট হ্যান্ডল করার সময় ম্যানুয়াল ইন্টারভেনশনের প্রয়োজন নেই।

অটোমেটিক্যালি কনফিগারেশন ফাইল তৈরি করার স্ক্রিপ্ট লিখার পদ্ধতি

স্যাম্পল Netlify.toml ফাইল

নিচে একটি স্যাম্পল netlify.toml ফাইলের স্ক্রিনশট দেওয়া আছে যা আমরা প্রতিটি বিল্ডের জন্য অর্জন করতে চাই। আপনি দেখতে পাচ্ছেন যে আমাদের কোডবেসে api/v1/ ম্যাচ করা সব রিকোয়েস্ট আমাদের API-এ রুট করা হবে।

আপনার API এন্ডপয়েন্ট রিকোয়েস্ট ভিন্ন স্ট্রাকচার иметь পারে, উদাহরণস্বরূপ /api/your-endpoint – শুধু স্ক্রিপ্টটিকে আপনার পছন্দের স্ট্রাকচার অনুযায়ী অ্যাডজাস্ট করুন। এই স্যাম্পল প্রজেক্টে, আমরা api/v1/your-endpoint স্ট্রাকচার ব্যবহার করছি।

স্টেপ ১: স্ক্রিপ্ট ফোল্ডার তৈরি করুন এবং স্ক্রিপ্ট ফাইল যোগ করুন

client ডিরেক্টরিতে, একটি scripts/ ডিরেক্টরি এবং একটি configure-netlify.sh স্ক্রিপ্ট ফাইল তৈরি করুন। আপনাকে আপনার রিপোজিটরির প্রতিটি ব্রাঞ্চের জন্য এটি করতে হবে। কন্টেন্ট একই থাকবে।

configure-netlify.sh স্ক্রিপ্ট ফাইল খুলুন এবং নিচের কন্টেন্ট পেস্ট করুন:

#!/bin/bash # নিশ্চিত করুন API_BASE_URL সেট আছে if [ -z "$API_BASE_URL" ]; then echo "Error: API_BASE_URL environment variable is not set." exit 1 # স্ক্রিপ্ট থেকে বেরিয়ে যান ডিপ্লয়মেন্ট বন্ধ করতে fi echo "Using API endpoint: $API_BASE_URL" # কাঙ্ক্ষিত Netlify কনফিগারেশন ডিফাইন করুন NETLIFY_CONFIG=" [build] command = \"npm install && npm run build\" base = \"client\" publish = \"dist\" [[redirects]] from = \"/api/v1/*\" to = \"$API_BASE_URL/:splat\" status = 200 force = true [[redirects]] from = \"/*\" to = \"/index.html\" status = 200 " # netlify.toml ফাইল তৈরি বা আপডেট করুন if [ ! -f "netlify.toml" ]; then echo "Creating netlify.toml file..." else echo "Updating existing netlify.toml file..." fi echo "$NETLIFY_CONFIG" > netlify.toml # সফল কনফিগারেশন কনফার্ম করুন echo "netlify.toml file has been configured successfully!" 

স্ক্রিপ্টটি নিচের কাজগুলো করে:

1. এনভায়রনমেন্ট ভেরিয়েবল চেক করে নিশ্চিত করে যে API_BASE_URL সেট আছে। যদি সেট না থাকে, তবে বিল্ড থেকে বেরিয়ে যায় এবং ফেল করে। আমরা এটি इसलिये করেছি যাতে আপনি ভুলে প্রোডাকশনে অবৈধ URLসহ সফল ডিপ্লয়মেন্ট না করে ফেলেন।

2. তারপর উপরের স্যাম্পলের মতো netlify.toml ফাইলের কন্টেন্ট তৈরি করে। যদি আপনার API এন্ডপয়েন্ট api/v1/your-endpoint থেকে ভিন্ন স্ট্রাকচার ব্যবহার করে, তবে আপনি স্ক্রিপ্টটিকে আপনার পছন্দের স্ট্রাকচার অনুযায়ী অ্যাডজাস্ট করতে পারেন।

3. চেক করে যে netlify.toml ফাইল ইতিমধ্যে আছে কিনা। যদি না থাকে, তবে তৈরি করে কন্টেন্ট লিখে দেয়। যদি থাকে, তবে বিল্ডের সময় এনভায়রনমেন্ট ভেরিয়েবলে সেট করা API_BASE_URL ব্যবহার করে সঠিক কন্টেন্ট দিয়ে আপডেট করে।

স্টেপ ২: package.json মডিফাই করুন স্ক্রিপ্ট কমান্ড অন্তর্ভুক্ত করতে

এই স্ক্রিপ্টকে আপনার বিল্ড প্রসেসের সাথে ইন্টিগ্রেট করতে, আমরা package.json ফাইলে একটি স্ক্রিপ্ট কমান্ড যোগ করব যেটি একচুয়াল বিল্ড চালানোর আগে এই স্ক্রিপ্টকে কল করবে।

আপনার package.json ফাইলের scripts-এ configure-netlify কমান্ডটি যোগ করুন: "configure-netlify": "bash scripts/configure-netlify.sh"।

আপনার বিল্ড কমান্ড আপডেট করুন স্ক্রিপ্টটি একচুয়াল বিল্ডের আগে চালানোর জন্য: "build": "npm run configure-netlify && vite build"।

এই পরিবর্তনগুলো সেভ করে আপনার রিমোট রিপোজিটরিতে পুশ করা ভুলবেন না।

আমাদের ক্লায়েন্টকে Netlify-এ ডিপ্লয় করার পদ্ধতি

আমাদের ক্লায়েন্টকে Netlify-এ ডিপ্লয় করার সময়, আমাদের তিনটি অপশন দেওয়া হয়:

1. এক্সিস্টিং প্রজেক্ট ইম্পোর্ট করা (যা গিট রিপোজিটরি সার্ভিসে যেমন GitHub এবং GitLab-এ এক্সিস্ট করে),

2. টেমপ্লেট থেকে ইম্পোর্ট করা, বা

3. Netlify ড্রপ (ড্র্যাগ অ্যান্ড ড্রপ) ইন্টারফেস ব্যবহার করে ম্যানুয়ালি স্ট্যাটিক সাইট ডিপ্লয় করা।

আমাদের রিপোজিটরির কনফিগারেশন বিল্ড প্রসেসে প্রত্যাশা অনুযায়ী কাজ করতে, আপনাকে অবশ্যই GitHub-এর মতো এক্সিস্টিং প্রজেক্ট ইম্পোর্ট করার অপশনটি ব্যবহার করতে হবে। ড্র্যাগ-অ্যান্ড-ড্রপ ইন্টারফেস কাজ করবে না। আপনি যদি বাধ্য হয়েন এটি ব্যবহার করতে, তবে _redirects ফাইল সিনট্যাক্স অপশন ব্যবহার করুন আপনার রিডাইরেক্ট ডিফাইন করতে।

আপনার প্রজেক্টের প্রথম ডিপ্লয়মেন্ট Netlify-এ

প্রথমবার প্রজেক্ট ডিপ্লয় করার সময়, আপনাকে শুধু একটি ব্রাঞ্চ ডিপ্লয় করার অপশন দেওয়া হয়। আপনি পরবর্তী ডিপ্লয়মেন্টে অন্যান্য অপশন, যেমন অন্যান্য ব্রাঞ্চ, অ্যাড ও স্পেসিফাই করতে পারেন।

আপনার প্রজেক্ট ডিপ্লয় করতে নিচের ধাপগুলো ফলো করুন:

1. Netlify-এ সাইন ইন করুন > netlify.com

2. "Add new site" > "Import an existing project" > "Deploy with GitHub" ক্লিক করুন

3. "Configure Netlify on GitHub" > আপনার রিপোজিটরি সার্চ করুন > সিলেক্ট করুন

4. আপনার প্রজেক্টের জন্য একটি यুনিক সাইট নাম দিন

5. ডিপ্লয় সেটিংস কনফিগার করুন। এখানে আপনাকে ডিপ্লয় করার পছন্দের ব্রাঞ্চ সিলেক্ট করতে হবে। প্রথম ডিপ্লয়মেন্টের জন্য, আমরা main ব্রাঞ্চ ডিপ্লয় করব যা আমরা প্রোডাকশন ব্রাঞ্চ হিসেবে ব্যবহার করি।

   • Branch: main/master

   • Build command: npm run build

   • Publish directory: dist (সেই ডিরেক্টরি সিলেক্ট করুন যেখানে আপনার স্ট্যাটিক ফাইল রয়েছে। এই স্যাম্পল প্রজেক্টে, এটি dist ডিরেক্টরিতে এক্সপোর্ট হয়। কিছু টুল build-এ এক্সপোর্ট করে)

6. আপনার প্রজেক্টের জন্য এনভায়রনমেন্ট ভেরিয়েবল দিন। আপনার সার্ভার থেকে API_BASE_URL দেওয়া ভুলবেন না। Bash স্ক্রিপ্ট অনুযায়ী এটি একটি অপরিহার্য প্রয়োজনীয়তা।

7. "Deploy site" ক্লিক করুন

আপনার প্রজেক্ট সঠিকভাবে ডিপ্লয় হওয়া উচিত, এবং আপনি সফল ডিপ্লয়মেন্ট পেজের নিচে ডিপ্লয়মেন্ট ডিটেইলস inspeccion করে স্ক্রিপ্ট দ্বারা জেনারেট করা netlify.toml কনফিগারেশন দেখতে পাবেন।

আপনি এই ফাইলটি আপনার লোকাল মেশিনে ডাউনলোড করতে পারেন জেনারেট করা কনফিগারেশন দেখতে। এটি উপরের স্যাম্পল netlify.toml ফাইলের সাথে মিল খায় উচিত। আপনি আপনার জেনারেট করা সাইট লিংক ব্যবহার করে এটি টেস্টও করতে পারেন।

পরবর্তী ডিপ্লয়মেন্ট / ব্রাঞ্চ ডিপ্লয়মেন্ট সেট আপ করার পদ্ধতি

স্টেপ ১: Netlify-এ প্রতিটি ব্রাঞ্চ কনটেক্সটের জন্য এনভায়রনমেন্ট ভেরিয়েবল সেট আপ করুন – প্রোডাকশন, স্টেজিং, ইত্যাদি

যখন আপনার প্রজেক্ট সফলভাবে ডিপ্লয় হয়ে যায়, আপনি আপনার স্টেজিং ব্রাঞ্চের জন্য ডিপ্লয়মেন্ট সেট আপ করতে পারেন। কনফিগারেশন এডিট করতে, আপনাকে:

1. আপনার সাইটের তালিকায় নেভিগেট করুন

2. সফলভাবে ডিপ্লয়েড সাইটটি সিলেক্ট করুন

3. বাম মেনুতে "site configuration"-এ ক্লিক করুন

4. "environment variables" সিলেক্ট করুন > "Add a variable" বাটনে ক্লিক করুন।

আপনাকে ভেরিয়েবল আলাদা আলাদা যোগ করার অপশন বা পুরো .env ফাইল ইম্পোর্ট করার অপশন দেওয়া হবে। আপনি যেকোনো অপশন বেছে নিতে পারেন। নিচের ছবিতে, আমি "Import from a .env file" সিলেক্ট করেছি।

যেহেতু আমাদের প্রোডাকশন সাইট, main ব্রাঞ্চ থেকে ডিপ্লয়েড (প্রোডাকশন এনভায়রনমেন্ট ভেরিয়েবলের সাথে), ইতিমধ্যে ডিপ্লয়েড হয়েছে, আপনাকে:

1. প্রোডাকশন ব্রাঞ্চটি আনচেক করুন (প্রাথমিকভাবে ডিপ্লয়েড main ব্রাঞ্চ রিপ্লেস করা থেকে রোধ করতে। ভিন্ন ব্রাঞ্চের জন্য এনভায়রনমেন্ট ভেরিয়েবল মিক্স আপ করা থেকে সতর্ক থাকুন)

2. "branch deploys" সিলেক্ট করুন

3. আপনার .env ফাইলের কন্টেন্ট ইনপুট সেকশনে কপি পেস্ট করুন

4. আপনার স্টেজিং এনভায়রনমেন্টের জন্য API_BASE_URL এনভায়রনমেন্ট ভেরিয়েবল যোগ করা ভুলবেন না

মনে রাখবেন যে branch deploys সিলেক্ট করলে, এখানে ইম্পোর্ট করা এনভায়রনমেন্ট ভেরিয়েবলগুলো প্রোডাকশন ব্রাঞ্চ বাদে সব ব্রাঞ্চ ডিপ্লয়কে প্রভাবিত করবে। আপনি কাস্টম ব্রাঞ্চ সিলেক্ট করে আপনার কনটেক্সট আরও কাস্টোমাইজ করতে পারেন, কিন্তু সেটি সম্পূর্ণ আলাদা একটি পদ্ধতি যা আপনার netlify.toml কনফিগারেশন ফাইল বা Bash স্ক্রিপ্ট আরও কাস্টোমাইজ করতে বাধ্য করতে পারে।

আপনি যদি প্রতিটি এনভায়রনমেন্ট ভেরিয়েবল আলাদা আলাদা ইম্পোর্ট করতে চান, তবে নিচের মতো একটি সিমিলার অপশন मिलবে। নিশ্চিত করুন যে আপনি প্রতিটি ব্রাঞ্চের জন্য সঠিক কনটেক্সট সিলেক্ট করেছেন।

সব কনটেক্সটের জন্য একই মান ব্যবহার করবেন না। নিচের ছবিতে দেখা যাচ্ছে, "different value for each deploy context" সিলেক্ট করলে আপনি প্রতিটির জন্য মান ডিফাইন করতে পারবেন। এই কেসে, আমরা ব্রাঞ্চ ডিপ্লয়ের জন্য মান ডিফাইন করছি। আপনার প্রাথমিকভাবে ব্যবহৃত প্রোডাকশন ভেরিয়েবল ইতিমধ্যে এক্সিস্ট করছে।

সব ভেরিয়েবল ইম্পোর্ট হলে, আপনি সেগুলো ইন্সপেক্ট করে কনফার্ম করতে পারেন যে সেগুলো সঠিকভাবে ইম্পোর্ট হয়েছে। প্রতিটি ভেরিয়েবলের ডান পাশে ড্রপডাউন সিলেক্ট করে তাদের মান ইন্সপেক্ট করুন।

স্টেপ ২: একটি নতুন ডিপ্লয় ট্রিগার করুন

যখন সব এনভায়রনমেন্ট ভেরিয়েবল আলাদা আলাদা কনটেক্সটের জন্য – এই কেসে প্রোডাকশন এবং স্টেজিং – ইম্পোর্ট হয়ে যায়, আপনার স্ক্রিনের বাম প্যানেলের "deploys"-এ নেভিগেট করুন। তারপর "Trigger deploy" বাটনে হিট করুন, ক্যাশ ক্লিয়ার করুন, এবং একটি নতুন ডিপ্লয়মেন্ট শুরু করুন।

আপনার ডিপ্লয়মেন্ট পরিদর্শন করুন

আপনি কনফার্ম করতে পারেন যে আপনার স্ক্রিপ্ট প্রত্যাশা অনুযায়ী কাজ করছে যেকোনো ডিপ্লয়মেন্ট সিলেক্ট করে এবং "Deploy log"-এ বিল্ডিং ড্রপডাউন সিলেক্ট করে। আপনি কমান্ডটি রান হয়েছে তা দেখবেন, সেই ডিপ্লয়মেন্টের আউটপুট এবং API URL দেখবেন, যা আপনার কনটেক্সট দ্বারা ডিফাইন করা হয়েছে।

উপসংহার

এই গাইডের ধাপগুলো ফলো করে, এবং আপনার রিপোজিটরির প্রতিটি ব্রাঞ্চে আপনার স্ক্রিপ্ট এবং আপডেটেড কমান্ড ব্যবহার করে, যখন আপনি পরিবর্তন পুশ করবেন তখন Netlify স্বয়ংক্রিয়ভাবে প্রতিটি ব্রাঞ্চে netlify.toml ফাইল জেনারেট বা আপডেট করবে। এটি নিশ্চিত করে যে বিল্ড টাইমে প্রতিটি এনভায়রনমেন্টের জন্য সঠিক কনফিগারেশন এবং এনভায়রনমেন্ট ভেরিয়েবল ব্যবহার হচ্ছে।

আপনার স্ক্রিপ্ট সব ব্রাঞ্চে একই থাকে। এটি আপনাকে অন্যান্য কোড পরিবর্তনে ফোকাস করতে দেয় যখন আপনার স্ক্রিপ্ট সফলভাবে এবং সহজে সঠিক কনফিগারেশন হ্যান্ডেল করে।

কোনো ব্রাঞ্চে পরিবর্তন পুশ করুন এটি অ্যাকশনে দেখতে।

টوییটারে (@francisihej) বা লিঙ্কডইনে আমার সাথে জড়িত হতে ভাবুন!

নিঃশুল্ক কোডিং শিখুন। freeCodeCamp-এর ওপেন সোর্স কারিকুলাম ৪০,০০০-এর বেশি লোককে ডেভেলপার হিসেবে চাকরি পেতে সাহায্য করেছে। শুরু করুন।