How to Follow my YouTube Channel Video Tutorials?

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

👉 Html Basic Bangla Tutorial: https://bit.ly/3jlSz40

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

👉 CSS Basic Bangla Tutorial: https://bit.ly/2ZI7DRT

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

👉 Project with Html & Css : https://bit.ly/2xCZcfh

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

*** এই প্রোজেক্ট করার পর আপনি কমপক্ষে এর ৩-৫ টা প্রোজেক্ট নিজে নিজে করবেন। তাহলে এইচটিএমএল ও সিএসএস ভালোভাবে পরিষ্কার হবে

👉 PSD to Html : Coming Soon

এরপর আমাদের PSD to Html শিখা উচিত। PSD মানে হচ্ছে Photoshop Document. ভয় পাওয়ার কিছু নেই। এটি আহামরি কিছু না। খেয়াল করবেন আমরা যখন কোন প্রোজেক্ট তৈরি করি তখন নিজের ইচ্ছামত ফন্ট সাইজ, কালার, ইমেজ ব্যাবহার করি। অনেক সময় নষ্ট হয় ডিজাইন আইডিয়া নিয়ে। এই ক্ষেত্রে একজন UI/UX ডিজাইনার ফটোশপে লেয়াউট তৈরি করে দেন। আমাদের কাজ শুদু দেখে দেখে কোডে কনভার্ট করা। আপনি এইচটিএমএল সিএসএস জানলে সহজেই PSD to Html শিখতে পারবেন।

👉 Responsive Design

তারপর আমাদের শিখতে হবে রেস্পনিসভ ডিজাইন। এটির কাজ হচ্ছে যেকোনো ডিভাইস যাতে আমাদের সাইট ভালো করে দেখা যায়। বর্তমানে অনেক সাইজের ডিভাইস পাওয়া যায়। এখন ইউজার কোন সাইজের ডিভাইস ব্যাবহার করে আমরা জানি না। আমরা কিছু কোড এর সাহায্যে আমদের ওয়েবসাইটকে যেকোনো ডিভাইসএ দেখার উপযুক্ত করতে পারি। ‘Project with Html & Css’ এ আমি রেস্পন্সিভ ডিজাইন নিয়ে বিস্তারিত আলোচনা করেছি ঃ)

👉 Flexbox (CSS Flexible Layout): https://bit.ly/3c6cBer

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

👉 SASS (CSS Programming Version) – https://bit.ly/2ZWZaul

CSS সাধারণ একটা ল্যাঙ্গুয়েজ। এইটা শিখার কিছু আছে নাকি। অনেকেই অবজ্ঞা করে 😛 সেই দিন কি আর আছে? 😀 জি, CSS এ এখন প্রোগ্রামিং করা যায় 😀 । ভারিয়েবল, লুপ, অ্যারে, ফাংশন ও এখন CSS এ আছে 🙂 যার সাহায্যে আমরা CSS কোডকে অনেক স্মার্ট ও কম লিখে অনেক বেশি কাজ করতে পারি।

👉 Grid System – Coming Soon

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

👉 jQuery Plugins : https://bit.ly/2W9n3Nm

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

👉 Bootstrap – Coming Soon

এইবার আসি CSS এর মোস্ট পপুলার ফ্রেমওয়ার্ক Bootstrap নিয়ে। যদি অনেকেই এইচটিএমএল ও সিএসএস শিখার পর Bootstrap শিখার জন্য বলে। তবে আমি এর ঘোর বিরোধী! এইচটিএমএল ও সিএসএস শিখেই Bootstrap শিখাটা আত্মঘাতী সিদ্ধান্ত! Bootstrap এ সবকিছু তৈরি করা থাকে। আপনি অনেক কম কোডিং জেনেই Bootstrap ব্যাবহার করতে পারবেন ঠিক তবে সেটা হবে মুখস্ত বিদ্যা! আর মজার বিষয় হচ্ছে আপনি যদি উপরের সব সিরিজ শেষ করতে পারেন (SAAS না জানলেও হবে আপাতত) তাহলে Bootstrap আপনার কাছে দাল-ভাত মনে হবে 😀 মুলত Bootstrap বানানো হয়েছে Responsive Design, Flexbox & Grid System এর সাহায্যে

👉 Hablu | One Page Multipurpose Responsive Business Website – https://bit.ly/2ZTVkSx

এই সিরিজে আমরা একটি ওয়ান পেজ ওয়েবসাইট কিভাবে বানাতে হয়ে সেটা দেখব। যদি আমি Bootstrap এর বেসিক দেখাইনাই। তবে এই প্রোজেক্টে Bootstrap ব্যাবহার করা হয়েছে। পাশাপাশি বিভিন্ন jQuery Plugins এর ব্যাবহার দেখানো হয়েছে। মোটামুটি একটা প্রফেশনাল ওয়েবসাইট তৈরি করতে যা যা লাগে দেখানো হয়েছে 🙂

Share This:

Leave a Reply

Your email address will not be published. Required fields are marked *

© 2021 All Rights Reserved.