বিগিনারদের জন্য ওয়েব ডেভেলপমেন্টের সম্পূর্ণ গাইডলাইন

একবিংশ শতাব্দীতে প্রযুক্তি আমাদের জীবনের প্রতিটি পদক্ষেপে ওতপ্রোতভাবে জড়িয়ে আছে। খাবারের অর্ডার থেকে শুরু করে কেনাকাটা, বিনোদন, এমনকি বিদ্যার্জন— সবকিছুর জন্যই আমরা ব্যবহার করছি কোনো ওয়েবসাইট কিংবা অ্যাপে। আর এই সব অ্যাপ বা ওয়েবসাইট তৈরি করছেন ডেভেলপাররা।

তাই যদি বলা হয় একবিংশ শতাব্দীর অন্যতম মুখ্য এবং গুরুত্বপূর্ণ কাজ ওয়েব ডেভেলপমেন্ট, খুব একটা ভুল হবে না। 

বাইরের দৃষ্টি থেকে এই ফিল্ডকে জটিল এবং দুর্বোধ্য লাগতে পারে। কিন্তু তাই বলে সম্ভাবনাময় এই ফিল্ডটি কখনো এক্সপ্লোর করবেন না তা তো হতে পারে না! তাই আগ্রহীদের জন্য ওয়েব ডেভেলপমেন্ট এর একদম বেসিক থেকে শুরু করে সুবিস্তর ধারণা দেয়া হবে এই আর্টিকেলে।

ফুল স্ট্যাক ওয়েব ডেভেলপমেন্ট কোর্সে ডিসকাউন্ট পেতে হলে

বহুব্রীহির ফুল স্ট্যাক ওয়েব ডেভেলপমেন্ট কোর্সগুলোতে ৪০% ডিসকাউন্ট পেতে নিচের ফর্মটি পূরণ করুন। কুপন কোডটি আপনার ইমেইলে পাঠিয়ে দেবো আমরা।

নিয়মিত ব্যবহার করেন এমন কোনো ইমেইল অ্যাড্রেস দিন
নিয়মিত ব্যবহার করেন এমন কোনো ফোন নাম্বার দিন

ওয়েব ডেভেলপমেন্ট কী?

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

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

ওয়েব ডেভেলপারদের চাহিদা কি আসলেই বেশি?

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

ইউএসের বুরো অব লেবার স্ট্যাটিস্টিক্স বলছে আগামী ১০ বছরে ওয়েব ডেভেলপারদের চাহিদা ৮% বৃদ্ধি পাবে যা অন্যান্য সব চাকরির তুলনায়ই বেশি।

২০২০ এর করোনা মহামারী জীবনযাত্রার মোড় ঘুরিয়ে দিয়েছে এবং সেই মোড়টিও ওয়েব ডেভেলপারদের ভূমিকা বৃদ্ধির দিকেই। ওয়ার্ক ফ্রম হোমের বিপ্লবে মানুষের অনলাইন প্রেজেন্স শুধুই ক্রমবর্ধমান। সবাইকে সবকিছু করতে হচ্ছে অনলাইনে, আর তাই ওয়েব ডেভেলপারদের চাহিদাও বাড়ছে হুহু করে।

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

তাহলে চলুন আমরা এই ওয়েব ডেভেলপমেন্ট এর ফিল্ডকে একটু ভালো করে বুঝতে শুরু করি।

ওয়েব ডেভেলপমেন্ট এর কিছু বেসিক

Web Development নিয়ে আলোচনা শুরুর আগে চলুন আমরা “ওয়েব” নিয়ে একটু জেনে নিই। পৃথিবী ঘিরে থাকা এই “ওয়েব” বা জাল আমাদের চোখে অদৃশ্য হলেও এর কার্যকারিতায় ভূমিকা রাখে বিশাল এক সিস্টেম।   

প্রথমত, বিশ্বজুড়ে যুক্ত থাকা তথ্যের জালটির নাম WWW বা ওয়ার্ল্ড ওয়াইড ওয়েব।

ওয়ার্ল্ড ওয়াইড ওয়েব প্রযুক্তির তিনটি অংশ-

  •  তথ্যকে দেখাবার জন্য ব্রাউজার
  •  তথ্যকে সংরক্ষণের জন্য সার্ভার
  • আর ব্রাউজার আর সার্ভারকে কানেক্ট করার জন্য প্রটোকল

ব্রাউজার

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

সার্ভার

যে সিস্টেমটি ব্রাউজারকে তথ্য সংগ্রহ করে প্রোভাইড করে তা হল সার্ভার। কিছু সার্ভার নিজেই তথ্য সংরক্ষণ করে, আবার কিছু ব্রাউজারের যেখানে তথ্য সংরক্ষিত আছে তার সাথে সরাসরি সংযুক্ত থাকে। রিকোয়েস্ট পাওয়ামাত্র তথ্য খুঁজে বের করে ব্রাউজারে পাঠিয়ে দেয় সার্ভার। সার্ভারের অংশ হিসেবে একটি সফটওয়্যার অ্যাপ্লিকেশন থাকে, যা তথ্যকে ব্রাউজারে প্রদর্শনের যোগ্য ল্যাঙ্গুয়েজে ফরম্যাট করে পাঠায়। Apache, nginx বা IIS বহুল ব্যবহৃত কিছু সার্ভারের উদাহরণ।

প্রটোকল

প্রটোকল হল তথ্য আদান-প্রদানের কিছু প্রতিষ্ঠিত সেট অব রুলস। এটি একই নেটওয়ার্কে থাকা দু’টো ডিভাইসের মাঝে, বা ব্রাউজার এবং সার্ভারের মাঝে তথ্যের আদান-প্রদানকে সহজ করে দেয় পূর্বনির্ধারিত রীতিনীতির মাধ্যমে। ক্লায়েন্ট এবং সার্ভারের মাঝে যোগাযোগ কেমন হবে, কীভাবে হবে তা ঠিক করে দেয় প্রটোকল। ইন্টারনেট চালাতে গেলেই যে ‘http’ লেখাটি চোখে পড়ে সব অ্যাড্রেসের গোড়ায়, এটি কিন্তু একটি প্রটোকল।

তাহলে ওয়েবসাইট আসলে কী?

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

আপনি ব্রাউজারের অ্যাড্রেসবারে একটি অ্যাড্রেস লেখার পর ব্রাউজার তা প্রটোকলের মাধ্যমে সার্ভারে পাঠিয়ে দেয়। সার্ভার সেই অ্যাড্রেসকে লোকেট করে সেখান থেকে তথ্য বা ফাইল সংগ্রহ করে একটি প্রদর্শনযোগ্য পেজের রূপ দিয়ে আপনার ব্রাউজারে পাঠায়। আর তখনই আপনি আপনার স্ক্রিনে দেখতে পান কাঙ্ক্ষিত ওয়েবসাইট।

ইউআরএল (URL) কোনটি?

সহজ ভাষায় বলতে গেলে ব্রাউজারের এড্রেস বারে আমরা যা লিখি তা-ই হল ইউআরএল (URL)। সম্পূর্ণ রূপ ইউনিফর্ম রিসোর্স লোকেটর (Uniform Resource Locator)। 

এর কিছু নির্দিষ্ট অংশ থাকে যা এর বিভিন্ন বৈশিষ্ট্য নির্দেশ করে। যেমন, http://www.example.com/file.html একটি URL। ইতিমধ্যে আমরা জেনেছি ‘http’ হল প্রটোকল আর www বলতে বোঝায় আপনি ওয়ার্ল্ড ওয়াইড ওয়েবে যাচ্ছেন।

এর example.com অংশটি ডোমেইন নেম যা সার্ভারকে অ্যাপয়েন্ট করে, আর file.html হচ্ছে সেই ফাইলটা যেটার তথ্য আপনি এক্সেস করতে চাচ্ছেন। আবার URL এর মাধ্যমে আপনি যে ডিভাইসকে এক্সেস করছেন তাকে আইপি অ্যাড্রেস (IP Address) হিসেবেও দেখানো যায়।

আইপি অ্যাড্রেস বলতে আসলে কী বোঝায়?

আলোচনার মাঝে আমরা এক নতুন টার্ম পেয়ে গেলাম, তা হলো আইপি এড্রেস। আইপির (IP) পূর্ণরূপ হল ইন্টারনেট প্রটোকল। আইপি অ্যাড্রেস মূলত একটি স্ট্রিং অব নাম্বার্স। ইন্টারনেটে কানেক্টেড সবগুলো ডিভাইসের নিজস্ব এবং অনন্য একটি আইপি অ্যাড্রেস থাকে। যা দেখতে অনেকটা এমন- 123.45.321.1… (আপনার ডিভাইসের আইপি অ্যাড্রেস জানতে “What is my IP Address” লিখে গুগলে সার্চ দিয়ে প্রথমদিকের লিংকগুলোতে প্রবেশ করলেই জেনে যাবেন।)

সব ওয়েব সার্ভারেরও তাই একটি নিজস্ব আইপি অ্যাড্রেস থাকে। সেখানে ওয়েবপেজ হিসেবে প্রদর্শনের তথ্য বা ফাইলগুলো হোস্টেড থাকে, সাথে থাকে সেটাকে ব্রাউজারে পৌঁছানোর জন্য প্রয়োজনীয় হার্ডওয়্যার এবং সফটওয়্যার।

এই স্ট্রিং অব নাম্বার্সকে মানুষের মনে রাখার সুবিধার্থে ডোমেইন নেম দিয়ে রিপ্লেস করা হয়। যেমন, facebook.com একটি ডোমেইন নেম। এই অংশটুকু জেনেই কিন্তু আমরা ফেসবুকে পৌঁছে যেতে পারি, এর আইপি এড্রেস মনে রাখার প্রয়োজন হয় না।

এইচিটিটিপি (HTTP) এর অর্থ

প্রটোকলের উদাহরণ দিতে গিয়ে আমরা জেনেছি http একটি প্রটোকল। এর পূর্ণরূপ হল HyperText Transfer Protocol। এটি একটি নেটওয়ার্ক প্রটোকল যা অন্যান্য নেটওয়ার্ক প্রটোকলের মতোই ক্লায়েন্টের ব্রাউজার ও সার্ভারের মধ্যে তথ্যের আদান-প্রদান কীভাবে হবে তা ঠিক করে দেয়। 

এইচিটিটিপি (HTTP)-তে HyperText বলতে বোঝায় হাইপারলিংক সংযুক্ত ডকুমেন্ট ( হাইপারলিংক টেক্সট বা ইমেজ হল যেখানে ক্লিক করলে ইউজারকে তা আরেকটা ডকুমেন্টে পাঠিয়ে দিবে), ট্রান্সফার বলতে ওয়েব সার্ভার থেকে ব্রাউজারে রিকোয়েস্টেড ওয়েবপেজ পাঠানোর কথা বোঝায়, আর প্রটোকল হচ্ছে যেসব বিট বাইট বা ক্যারেক্টারকে ব্যবহার করে তথ্যের আদান-প্রদান হবে তার রীতিনীতি। 

এরকম আরো প্রটোকল হতে পারে File Transfer Protocol (FTP) বা HyperText Transfer Protocol Secure (HTTPS)— যেগুলো সবই একই উদ্দেশ্যে ব্যবহৃত।

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

ফ্রন্ট-এন্ড এবং ব্যাক-এন্ড কী?

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

Front-end-vs-Back-end-বিগিনারদের জন্য ওয়েব ডেভেলপমেন্টের সম্পূর্ণ গাইডলাইন
ফ্রন্ট-এন্ড vs ব্যাক-এন্ড

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

এ দু’টো ব্যাপার নিয়েই সামনে আরো ডিটেইলে আলোচনা করে হবে।

ডেটাবেজ টেকনোলজি

ওয়েবসাইট ফাংশনের জন্য প্রয়োজনীয় ফাইল এবং কনটেন্ট অন্বেষণ, গোছানো, এডিট করা এবং সেভ করা যেন সহজ হয় তা নিশ্চিত করে ডেটাবেজ। ডেটাবেজও সার্ভারের মধ্যেই রান করে, এবং বেশিরভাগ ওয়েবসাইটই একটি রিলেশনাল ডেটাবেজ সিস্টেম (RDBMS) ব্যবহার করে।

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

সিএমএস (CMS) কী?

Content Management System বা সিএমএস হচ্ছে একটি ওয়েব অ্যাপ্লিকেশন বা সিরিজ অব প্রোগ্রামস যা ওয়েব কনটেন্ট ক্রিয়েট এবং ম্যানেজকে সহজ করতে ব্যবহৃত হয়।

একটি ওয়েবসাইট তৈরি করতে সিএমএসের প্রয়োজন না হলেও এর প্লাগ-ইন্স এবং অ্যাড-অন্স ওয়েবসাইটকে সমৃদ্ধ করে এবং ওয়েবসাইট রক্ষণাবেক্ষণেও বেশ উপকারী হয়। WordPress, Joomla, Drupal- এগুলো কিছু সিএমএস-এর উদাহরণ।

ফ্রী ওয়ার্ডপ্রেস কোর্স করতে এখানে ক্লিক করুন

ওয়েব ডেভেলপমেন্ট এবং ওয়েব ডিজাইনের মধ্যে পার্থক্য

ওয়েব ডেভেলপমেন্টের সাথে সাথে ওয়েব ডিজাইন টার্মটাও আমরা প্রায়ই শুনে থাকি এবং আপাতদৃষ্টিতে দুটিকে এক জিনিস বলে মনে হতে পারে। তবে প্রকৃতপক্ষে দুটো পুরোপুরি আলাদা।

একটি ওয়েবসাইটকে যদি আমরা একটি মোটরগাড়ি হিসেবে কল্পনা করি, তবে সেখানে ওয়েব ডেভেলপার ইঞ্জিন, চাকা, গিয়ার্স এসব নিয়ে কাজ করবে। অপরপক্ষে ডিজাইনার গাড়ির ভিজ্যুয়াল দিক নিয়ে কাজ করবে— ঠিক করবে গাড়ির রং, সিটের ডিজাইন কিংবা কন্ট্রোলের লে-আউট।

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

আর ডেভেলপরারের কাজ হচ্ছে এই ডিজাইনকে একটি লাইভ এবং ফাংশনাল ওয়েবসাইটে রূপ দেয়া। একজন ফ্রন্ট-এন্ড ডেভেলপার ওয়েব ডিজাইনারের তৈরি ভিজ্যুয়াল ডিজাইনকে নিয়ে এইচটিএমএল (HTML), সিএসএস (CSS) বা জাভাস্ক্রিপ্ট (JavaScript)-এর মত বিভিন্ন কোডিং ল্যাংগুয়েজগুলোকে (বিস্তারিত আলোচনা সামনে) ব্যবহার করে ওয়েবসাইটে রূপ দেয়। আর তাকে সার্ভার থেকে ব্রাউজার পর্যন্ত পুরোপুরি ফাংশনাল করে তোলে ব্যাক-এন্ড ডেভেলপার।

এক বাক্যে বললে বলতে হয়, একজন ওয়েব ডিজাইনার হচ্ছে ওয়েবসাইটের আঁকিয়ে, আর ওয়েব ডেভেলপার হচ্ছে নির্মাণকারী।

Web-Design-vs-Web-Development-বিগিনারদের জন্য ওয়েব ডেভেলপমেন্টের সম্পূর্ণ গাইডলাইন
ওয়েব ডিজাইন vs ওয়েব ডেভেলপমেন্ট

ওয়েব ডেভেলপার আসলে কী করেন?

এতক্ষণ আমরা ওয়েবসাইটের নানান খুঁটিনাটি বিষয় জানলাম এবং তা জানতে গিয়ে একজন ওয়েব ডেভেলপারের কাজ সম্পর্কে একটি আপাত ধারণাও পেলাম। এবার সেই  ধারণাকে আরো স্পষ্ট ও বিস্তৃত করে নেয়া যাক। 

ওয়েব ডেভেলপারের কাজ হচ্ছে ওয়েবসাইটের তৈরি ও রক্ষণাবেক্ষণ করা। সে কাজ ইন-হাউজ বা ফ্রিল্যান্স যেকোনো ভাবেই হতে পারে প্রতিষ্ঠানের প্রয়োজন অনুযায়ী। তার কাজের ধরন নির্ভর করে তিনি কি ফ্রন্ট-এন্ড নাকি ব্যাক-এন্ড নাকি ফুল-স্ট্যাক ওয়েব ডেভেলপার – তার উপর। ফুল-স্ট্যাক ওয়েব ডেভেলপার ফ্রন্ট-এন্ড এবং ব্যাক-এন্ড দু’টোর উপরই স্পেশালাইজ করেন।

ওয়েব ডেভেলপাররা তাদের ক্লায়েন্ট এবং ওয়েবসাইট ইউজার দু’দিকের প্রয়োজনের সামঞ্জস্য রেখে  একটি প্রোডাক্ট তৈরি করেন। সেখানে তারা স্টেকহোল্ডার, ক্লায়েন্ট এবং ডিজাইনারদের সাথে একসাথে কাজ করে— ওয়েবসাইটটির লুক, ফিল এবং ফাংশন কেমন হবে— সেই ভিশনকে বাস্তব রূপ দেন।

আবার, Web Development এর এক বিশাল অংশ জুড়ে আছে bug আইডেন্টিফাই এবং ফিক্স করা।  ডেভেলপ করার পাশাপাশি ওয়েবসাইট বা সিস্টেমকে সবসময় অপ্টিমাইজ এবং ইম্প্রুভ করাটাও ওয়েব ডেভেলপারের কাজ।

তাই ওয়েব ডেভেলপাররা হন খুবই দক্ষ প্রবলেম সল্ভারস, যারা প্রতিনিয়তই বিভিন্ন সমস্যার সময়োপযোগী সমাধান বের করে সিস্টেমকে সচল রাখেন। আর বলা বাহুল্য, তাদের প্রোগ্রামিং ল্যাংগুয়েজের উপরও দখল থাকতে হয় সবিশদ।

এই সবকিছু মাথায় রেখে এখন বিভিন্ন ধরনের ওয়েব ডেভেলপারদের নির্দিষ্ট কাজগুলোর উপর চোখ বুলিয়ে নেয়া যাক।

ফ্রন্ট-এন্ড ওয়েব ডেভেলপারের কাজ

ফ্রন্ট-এন্ড ডেভেলপার একটি ওয়েবসাইট বা অ্যাপ্লিকেশনের ফ্রন্ট-এন্ডের কোড করেন। অর্থাৎ তারা ব্যাক-এন্ডের ডেটাকে প্রতিদিনের ব্যবহারকারীদের জন্য সহজে বোধগম্য, দৃষ্টিনন্দন এবং ফাংশনাল করে  তোলেন। তারা ওয়েব ডিজাইনারদের দেয়া ডিজাইনকে এইচটিএমএল (HTML), সিএসএস (CSS) বা জাভাস্ক্রিপ্ট (JavaScript)-এর যাদুতে বাস্তব রূপ দেন।

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

তারা ওয়েবসাইটগুলো এমনভাবে কোড করেন যাতে বিভিন্ন স্ক্রিন সাইজ এবং ডিভাইসের ধরণের সাথে সেগুলো এডাপ্টেবল হয়, ফলে ইউজাররাও সবখানে সন্তোষজনক এক্সপেরিয়েন্স পান।

এছাড়াও ফ্রন্ট-এন্ড ডেভেলপাররা নিয়মিত ইউজেবিলিটি টেস্ট করা, ফ্রন্ট-এন্ডে কোনো bug দেখা দিলে তা ফিক্স করার কাজ করেন। এই সব কাজ করতে তারা SEO (Search Engine Optimization), Software Workflow Management — এগুলোও মাথায় রাখেন।

ব্যাক-এন্ড ওয়েব ডেভেলপারের কাজ

ব্যাক-এন্ড ডেভেলপার ফ্রন্ট-এন্ডকে সচল রাখার জন্য যে ইনফাস্ট্রাকচার দরকার তা তৈরি ও রক্ষণাবেক্ষণ করেন। এর মূলত তিনটি অংশ বলা যায়— সার্ভার, অ্যাপ্লিকেশন, ডেটাবেজ।

ব্যাক-এন্ড ডেভেলপারদের করা কোড সার্ভার অ্যাপ্লিকেশন আর ডাটাবেজের স্মুথ কমিউনিকেশন নিশ্চিত করে। এগুলো তারা কীভাবে করেন? প্রথমে সার্ভার-সাইড ল্যাংগুয়েজ যেমন পিএইচপি (PHP), জাভাস্ক্রিপ্ট (JavaScript), রুবি (Ruby), পাইথন (Python) এবং জাভা (Java) দিয়ে অ্যাপ্লিকেশন বিল্ড করেন।

এরপর বিভিন্ন ডেটাবেজ ম্যানেজমেন্ট টুল যেমন মাইএসকিউএল (MySQL), ওরাকল (Oracle), মঙ্গোডিবি (MongoDB), পোস্টগ্রেস্কিউএল (PostgreSQL) দিয়ে ডেটা খোঁজা, এডিট ও সেভ করে ফ্রন্ট-এন্ডে পাঠানোর ব্যবস্থা করেন।

ফ্রন্ট-এন্ড ডেভেলপারদের মতই ব্যাক-এন্ড ডেভেলপাররা ক্লায়েন্টদের সাথে মতবিনিময় করে তাদের প্রয়োজনগুলোকে মেটানোর জন্য কাজ করেন।

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

এসবকিছুই সামনে প্রোগ্রামিং ল্যাঙ্গুয়েজ, লাইব্রেরী, ফ্রেমওয়ার্ক নিয়ে আলোচনার পর আরও পরিষ্কার হবে। আর বলা বাহুল্য, ব্যাক-এন্ড ডেভেলপার ব্যাক-এন্ড এলিমেন্টগুলোর টেস্টিং এবং ডিবাগিংয়ে সবসময়ই নিয়োজিত থাকেন।

ফুল-স্ট্যাক ওয়েব ডেভেলপারের কাজ

যিনি ব্যাক-এন্ড এবং ফ্রন্ট-এন্ড দুদিকেই কাজ করতে পারেন তিনিই ফুল-স্ট্যাক ডেভেলপার। তারা ওয়েব ডেভেলপমেন্ট প্রসেসের সবগুলো ধাপেই দক্ষ, তাই তারা সম্পূর্ণ স্ট্রাটেজি তৈরি এবং খুঁটিনাটি কাজ করায় পারদর্শী।

ফুল-স্ট্যাক ডেভেলপাররা সাধারণত ওয়েব ডেভেলপমেন্ট এর বিভিন্ন ধাপে বিভিন্ন ভূমিকায় কাজ করার অভিজ্ঞতা রাখেন। তাই তাদের সম্পূর্ণ ওয়েব ডেভেলপমেন্ট প্রসেসের উপরই একটি বিচক্ষণতা এবং দূরদর্শীতা থাকা জরুরি।

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

মোবাইল ডেভেলপারের কাজ

ওয়েব ডেভেলপাররা মোবাইলের অ্যাপ ডেভেলপমেন্টেও স্পেশালাইজ করে থাকেন। অনেক ক্ষেত্রেই  ডেস্কটপে যেসব ওয়েবসাইট ব্রাউজার দিয়ে এক্সেস করতে হয়, মোবাইল ফোনে তার নির্দিষ্ট অ্যাপ থাকে।

অ্যান্ড্রয়েড ডেভেলপাররা অ্যান্ড্রয়েড ডিভাইসগুলোর সাথে কম্প্যাটিবল অ্যাপ তৈরি করে। অ্যান্ড্রয়েডের অফিশিয়াল প্রোগ্রামিং ল্যাংগুয়েজ জাভা (Java)। এখনকার সময়ে অনেক অ্যান্ড্রয়েন্ড অ্যাপ তৈরি হচ্ছে রিঅ্যাক্ট (React.js) লাইব্রেরি এবং রিঅ্যাক্ট ন্যাটিভ ফ্রেমওয়ার্ককে ব্যবহার করে।

অপরপক্ষে iOS ডেভেলপাররা সাধারণত সুইফট (Swift) নামের প্রোগ্রামিং ল্যাংগুয়েজে ফ্লুয়েন্ট থাকেন— এটি অ্যাপেল তাদের অ্যাপের জন্য পৃথকভাবে তৈরি করেছে। এছাড়াও মোবাইল ডেভেলপারদের কিছু জনপ্রিয় কিট হচ্ছে কয়েটলিন (Koitlin), ফ্লাটার (Flutter), বা জামারিন (Xamarin)।

প্রোগ্রামিং ল্যাংগুয়েজ, লাইব্রেরি এবং ফ্রেমওয়ার্কসমূহ

Website বা app তৈরির জন্য ওয়েব ডেভেলপারদের যেসব ল্যাংগুয়েজ, লাইব্রেরি এবং ফ্রেমওয়ার্ক নিয়ে কাজ করতে হয়, সেগুলোর নাম ইতোমধ্যেই আমাদের আলোচনায় বেশ কয়েকবার এসেছে। আসুন এগুলো সম্পর্কে আমরা আরেকটু বিস্তারিত জেনে নেই।

প্রোগ্রামিং ল্যাংগুয়েজ বলতে আসলে কী বোঝায়?

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

প্রোগ্রামিং ল্যাংগুয়েজ

প্রোগ্রামিং ল্যাংগুয়েজ মূলত কিছু সেট অব ইন্সট্রাকশন্স এবং কমান্ডস যা কম্পিউটারকে একটি নির্দিষ্ট আউটপুট তৈরি করতে বলে। 

☐ হাই লেভেল ল্যাংগুয়েজ

প্রোগ্রামাররা যে ল্যাংগুয়েজে কোড লেখে তাকে বলে হাই-লেভেল ল্যাংগুয়েজ। এগুলো মানুষের বোধগম্য লজিকাল ওয়ার্ড এবং সিম্বলের সমন্বয়ে তৈরি। আমরা যেভাবে বাংলা ভাষার শব্দ ব্যবহার করে একে অপরের সাথে কথা বলছি, সেভাবেই এই ল্যাংগুয়েজ দিয়ে প্রোগ্রামাররা কম্পিউটারের সাথে কমিউনিকেট করে। হাই-লেভেল আবার ল্যাংগুয়েজ দু’রকম হয়- কম্পাইল্ড বা ইন্টারপ্রেটেড।

  • কম্পাইলড ল্যাংগুয়েজঃ ​সি++ (C++) এবং জাভা (Java) হচ্ছে কম্পাইল্ড হাই-লেভেল ল্যাংগুয়েজ। তাদেরকে লেখা এবং সেভ করা হয় একটি টেক্সট বেজড ফরম্যাটে, যা মানুষ বুঝতে পারে কিন্তু কম্পিউটারের বোধগম্য হয় না। সেই সোর্স কোডটিকে লো-লেভেল ল্যাংগুয়েজ অর্থাৎ মেশিন কোডে কনভার্ট করে কম্পিউটার বুঝে নেয় এবং সে অনুযায়ী আউটপুট প্রোডিউস করে। সাধারণত সফটওয়্যার অ্যাপ্লিকেশন তৈরিতে কম্পাইল্ড ল্যাংগুয়েজ ব্যবহৃত হয়।
  • ইন্টারপ্রেটেড ল্যাংগুয়েজঃ ইন্টারপ্রেটেড ল্যাংগুয়েজ যেমন পার্ল (Perl) বা পিএইচপি (PHP) তে লেখা কোড ইন্টারপ্রেটার প্রোগ্রাম পড়েই এক্সিকিউট করে ফেলতে পারে। ইন্টারপ্রেটেড ল্যাংগুয়েজ রানিং স্ক্রিপ্ট যেমন, একটি ডাইনামিক ওয়েবসাইটের কনটেন্ট জেনারেশনের জন্য ব্যবহার করা হয়। পাইথন (Python)-ও একটি বেশ আধুনিক এবং ডাইনামিক ইন্টারপ্রেটেড ল্যাংগুয়েজ।
☐ লো লেভেল ল্যাংগুয়েজ

লো-লেভেল ল্যাংগুয়েজের কিছু উদাহরণ হলো অ্যাসেম্বলি বা মেশিন ল্যাংগুয়েজ— এগুলোর কোনো ট্রান্সলেশন বা ইন্টারপ্রেটেশনের প্রয়োজন হয় না।

মার্কআপ ল্যাংগুয়েজ

মার্কআপ ল্যাংগুয়েজ একটি টেক্সট ফাইলের ফরম্যাটিং কে স্পেসিফাই করে দিতে ব্যবহৃত হয়। অর্থাৎ যে সফটওয়্যার টেক্সট ডিসপ্লে করছে তাকে মার্কআপ ল্যাংগুয়েজ বলে দেয় টেক্সটের ফরম্যাটিং কেমন হবে। এই ল্যাংগুয়েজ কিছু ছোট ছোট ট্যাগ এবং মানুষের বোধগম্য কিছু স্ট্যান্ডার্ড ওয়ার্ডের সমন্বয়ে গঠিত।

সবচেয়ে জনপ্রিয় দু’টো মার্কআপ ল্যাংগুয়েজ হচ্ছে এইচটিএমএল (HTML) এবং এক্সএমএল (XML)।

☐ HyperText Markup Language (HTML)

HTML এর পূর্ণরূপ HyperText Markup Language। ওয়েবসাইট ফরম্যাটিংয়ে এই ল্যাংগুয়েজ ব্যবহার করা হয়। একটি প্লেইন টেক্সট ডকুমেন্টে HTML ট্যাগ বসানোর মাধ্যমে ঠিক করে দেয়া হয় ওয়েব ব্রাউজার সেই ডকুমেন্টকে কীভাবে প্রদর্শন করবে।

উদাহরণ : HTML এ একটি লেখাকে বোল্ড করার জন্য নির্ধারিত ট্যাগ হচ্ছে <b>...</b>   
এখন যদি কোনো  HTML টেক্সট ডকুমেন্টে লেখা হয়-
 <b>a bold sentence</b>

উইন্ডোতে ডিসপ্লে করবে–

a bold sentence

☐ eXtensible Markup Language (XML)

এক্সএমএল (XML) এর অর্থ eXtensible Markup Language। এটিও  HTML এর মতই, তবে XML এর মূল ফোকাস ডেটা স্টোরিং এবং ট্রান্সপোর্টকে সহজতর করা। এই ল্যাংগুয়েজটি সফটওয়্যার এবং হার্ডওয়্যার-ইন্ডিপেন্ডেন্ট ডেটা স্টোরিং এবং ট্রান্সপোর্টিংয়ের উপায় তৈরি করে, যে কারণে এই ল্যাংগুয়েজটি অনেক কাজে আসে।

স্টাইল শিট ল্যাংগুয়েজ

সহজ ভাষায়, মার্কআপ ল্যাংগুয়েজে লেখা একটি ডকুমেন্টের স্টাইল তৈরির কাজটা করে স্টাইল শিট ল্যাংগুয়েজ। সবচেয়ে প্রচলিত স্টাইল শিট ল্যাংগুয়েজ হচ্ছে সিএসএস (CSS) বা Cascading Style Sheets।

ধরুন একটি ডকুমেন্ট যদি  HTML এ লেখা হয় এবং CSS এ স্টাইল করা হয়, সেক্ষেত্রে তার থেকে আসা ওয়েবপেজটির কনটেন্ট এবং স্ট্রাকচার ঠিক করে দিয়েছে HTML, আর CSS ঠিক করেছে তার ভিজ্যুয়াল প্রেজেন্টেশন।

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

ডেটাবেজ ল্যাংগুয়েজ

ওয়েবসাইটের সব তথ্য গোছালোভাবে সংরক্ষণের জন্য যে ডেটাবেজ প্রয়োজন সেই ডেটাবেজ তৈরি এবং রক্ষণাবেক্ষণের জন্যও প্রয়োজন ল্যাংগুয়েজের।

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

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

এসকিউএল (SQL) বা স্ট্রাকচারড কোয়েরি ল্যাংগুয়েজ হলো রিলেশনাল ডেটাবেজ এক্সেস এবং ম্যানিপুলেশনের জন্য স্ট্যান্ডার্ড ল্যাংগুয়েজ। ডেভেলপারদের একটি ডেটাবেজ সিস্টেমের ডেটা নিয়ে কাজ করার ক্ষমতা দেয় এসব ল্যাংগুয়েজগুলো।

ওয়েব ডেভেলপমেন্ট লাইব্রেরি এবং ফ্রেমওয়ার্ক প্রসঙ্গে

আরো যে দু’টো ব্যাপার নিয়ে ডেভেলপাররা কাজ করে তা হচ্ছে লাইব্রেরী এবং ফ্রেমওয়ার্ক। লাইব্রেরী এবং ফ্রেমওয়ার্ক হচ্ছে প্রি-রিটেন কিছু কোডের সেট। 

ওয়েব ডেভেলপমেন্ট লাইব্রেরী

লাইব্রেরীর পরিসর ছোট এবং ব্যবহৃত হয় স্পেসিফিক ইউজের কেইসে। লাইব্রেরিতে থাকে কিছু ইউজফুল কোডের কালেকশন— পরবর্তীতে রিইউজের জন্য একসাথে গ্রুপ করা থাকে। লাইব্রেরির উদ্দেশ্য হচ্ছে ডেভেলপারদের কম কোড লেখার মাধ্যমে একটি এন্ড গোলে পৌছাতে সাহায্য করা।

যেমন, জাভাস্ক্রিপ্ট (JavaScript) একটি ল্যাংগুয়েজ এবং জেকোয়েরি (JQuery) একটি জাভাস্ক্রিপ্ট লাইব্রেরি। জাভাস্ক্রিপ্টে ১০ লাইনের কোড লেখার জায়গায় JQuery লাইব্রেরি থেকে pre-written code একজন ডেভেলপার ব্যবহার করতে পারে বিভিন্ন ক্ষেত্রে— এতে সময় বাঁচে, শ্রমও কম হয়।

ওয়েব ডেভেলপমেন্ট ফ্রেমওয়ার্ক

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

তাই ফ্রেমওয়ার্ক নির্ধারণ করা অনেক গুরুত্বপূর্ণ সিদ্ধান্ত। কিছু জনপ্রিয় ফ্রেমওয়ার্ক হচ্ছে বুটস্ট্র্যাপ (Bootstrap), জ্যাংগো (Django), রেইলস (Rails) বা এংগুলার (Angular)।  

লাইব্রেরি আর ফ্রেমওয়ার্ক বোঝার সহজ একটা উপায় হচ্ছে ওয়েবসাইটকে একটি বাড়ি বানানোর সাথে তুলনা করা। ফ্রেমওয়ার্ক সেখানে বাসার ফাউন্ডেশন স্ট্রাকচার ঠিক করে দিতে পারে, বাড়ি বানানোর ইন্সট্রাকশন ও গাইডলাইন দিয়ে দিতে পারে।

আর বাড়ি বানানোর সময় ধরুন সিংক বা চুলার মত অনেক কিছুই নিজে তৈরি করা যায়, আবার দোকান থেকে রেডিমেড কিনেও বসিয়ে দেয়া যায়— রেডিমেড কিনে বসানো হচ্ছে লাইব্রেরির pre-written code ব্যবহারের মত, আর নিজে বানানো হচ্ছে নিজে কোডের প্রতিটি লাইন লেখার মত।

একটি ওয়েবসাইট গড়ে তোলার স্টেপ-বাই-স্টেপ প্রসেস

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

একটি ওয়েবসাইট গড়ে তোলার স্টেপ-বাই-স্টেপ প্রসেস
একটি ওয়েবসাইট গড়ে তোলার স্টেপ-বাই-স্টেপ প্রসেস

ধাপ-১: রিসার্চ ও পরিকল্পনা

ওয়েবসাইটের উদ্দেশ্য, ধরন, দর্শক, কনটেন্ট, বাজেট— এসব সম্পর্কে ভাবার দিকনির্দেশনা

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

  • আপনার ওয়েবসাইটের উদ্দেশ্য কী?
  • আপনার অডিয়েন্স কারা এবং তারা আপনার ওয়েবসাইটে কী করবেন বলে আপনি আশা করেন?
  • ওয়েবসাইটটি কী ধরনের? (ব্লগ, তথ্যভিত্তিক, মেম্বারশিপ, অনলাইন স্টোর— এরকম অনেক কিছুই হতে পারে।
  •  আপনি কী ধরনের কনটেন্ট পাবলিশ করতে চাচ্ছেন? কনটেন্টের পরিমাণ কতটুকু হবে?
  • বিগ পিকচার কন্সিডার করে সবচেয়ে ভালো ইউজার এক্সপেরিয়েন্সের জন্য আপনার ওয়েবসাইটের স্ট্রাকচার কেমন হতে পারে?
  • আপনার বাজেট কেমন?

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

ধাপ-২: ওয়েব ডিজাইন তৈরি

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

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

ধাপ-৩: ডেভেলপমেন্ট

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

ফ্রন্ট এন্ড ডেভেলপমেন্ট

HTML, CSS এবং JavaScript এর কম্বিনেশনে তৈরি হতে পারে ওয়েবসাইটের ফ্রন্ট-এন্ড। আমরা ইতোমধ্যেই জানি HTML ওয়েবসাইটের কনটেন্ট এবং ফরম্যাটিং ঠিক করবে এবং CSS করবে স্টাইল। JavaScript

ব্যাক এন্ড ডেভেলপমেন্ট

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

সার্ভার-সাইড ল্যাংগুয়েজ হিসেবে পিএইচপি (PHP), রুবি (Ruby), জাভাস্ক্রিপ্ট (Javascript), পাইথন (Python) এবং জাভা (Java) ইত্যাদি এবং ডেটাবেজ ম্যানেজমেন্ট টুল হিসেবে মাইএসকিউএল (MySQL), ওরাকল (Oracle), মঙ্গোডিবি (MongoDB), পোস্টগ্রেস্কিউএল (PostgreSQL) ইত্যাদি ব্যবহৃত হয়।

এছাড়াও এখানে বিভিন্ন ফ্রেমওয়ার্কের ভেতরে কাজ করতে হয় যেমন বুটস্ট্র্যাপ (Bootstrap) বা জ্যাংগো (Django)। তাই ব্যাক-এন্ড ডেভেলপারদের এগুলোতে পরিপূর্ণভাবে দক্ষ হতে হয়।

ধাপ-৪: টেস্টিং, ডেলিভারি ও লঞ্চিং

ইতোমধ্যেই আপনার ওয়েবসাইটের আইপি অ্যাড্রেস হয়ে গেছে। এখন এর জন্য একটি ডোমেইন নেম অ্যাকোয়ার করতে হবে। ডোমেইন নেম ক্রয় করবার জন্য Bluehost, HostGator, GoDaddy এরকম অসংখ্য সাইট আছে। ডোমেইন রেজিস্ট্রেশন একটি নির্দিষ্ট সময় পর পর রিনিউ করতে হয়।

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

এরপর একটি এফটিপি (FTP, File transfer protocol) এর মাধ্যমে আপনার ওয়েবসাইট ফাইলগুলো হোস্টিং সার্ভারে আপলোড করে দিতে হবে। AWS, Google Cloud, Digital Ocean, Azure— এগুলো হোস্টিং এর জন্য ইনফ্যাস্ট্রাকচার প্রোভাইড করে। সাইট লাইভ করার আগে কোনো গ্লিচ আছে কীনা, এসইও (SEO)-এর জন্য পর্যাপ্ত অপ্টিমাইজেশন হয়েছে কীনা সবকিছু আবারও চেক করে নেয়া ভালো।  

ধাপ-৫: মেইনটেনেন্স

ওয়েবসাইট পাবলিশ হবার পরেও এর নিয়মিত মেইন্টেনেন্সের প্রয়োজন। নিয়মিত কনটেন্ট আপলোড, কোনো bug থাকলে ফিক্স করা এগুলোর মাধ্যমে ওয়েবসাইট সুন্দরভাবে সচল থাকে। এক্ষেত্রে সিএমএস (CMS)-এর ব্যবহার কাজটি আরও সহজ করতে পারে, তবে ওয়েবসাইটের সাথে তা যুক্ত রাখতে হলে তা ডেভেলপমেন্টের স্টেজেই করতে হবে

যে সফট স্কিলগুলো লাগতে পারে একজন ওয়েব ডেভেলপারের

Website গড়ে তোলার ধাপগুলো পড়ে আমরা একটি জিনিস বুঝতে পারছি— একজন ভালো ওয়েব ডেভেলপারের শুধু টেকনিক্যাল স্কিল থাকলেই হয় না, তার ভালো টিমওয়ার্ক করতে জানতে হয়, মানুষের মতামতকে প্রাধান্য দিতে পারতে হয়, হতে হয় ভালো কমিউনিকেটর। অর্থাৎ ওয়েব ডেভেলপারদেরও প্রয়োজন রয়েছে কিছু সফট স্কিলের। এর মধ্যে মুখ্য সফট স্কিল যেগুলো হতে পারে সেগুলোতে আমরা একটু চোখ বুলিয়ে নেই।

কমিউনিকেশন

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

টিমওয়ার্ক

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

ইমোশনাল ইন্টেলিজেন্স

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

অ্যাটেনশন টু ডিটেইল

একটি ছোট টাইপোই আপনার ডেভেলপ করা সম্পূর্ণ ওয়েবসাইটকে অকেজো করে দিতে পারে। তাই পুঙ্খানুপুঙ্খুভাবে খুঁটিনাটি খেয়াল করার ক্ষমতা একজন ওয়েব ডেভেলপারকে অনেক সহায়তা করতে পারে।

ওয়ার্ক এথিক

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

একজন ওয়েব ডেভেলপারের ক্যারিয়ার রূপরেখা

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

আপনি যদি একটি টিমের সাথে একটু কম স্বাধীনতাতেও কাজ করতে স্বচ্ছন্দ হন এবং স্ট্যাবল ইনকাম সোর্স পছন্দ করেন, কোনো ফার্মে ফুল-টাইম পজিশন নিলে আপনার জন্য তা সুবিধাজনক হবে।

অনলাইনে একটু খুঁজলেই দেখবেন অনেক কোম্পানি খুঁজছে ফুল-টাইম ওয়েব ডেভেলপার। আর স্বাধীনতা চাইলে এবং নিজের সাফল্য সম্পূর্ণই নিজের করে নিতে চাইলে ফ্রি-ল্যান্সার হিসেবেও কাজ করতে পারেন। প্রতিনিয়তই বিভিন্ন প্রতিষ্ঠানের ফ্রিল্যান্স ওয়েব ডেভেলপার প্রয়োজন হয়।

কিছু অভিজ্ঞতা অর্জনের পর অনেকে কনসাল্টেন্ট হিসেবেও কাজ করতে পারেন। সময়ের সাথে স্কিল বাড়াতে থাকলে আপনার ডিমান্ড কখনোই শূন্য হবে না।

তবে, দীর্ঘমেয়াদী পরিকল্পনায় শুধু ফ্রিল্যান্সিং রাখলে আপনি নিজেকে অনেক সুযোগ এবং হায়ার লেভেল স্কিল অর্জন থেকে বঞ্চিত করবেন।

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

এজন্য একটি নির্দিষ্ট লেভেলের স্কিল অর্জনের পর কোন টিমে যোগ দেয়ার চেষ্টা করা এবং লক্ষ্য আরও বিস্তৃত করাই বেটার স্ট্র্যাটেজি।

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

কোথায় ও কীভাবে শিখবেন ওয়েব ডেভেলপমেন্ট?

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

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

এর সিলেবাস খুবই আধুনিক এবং সময়োপযোগী এবং কয়েক মাসের একাগ্র চেষ্টায় সুদক্ষ মেন্টরের ডেডিকেটেড সহায়তায় প্রফেশনাল হিসেবে যাত্রার শুরুটা করতে পারেন এখান থেকেই!

পরিশেষে ….

সুতরাং পাঠক, ইন্টারনেট এ পৃথিবী ছেড়ে সহজে যাচ্ছে না, বরং সময়ের সাথে সাথে আরো পাকাপোক্ত হয়ে জেঁকে বসছে। আর ওয়েব ডেভেলপারদের হাত ধরেই ইন্টারনেটের এই যাত্রা সামনে এগিয়ে যাচ্ছে। সুতরাং ঢুকে পড়ুন ওয়েব ডেভেলপমেন্টের জগতে, গড়ে তুলুন নিজের জন্য নির্ভরযোগ্য একটি ক্যারিয়ার।

৪-৬ মাসে ওয়েব ডেভেলপারের স্কিলগুলো শিখতে চান?

বহুব্রীহির ওয়েব ডেভেলপমেন্ট ক্যারিয়ার ট্র্যাক থেকে আপনি প্র্যাকটিক্যাল প্রজেক্টের মাধ্যমে কাজ শিখতে পারবেন। এর জন্য কম্পিউটার সায়েন্স বা আইটি ব্যাকগ্রাউন্ড থাকার কোনো প্রয়োজন নেই।

প্রতিটি কোর্সের সাথে পাবেন:

  • নিয়মিত মেন্টর সাপোর্ট
  • ম্যানুয়াল প্রজেক্ট রিভিউ ও ফিডব্যাক
  • নির্দিষ্ট দিনে নির্দিষ্ট বিষয়ে লাইভ সেশন
  • প্রফেশনাল ব্র্যান্ডিং গাইডলাইন
  • ওয়েব ডেভেলপারের জব ও ইন্টারভিউ প্রিপারেশন সাপোর্ট
  • ইন্টার্নশিপ প্রোগ্রামে অংশগ্রহণের সুযোগ
শেয়ার করুন

1 thought on “বিগিনারদের জন্য ওয়েব ডেভেলপমেন্টের সম্পূর্ণ গাইডলাইন”

  1. actually, ami graduate or undergraduate o na…sudhu HSC Pass Commerce theke tu ami jodi full stack web development kaj sikhte chai and sikhar por amr future career kmn hobe?

    Reply

Leave a Comment