
রিয়াক্ট জেএস অ্যাপ কি ও সি প্যানেলে রিয়াক্ট অ্যাপ হোষ্ট?
খুব সহজ ভাষায় যদি বলি রিয়াক্ট জেএস একটি ফ্রি এবং ওপেন সোর্স ফ্রন্ট এন্ড জাভাস্ক্রিপ্ট লাইব্রেরি। মূলত এটি তৈরি করা হয়েছে ইউজার ইন্টারফেস তৈরি করা জন্য। এটির ইউআই কম্পোনেন্টের সাহায্যে কম কোড লেখা কিংবা একাধিক কোড বার বার না লিখে কাজ করে ফেলা যায়।
আমরা যখন কোন ওয়েবসাইটে ভিজিট করি, তখন কোন ওয়েবসাইট কোন ডাটা যদি পরিবর্তন হয় তাহলে রিয়াক্ট জেএস শুধু মাত্র পরিবর্তন অংশটুকু লোড করে। বাকি অপরিবর্তন না হওয়া পুরাতন ডাটা আগের মতই রেখে দেয়। ফলে ওয়েবসাইটের লোডিং স্পিড অনেক বাড়ে। ব্যবহারকারীরা ওয়েবসাইটটি ব্যবহার করতে বেশ সুবিধা পায়। মূলত এই সমস্যাটি সমাধান করে রিয়াক্ট, এছাড়া আরো বিভিন্ন কাজ করা হয় রিয়াক্টের সাহায্যে।
অনেক মানুষ আছে যারা এই বিষয়ে বিভ্রান্ত হয়ে পড়ে যে Cpanel-এ একটি রিয়াক্ট অ্যাপ কীভাবে ডিপ্লয় করা যায়। Environmental পার্থক্যের কারণে একটি রিয়াক্ট অ্যাপ রান করার জন্য অনেক চ্যালেঞ্জ এর সম্মুখীন হতে হয়। অনেক টিউটোরিয়াল কখনও কখনও আশানুরূপ কাজ করে না, তবে, এই ব্লগটি আপনাকে Cpanel শেয়ার্ড হোস্টিং Environment এ কীভাবে একটি রিয়াক্ট অ্যাপ ডিপ্লয় করতে হয় সে সম্পর্কে অনেক সহজ ধাপে শেখানো হবে।
সামগ্রিকভাবে, রিয়াক্ট জেএস তার সরলতা, পুনঃব্যবহারযোগ্যতা এবং কর্মক্ষমতা অপ্টিমাইজেশনের কারণে ব্যাবহারকারীদের মধ্যে ব্যাপক জনপ্রিয়তা অর্জন করেছে। এটি ব্যাপকভাবে ইন্টারেক্টিভ, প্রতিক্রিয়াশীল এবং স্কেলযোগ্য ওয়েব অ্যাপ্লিকেশন তৈরির জন্য ব্যবহৃত হয়, যা এটিকে আধুনিক ওয়েব ডেভেলপমেন্টে একটি শক্তিশালী হাতিয়ার করে তোলে। এই ব্লগে আপনি cpanel এ একটি রিয়াক্ট অ্যাপ স্থাপন করার চ্যালেঞ্জগুলি সম্পর্কেও জানতে সক্ষম হবেন।
cPanel শেয়ার্ড হোস্টিং এনভায়রনমেন্টে একটি রিয়াক্ট অ্যাপ ডিপ্লয়মেন্টের চ্যালেঞ্জগুলো:
একটি শেয়ার্ড হোস্টিং এনভায়রনমেন্টে রিয়াক্ট অ্যাপ ডিপ্লয় করার সীমাবদ্ধতা এবং কনফিগারেশনের কারণে সাধারণত এই ধরনের হোস্টিং এনভায়রনমেন্ট সাথে সম্পর্কিত কিছু চ্যালেঞ্জ তৈরী হতে পারে। নিম্নে আপনি সম্মুখীন হতে পারেন এমন কিছু অসুবিধা দেওয়া হল:
- বিল্ড প্রসেস: ডিপ্লোয়মেন্ট এর পূর্বেই রিঅ্যাক্ট অ্যাপ তৈরি করতে হবে। শেয়ার্ড হোস্টিং এনভারনমেন্টে প্রায়ই বিল্ড প্রসেস বা কাস্টম সার্ভার কনফিগারেশন চালানোর উপর বিধিনিষেধ থাকে। এটি একটি স্বয়ংক্রিয় বিল্ড প্রক্রিয়া সেট আপ করা কঠিন করে তুলতে পারে এবং আপনাকে ম্যানুয়ালি ডিপ্লোয়মেন্ট অ্যাপটি তৈরি করতে এবং জেনারেট করা ফাইলগুলি আপলোড করতে হতে পারে।
- সার্ভার-সাইড রেন্ডারিং (SSR): রিয়াক্ট অ্যাপ ভালো পারফরম্যান্স এবং এসইওর জন্য সার্ভার-সাইড রেন্ডার করা যেতে পারে। যাইহোক, শেয়ার্ড হোস্টিং এনভায়রনমেন্ট SSR সমর্থন করে না বা প্রয়োজনীয় সার্ভার কনফিগারেশন নাও থাকতে পারে। এর মানে হল আপনাকে শুধুমাত্র ক্লায়েন্ট-সাইড রেন্ডারিংয়ের উপর নির্ভর করতে হবে, যা প্রাথমিক লোডের সময় এবং এসইওকে প্রভাবিত করতে পারে।
- রাউটিং এবং URL রিরাইটস: রিয়াক্ট অ্যাপ্লিকেশনগুলি সাধারণত পেজগুলির মধ্যে নেভিগেট করার জন্য ক্লায়েন্ট-সাইড রাউটিং ব্যবহার করে। শেয়ার্ড হোস্টিং এনভায়রনমেন্ট ইউআরএল রিরাইটের নিয়মগুলিকে সমর্থন নাও করতে পারে বা তাদের কনফিগার করার সীমাবদ্ধতা থাকতে পারে। ক্লিন ইউআরএল-এর পরিবর্তে আপনাকে হ্যাশ-ভিত্তিক ইউআরএল ব্যবহার করতে হতে পারে, যা ব্যবহারকারীর অভিজ্ঞতা এবং সম্ভাব্য এসইওকে প্রভাবিত করে।
- রিকুয়ারমেন্ট ডিপেন্ডেন্সি এবং সার্ভার কনফিগারেশন: রিয়াক্ট অ্যাপ্লিকেশনগুলির নির্দিষ্ট ডিপেন্ডেন্সি এবং সার্ভার কনফিগারেশন রয়েছে। শেয়ার্ড হোস্টিং এনভায়রনমেন্ট প্রয়োজনীয় ডিপেন্ডেন্সি ইনস্টল বা সার্ভার কনফিগারেশন পরিবর্তন করার জন্য সীমিত সমর্থন থাকতে পারে। আপনাকে হোস্টিং প্রদানকারীর আগে থেকে ইনস্টল করা ডিপেন্ডেন্সি এবং সার্ভার সেটিংসের উপর নির্ভর করতে হতে পারে, যা ব্যবহারকারীর অভিজ্ঞতা এবং সম্ভাব্য এসইওকে প্রভাবিত করে।
- স্কেলেবিলিটি এবং পারফরম্যান্স: শেয়ার করা হোস্টিং এনভায়রনমেন্টগুলি ছোট আকারের ওয়েবসাইটগুলি হোস্ট করার জন্য ডিজাইন করা হয়েছে এবং তারা উচ্চ ট্র্যাফিক বা রিসোর্স-ইনটেনসিভ বৈশিষ্ট্য সহ একটি রিয়াক্ট অ্যাপের জন্য প্রয়োজনীয় রিসোর্স বা পারফরম্যান্স অপ্টিমাইজেশন প্রদান নাও করতে পারে। এর ফলে আপনার অ্যাপের বৃদ্ধির সাথে সাথে লোডের সময় কম বা সীমিত হতে পারে।
এই অসুবিধাগুলির জন্য আপনি অন্যান্য বিকল্প হোস্টিংগুলো বিবেচনা করতে পারেন যেমন ক্লাউড হোস্টিং বা প্ল্যাটফর্ম-এ-সার্ভিস (PaaS) প্রদানকারী যা রিয়াক্ট অ্যাপগুলি ডিপ্লয়ের জন্য আরও ভাল সাপোর্ট দেয়। এসব হোষ্টিং প্রোভাইডাররা রিয়াক্ট অ্যাপের প্রয়োজন অনুযায়ী আরও বেশী ফ্লেক্সিবিলিটি, স্কেলযোগ্য ও আরও ভাল সাপোর্ট দিয়ে থাকে।
কিন্তু আপনি শেয়ার্ড হোস্টিং এ রিয়াক্ট অ্যাপ হোষ্ট করতে চান, কোন চিন্তা করবেন না। এই টিউটোরিয়ালে, আমরা আপনাকে cPanel শেয়ার্ড হোস্টিং-এ একটি রিয়াক্ট জেএস অ্যাপ্লিকেশন ডিপ্লয় করার প্রক্রিয়ার মধ্য দিয়ে নিয়ে যাব। যদিও cPanel প্রাথমিকভাবে স্ট্যাটিক ওয়েবসাইট হোস্ট করার জন্য ডিজাইন করা হয়েছে, কিছু পরিবর্তন এবং কৌশল সহ, আমরা সফলভাবে এটিতে একটি রিয়াক্ট জেএস অ্যাপ ডিপ্লয় করতে পারি। চলেন শুরু করা যাক!
ধাপ ১: একটি প্রোডাকশন বিল্ড অ্যাপ তৈরী করুন।
আমরা এগিয়ে যাওয়ার আগে, নিশ্চিত করুন যে আপনার কাছে একটি React.js অ্যাপ ডিপ্লয় করার জন্য প্রস্তুত আছে। আপনি যদি এখনও আপনার অ্যাপ্লিকেশন তৈরি না করে থাকেন তবে এই পদক্ষেপগুলি অনুসরণ করুন:
- আপনার লোকাল মেশিনে নোড.জেএস এবং এনপিএম ইনস্টল করুন, যদি ইনস্টল না থাকে।
- আপনার টার্মিনাল বা কমান্ড প্রম্পট ওপেন করুন এবং প্রজেক্ট ডিরেক্টরিতে চলে যান।
- নিম্নলিখিত কমান্ড চালান:
npm run build
- এটি আপনার রিয়াক্ট জেএস অ্যাপের “বিল্ড” ডিরেক্টরিতে প্রোডাকশন-রেডি বিল্ড তৈরি করবে।

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

ধাপ ২: cPanel অ্যাকাউন্ট প্রস্তুত করুন
রিয়াক্ট জেএস অ্যাপটি cPanel-এ ডিপ্লয় করার আগে, নিম্নলিখিত ধাপগুলো অনুসরন করতে হবে:
- cPanel অ্যাকাউন্টে অ্যাক্সেস করুন।
- একটি নতুন সাবডোমেইন তৈরি করুন অথবা আপনার ইতিমধ্যে রয়েছে এমন একটি ব্যবহার করুন আপনার রিয়াক্ট অ্যাপের জন্য। উদাহরণস্বরূপ, “react.yourdomain.com”.
একটি সাবডোমেন তৈরি করতে। আপনার cPanel অ্যাকাউন্টে যান। ডোমেন বিভাগ খুঁজুন “ডোমেন” বিভাগের অধীনে “ডোমেন” ক্লিক করুন।

“create a new domain” বাটনে ক্লিক করুন।

“ডোমেন” টেক্সট বক্সে যোগ করতে সাবডোমেন নাম লিখুন।
“domain.tld” এর সাথে “শেয়ার ডকুমেন্ট রুট (/home/username/public_html) অপশন অনির্বাচন করুন।”
ডিরেক্টরিটি লিখুন যেখানে আপনি এই সাবডোমেনের জন্য ফাইলগুলি রাখতে চান৷
“Submit” বাটনে ক্লিক করুন।

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

এটি আপনাকে cPanel ফাইল ম্যানেজার সহ একটি নতুন ট্যাবে পুনঃনির্দেশ করবে যেখানে আপনি আপনার সাবডোমেন রুট ফোল্ডারটি দেখতে পাবেন এবং এটিতে ক্লিক করুন। ফোল্ডারে ক্লিক করার পর ফোল্ডারটি খালি দেখাবে।

উপরের বারে আপনি একটি আপলোড বাটন দেখতে পাবেন। এটিতে ক্লিক করুন এবং এটি আপনাকে একটি নতুন ট্যাবে পুনঃনির্দেশ করবে যেখানে আপনি আপনার রিয়াক্ট জেএস ফাইল আপলোড করতে পারবেন।

বিল্ড বা ডিস্ট ফোল্ডার থেকে আপনার জিপ ফাইল আপলোড করুন যা আপনি একটু আগে তৈরি করেছেন।

100% আপলোড করার পর cPanel ফাইল ম্যানেজার ট্যাবে যান এবং রিফ্রেশ বোতামে ক্লিক করুন।
আপনি সেখানে আপলোড করা জিপ ফাইলটি দেখতে পাবেন এবং ফাইলটি এক্সট্রাক্ট করুন।

এখন আপনি এখানে এক্সট্রাক্ট করা ফোল্ডার ফাইল দেখতে পাবেন।

আপলোড সম্পূর্ণ হলে, নিশ্চিত করুন যে সাবডোমেন ফোল্ডারে “index.html” ফাইল এবং অন্যান্য ফোল্ডার রয়েছে।
ধাপ ৪: আপনার ডিপ্লয় করা রিয়াক্ট জেএস অ্যাপটি এক্সেস করুন।
অভিনন্দন! আপনার রিয়াক্ট জেএস অ্যাপ এখন cPanel শেয়ার্ড হোস্টিং-এ ডিপ্লয় করা হয়েছে। এটি অ্যাক্সেস করতে, আপনার ওয়েব ব্রাউজার খুলুন এবং আপনার সাবডোমেন URL লিখুন (যেমন, react.yourdomain.com)। আপনার রিয়াক্ট জেএস অ্যাপটি সুন্দরভাবে চলছে দেখতে পাবেন।
সমাপ্তি:
এই টিউটোরিয়ালে আমরা শিখেছি কিভাবে cPanel শেয়ারড হোস্টিংয়ের মাধ্যমে রিয়াক্ট জেএস অ্যাপটি ডিপ্লয় করতে হয়। আমরা প্রোডাকশন বিল্ড তৈরি করেছি। cPanel প্রাথমিকভাবে স্ট্যাটিক ওয়েবসাইট হোস্টিং জন্য ডিজাইন করা হয়েছে তবে আমরা কিছু রাইট রুল সেট আপ করেছি যাতে রিয়াক্ট জেএস অ্যাপটি সঠিকভাবে লোড হয়। এখন আপনার রিয়াক্ট জেএস অ্যাপটি শেয়ার্ড হোস্টিং এর সুবিধা ব্যবহার করে বিশ্বের কাছে আপনার ওয়েবসাইটটি প্রদর্শন করতে পারেন এবং ব্যবহারকারীদের সেবা প্রদান করতে পারবেন। আপনার সফলতার জন্য আমি আপনাকে শুভেচ্ছা জানাই! হ্যাপি কোডিং।