# Web Design & Web Development কি?

<s>Post No-01:</s>

<mark>আসসালামুয়ালাইকুম আশা করি সবাই ভালো আছেন। আমি প্রতিদিন কিছু বেসিক </mark> **<mark>Web Design and Development</mark>** <mark> এর বেসিক বিষয় নিয়ে ব্লগ পোস্ট করব যেগুলা আপনাদের বেসিক ধারণা গুলাকে ক্লিয়ার করে দিবে আশা করছি আজকে থেকে নিয়মিত ব্লগ পোস্ট করার চেষ্টা করবো ইনশআাল্লাহ ।</mark>  

**ওয়েবসাইট কি?**

সহজ ভাষায়, ওয়েবসাইট হল ওয়েবপেজের একটি সংগ্রহ। 'ওয়েবপেজ' হল অনলাইন পেজ যা আপনি কম্পিউটার বা স্মার্টফোনে ইন্টারনেট এবং বব্রাউজারের মাধ্যমে দেখতে পান। উদাহরণস্বরূপ, [https://coderlabib.com](https://coderlabib.com) একটি ওয়েবসাইট এবং আপনি বর্তমানে ইন্টারনেটের সাহায্যে এটিতে একটি ওয়েব পৃষ্ঠা (এই নিবন্ধটি) দেখছেন৷ বর্তমানে গড়ে প্রায় প্রতিদিন ৫৭৬টি ওয়েবসাইট তৈরি হয়। মার্কেটপ্লেসেও এর চাহিদা দিনে দিনে বেড়েই যাচ্ছে।

![](https://lh4.googleusercontent.com/bsaMq1GCGjarrUnGpuHKLnKuk2r2gLvLTlN-QSqkJ_DPWau7Slf7YGK70-JUHt5Yt-4qAZ9djSyj2NLpajiHDiOeUJQP5WOYy6ITHhA2h2imMerVy2SpZ6v7a789weGc3ZgoPwsv01n_37CrD9hxcv3S30GQ8_g1HL4T6JE9ra9GzhSh01ovn498XXDI align="left")

**একটি ওয়েবসাইট এ দুইটি ধাপ আছে:**

1.  **Design (Html, CSS, Bootstrap, jquery)**
    
2.  **Development ২টা part আছে (Server site language, database)**
    

1.  **Front-End Developer (Html, CSS, Bootstrap, JavaScript)**
    
2.  **Back-End Developer (Server site language, database)**
    

**01\. Web Design :**

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

**প্রশ্ন:** **ওয়েব ডিজাইনারের কি কি স্কিল থাকতে হবে?**

**উত্তর:** 1.HTML, 2.CSS, 3. Bootstrap, 4. UI basic Idea, 5. JavaScript Basic ( জানা থাকলে ভালো )

উপরে স্কিলগুলো শিখে আপনি Upwork, and Fiverr-এর মতো মার্কেটপ্লেস-এ কাজ করতে পারবেন।  এতে কোনো সন্দেহ নেই, এরপর আপনি মার্কেটপ্লেস থেকে কিছু ইনকাম করবেন এবং নিজের স্কিলকে ডেভেলপ করবেন।

**প্রশ্ন:** **ওয়েব ডিজাইনার হওয়ার পর আমি কি শিখবো? বা কি শিখলে মার্কেটপ্লেস-এ বেশি বেশি কাজ পাবো?**

**উত্তর:** ওয়ার্ডপ্রেস শেখা উচিত।  কারণ বর্তমানে ওয়ার্ডপ্রেসের মার্কেট শেয়ার সব ওয়েবসাইটের 43%। W3Techs-এর মতে, ওয়ার্ডপ্রেস ইন্টারনেটের সমস্ত ওয়েবসাইটের 43% ক্ষমতা দেয়, যার মধ্যে কন্টেন্ট ম্যানেজমেন্ট সিস্টেম (CMS) বা কাস্টম-কোডেড CMS নেই। অথবা অন্যভাবে বলতে গেলে, ওয়ার্ডপ্রেস ওয়েবের এক-তৃতীয়াংশের উপর ক্ষমতা রাখে! 

![](https://lh3.googleusercontent.com/1d95Mpqo6XHvw8bbfEnDXK4r05jr3rxPRRHakY7ILVtrfRPxgQWHwgpGtIyBcPWvMqSrKIA4ROPwj0BrhkRYGDaSFndcOtUCDkRxY6FtMh0cUwkqdRvmoAwx_gwx4Ntg_Wf8HUgDZVsxC-PtSeOtLxE9wYakHBrNBhh-zqOabwVqyx-qYu6OUQXLPsh3 align="left")

**ওয়েব ডিজাইন** ওয়েবসাইটের উৎপাদন এবং রক্ষণাবেক্ষণে বিভিন্ন দক্ষতা এবং শৃঙ্খলাকে অন্তর্ভুক্ত করে। ওয়েব ডিজাইনের বিভিন্ন ক্ষেত্রের মধ্যে রয়েছে ওয়েব গ্রাফিক UI and UX ডিজাইন, ১. UI mean ইউজার ইন্টারফেস ডিজাইন, ২. UX mean ইউজার এক্সপেরিয়েন্স।

**What is UI?**

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

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

**What is UX?**

*   UX ডিজাইনাররা পণ্য, পরিষেবা এবং প্রক্রিয়াগুলির জন্য বিরামহীন ব্যবহারকারীর অভিজ্ঞতা তৈরি করতে বাজার গবেষণা, পণ্য বিকাশ, কৌশল এবং নকশাকে একত্রিত করে। তারা গ্রাহকের সাথে একটি সেতু তৈরি করে, কোম্পানিকে তাদের চাহিদা এবং প্রত্যাশাগুলি আরও ভালভাবে বুঝতে - এবং পূরণ করতে সহায়তা করে৷
    

**01\. Development :**

ওয়েব ডেভেলপমেন্ট হল ইন্টারনেট বা ইন্ট্রানেটের জন্য একটি ওয়েবসাইট তৈরির সাথে জড়িত কাজ। ওয়েব ডেভেলপমেন্টের পরিসর হতে পারে প্লেইন টেক্সটের একটি সাধারণ একক স্ট্যাটিক পৃষ্ঠা তৈরি করা থেকে শুরু করে জটিল ওয়েব অ্যাপ্লিকেশন, ইলেকট্রনিক ব্যবসা এবং সামাজিক নেটওয়ার্ক পরিষেবা পর্যন্ত।

![](https://lh6.googleusercontent.com/XpLm8HmkZSHceGVbQb4PYLWULrGpxk4-geKNzpMmjYH_yr9RYCtBiqh4cGd_zKdMUUc1n9DEJ_VtBYruY6UAIB9ZURa7-4baohCVToKvW6iK77Vr73PMwdGnfk5BJTj7LG8azRVYtluj4ljyFy8lpy-wIQa4mLypN2odv8dcQA34VDzeiEZtZ---tj5B align="left")

সহজ ভাষায় যারা ওয়েবসাইট তৈরি করে তাদেরকে ওয়েব ডেভেলপার বলা হয়। ওয়েব ডেভেলপার সাধারণত 2 প্রকার ১. ফন্ট-এন্ড ডেভেলপার, ২. ব্যাক-এন্ড ডেভেলপার, যারা ফন্ট-এন্ড এবং ব্যাক-এন্ড ২টাই পারে তাদেরকে ফুল-স্ট্যাক ডেভেলপার বলে।

**1\. Front-end developer**

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

আপনি ফ্রন্ট-এন্ডকে ক্লায়েন্ট-সাইড এবং ব্যাক-এন্ডকে সার্ভার-সাইড হিসাবে ভাবতে পারেন।

**প্রশ্ন:** Front-End ডেভেলপার হতে কি কি শিখতে হবে?

1.  HTML
    
2.  CSS
    
3.  Bootstrap
    
4.  JavaScript
    

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

**2\. Back-end Developer**

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

**প্রশ্ন: ব্যাক-এন্ড ডেভেলপার হতে কি কি শিখতে হবে?**

*   UI and UX সম্পর্কে বেসিক নলেজ থাকতে হবে. কোনো  ১টা প্রোগ্রামিং ভাষা শিখতে হবে যেমন- 1. JavaScript, 2. PHP, 3. Python, 4. Java, 5. Ruby, 6. GoLang, 7. C#. উপরের যেকোনো একটি প্রোগ্রামিং ভাষা শিখলে আপনি ব্যাক-এন্ড ডেভেলপমেন্ট করতে পারবেন।
    

**3\. ফুল-স্ট্যাক ডেভেলপার** 

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

HTML এবং CSS আয়ত্ত করার পাশাপাশি, তিনি কীভাবে করবেন তাও জানেন:

*   একটি ব্রাউজার প্রোগ্রাম করুন (যেমন JavaScript, jQuery, Angular, or Vue ব্যবহার করে)
    
*   একটি সার্ভার প্রোগ্রাম করুন (যেমন Node.js, PHP, Python, or ASP ব্যবহার করে)
    
*   একটি ডাটাবেস প্রোগ্রাম করুন (যেমন MongoDB, SQL, or SQLite ব্যবহার করে)
    

**প্রশ্ন: ফুল-স্ট্যাক ডেভেলপার কিভাবে হবো ?**

ফুল-স্ট্যাক ডেভেলপার হতে HTML, CSS, Bootstrap, ফ্রন্ট-এন্ড ফ্রেমওয়ার্ক যেকোনো 1টা জানতে হবে যেমন- React.js, Angular.js, Vue.js or Jquery. এরপর সার্ভার-সাইট এ কাজ করতে জাভাস্ক্রিপ্ট-এর Node.js, Express.js Database MonggoDB শিখে আপনি ফুল-স্ট্যাক ডেভেলপার হিসেবে কাজ করতে পারবেন।  

**Popular Stacks**

*   MERN-STACK: JavaScript - MongoDB - Express - ReactJS - Node.js
    
*   MEAN-STACK: JavaScript - MongoDB - Express - AngularJS - Node.js
    
*   MEVN-STACK: JavaScript - MongoDB - Express - VueJS - Node.js
    
*   LAMP stack: JavaScript - Linux - Apache - MySQL - PHP
    
*   LEMP stack: JavaScript - Linux - Nginx - MySQL - PHP
    
*   Django stack: JavaScript - Python - Django - MySQL
    
*   Ruby on Rails: JavaScript - Ruby - SQLite - Rails
    

**Note:** ফ্রন্ট-এন্ড ফ্রেমওয়ার্ক React.js, Vue.js, Angular.js, এগুলো সব JavaScript-এর ফ্রেমওয়ার্ক ব্যাক-এন্ড এ Node.js, Express.js (Server), JavaScript-এর ফ্রেমওয়ার্ক। যেহুতু সব জায়গায় জাভাস্ক্রিপ্ট।  তাই প্রোগ্রামিং ল্যাঙ্গুয়েজে হিসেবে জাভাস্ক্রিপ্ট শেখা বেস্ট হবে। বর্তমানে মোস্ট পপুলার স্ট্যাক-এর মধ্যে বেস্ট MERN-STACK Developer.