কিভাবে একদম শুরু থেকে শেষ পর্যন্ত ওয়েব ডিজাইন এন্ড ডেভেলপমেন্ট শিখবো

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

তো চলুন শুরু করা যাক,

যারা ওয়েব ডিজাইন এন্ড ডেভেলপমেন্ট সেক্টরে কাজ করে তারা মূলত ওয়েবসাইট বা ওয়েব এপ্লিকেশন তৈরি করে থাকে। বিভিন্ন কোম্পানির জন্য ওয়েবসাইট তৈরি করে দিয়ে থাকে। আপনি দৈনন্দিন জীবনে ইন্টারনেটে যত ওয়েবসাইট দেখেন সব এই ওয়েব ডেভেলপারদের তৈরি করা।

আর এই ওয়েব ডেভেলপার তিন ধরনের হয়ে থাকে,

1. ফ্রন্ট এন্ড ডেভেলপার ( ওয়েব ডিজাইনার )
2. ব্যাক এন্ড ডেভেলপার ( ওয়েব ডেভেলপার )
3. ফুল স্টাক ওয়েব ডেভেলপার ( ওয়েব ডিজাইনার এন্ড ডেভেলপার )

এখন চলুন জেনে নেই কোন ডেভেলপারদের কি কাজ এবং সেটা হতে হলে আপনার কি কি শিখতে হবে।

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

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

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

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

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

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

এখন চলুন আপনাকে বলে দেই একজন প্রফেশনাল ফ্রন্ট এন্ড ডেভেলপার হতে কি কি শেখা লাগে?

১। এইচটিএমএল ( HTML ) প্রথমেই আপনাকে এইচটিএমএল শিখতে হবে। পৃথিবীতে যত ওয়েবসাইট আছে সব ওয়েবসাইট তৈরি করতে প্রথমেই এইচটিএমএল ব্যবহার করতে হয়। এটি ব্যবহার করা ছাড়া কোনো ওয়েবসাইট তৈরি করা যাবে না। এইচটিএমএল কোনো প্রোগ্রামিং ভাষা নয়। এটিকে বলে ওয়েবসাইটের মার্কাপ ভাষা যা ব্যবহার করে যেকোনো ওয়েবসাইটের স্ত্রাকচার তৈরি করা হয়।

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

2। সিএসএস ( CSS ) এইচটিএমএল ভালোভাবে শেখা শেষ করার পর আপনাকে সিএসএস শিখতে হবে। সিএসএস কোনো প্রোগ্রামিং ভাষা না, সিএসএস এর পূর্ণরূপ কেসকেটিং স্টাইল শিট। মানে ওয়েবসাইটের স্টাইল করার জন্য এই ভাষা ব্যবহার করা হয়। যেকোনো ওয়েবসাইটের ডিজাইন পার্ট টা এই সিএসএস এর দায়িত্তে থাকে।

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

৩। জাভাস্ক্রিপ্ট এবং জেকুইরি ( JAVASCRIPT & JQUERY ) এই পর্যায়ে আপনাকে জাভাস্ক্রিপ্ট এবং জেকুইরি শিখতে হবে। ভয় পাইয়েন না। কারন এখানে জাভাস্ক্রিপ্ট এর এডভান্স কিছু শেখা লাগবে না। শুধু বেসিক ধারনা থাকলেই হবে। কারন জাভাস্ক্রিপ্ট যদি আপনি না পারেন তাহলে জেকুইরি কিছুই বুঝবেন না।

জেকুইরি কেন শিখবো ?

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

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

৪। বুটস্ট্রাপ ( BOOTSTRAP ) বুটস্ট্রাপ  হচ্ছে একটি জনপ্রিয় ফ্রন্ট এন্ড ওয়েব ফ্রেম ওয়ার্ক যেটার সাহায্যে অল্প কোডিং করেই আপনি ওয়েবসাইট এর ডিজাইন করে ফেলতে পারবেন। এটা একটি সিএসএস ফ্রেমওয়ার্ক এবং সম্পূর্ণ ফ্রি। আপনি যদি সিএসএস ভালো করে শিখে থাকেন তাহলে এই বুটস্ট্রাপ আপনার শিখতে অনেক সহজ লাগবে।

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

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

তবে এখানে একটি কথা আছে সেটা হচ্ছে বায়ার যদি আপনাকে কোনো ইমেজ বা পিএসডি ফাইল দিয়ে বলে এটাকে ডিজাইন করে দিতে তাহলে আপনি কি করবেন? আপনি কি কাজটি ছেড়ে দিবেন? এটা করা যাবে না। এই কারনেই আপনাকে বেসিক ফটোশপ সম্পর্কে ধারনা রাখতে হবে।

ফটোশপ আপনি কেন শিখবেন?

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

১। কিভাবে ফটোশপ থেকে যেকোনো ইমেজ নেয়া যায়,

২। কিভাবে বেসিক ফটোশপ থেকে লেখার ফন্ট এবং কালার নেয়া যায়

৩। ইমেজ ক্রপিং, ব্যাকগ্রাউন্ড রিমোভ কিভাবে করা হয়

প্রাথমিকভাবে এগুলো শিখলেই হবে। এরপরে যদি আরও কিছু শেখার প্রয়োজন হয় তাহলে তখন শিখে নিবেন।

ফ্রন্ট এন্ড ডেভেলপমেন্ট শেখা শেষ।

এখন চলুন বলে দেই একজন ব্যাক এন্ড বা ফুল স্টাক ওয়েব ডেভেলপার হতে কি কি শেখা লাগে ?

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

২। ওয়ার্ডপ্রেস ( WordPress ) পিএইচপি শেখার পর আপনি ওয়ার্ডপ্রেস শিখবেন। পিএইচপি যদি ভালো করে শিখতে পারেন তাহলে ওয়ার্ডপ্রেস আপনার কাছে অনেক সহজ লাগবে। ওয়ার্ডপ্রেসের যেই ফিচারগুলো রয়েছে সেগুলো অলরেডি তৈরি করা আছে। আমরা শুধু এগুলো ব্যবহার করবো।

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

আরো পড়ুনঃ

1. ওয়ার্ডপ্রেস কিভাবে শুরু করব? ওয়ার্ডপ্রেস শিখতে কতদিন লাগে?
2. কিভাবে ওয়ার্ডপ্রেস দিয়ে প্রফেশনাল ইকমার্স ওয়েবসাইট তৈরি করা যায়

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

এই এইচটিএমএল থেকে শুরু করে ওয়ার্ডপ্রেস পর্যন্ত শেখার পর আপনাকে SEO শিখতে হবে। তবে এটা বাধ্যতামূলক না। আপনি শিখতেও পারেন আবার ইচ্ছা করলে নাও শিখতে পারেন। কিন্তু শিখলে আপনি অন্যদের থেকে এগিয়ে থাকবেন।

একটি ওয়েবসাইট তৈরি করলে সেই ওয়েবসাইটের অবশ্যই SEO করতে হয় যাতে গুগল সেই ওয়েবসাইটকে সার্চ রেজাল্টে রেঙ্কিং দিতে পারে। আপনি যদি কোনো ক্লাইন্টের ওয়েবসাইট তৈরি করে তারপর সেই ওয়েবসাইটের SEO করে দেন তাহলে সেই প্রোজেক্ট থেকে অনেক ইনকাম করতে পারবেন। তাই SEO শেখাটা জরুরি।

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

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

উপরের বিষয়গুলো যদি আপনার বুঝতে সমস্যা হয় তাহলে আপনি নিচের ভিডিওটি দেখতে পারেন।

কোনো প্রশ্ন থাকলে অবশ্যই নিচে কমেন্ট করে জানাবেন। আমি উত্তর দেয়ার চেষ্টা করবো।

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