Web Developing[Full Guide]

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

শুরু করার আগে বলি 
কিছু জিনিস বাংলায় নাই। নাই মানে নাই। হয়না। HTML ট্যাগ বাংলায় হয়না। 
মোবাইলে করতে পারবেন ফ্রন্ট এন্ড। কোড এডিটর আছে অনলাইন। codepen.io এইখানে গিয়া ফেসবুকে যেম্নে ম্যাসেজ লেখেন ওম্নে টাইপ করতে পারবেন কোড। 
কিছু ঘাটাঘাটি করার দায়িত্ব যদি আপনি না নিতে পারেন তাহলে আসলে কোডার হওয়া অসম্ভব। একেবারেই সম্ভব না। 
কোডিং এ আটকায় গেলে কি করবেন? ঘাটাঘাটি তো করাই লাগবে। 
বলবেন ভাই যাবো কই? আমি তো বিগেনার । যাইবেন https://­stackoverflow.com/ এই জায়গায়। দু চোখ ভরে দেখে নেন। কোডার হইতে চাইলে এই জায়গা আপনার বাসা মতো আপন করা লাগবে। এই ওয়েবসাইট বাংলায় নাই দুঃখিত। 

0) Setup
VSCode নামাবেন। 
https://­code.visualstudio.com­/ এই লিংকে গিয়া।
ইন্সটল করবেন ভদ্র ভাবে। এবার কাজ সহজ করতে, মাঝে মাঝে এক কোড ১০০ বার লেখা লাগে, কালার নিলেন কি কালার দেখবার চান, এইসব কাজ সহজে করার জন্য এক্টেনশন ইন্সটল করা লাগবে VS Code এ। কোড পুরা লেখাও লাগবে না। দুইটা letter লেখবেন, সাজেশন আসবে। tab চাপবেন, auto লেখা হয়ে যাবে। ভালো কোড এডীটর ইউজ করলে আরামে কোড করবেন। ভুল ও হবে না। এক্সটেনশন কি কি নিচে দিলাম। ডাইনে বামে না তাকায় ইন্সটল করেন। 
Recommended 
1. esbenp.prettier-vsco­de
2. formulahendry.auto-c­lose-tag
3. hex-ci.stylelint-plu­s
4. dbaeumer.vscode-esli­nt
5. naumovs.color-highli­ght
6. DigitalBrainstem.jav­ascript-ejs-support

Optional 
7. ritwickdey.LiveServe­r
8. erikphansen.vscode-t­oggle-column-selecti­on
9. file-icons

সেটাপ শেষ। আপনি এখন টেক্সট এডিটর এর ইন্টারফেস দেখে একটা কোডার কোডার ভাব নিতে পারেন। কিন্তু শিখা শুরু করা লাগবে ভাও। 

১)HTML 
এই জিনিস ৩ দিনে শেষ করবেন। খুব বেশী হইলে ৪ দিন। এর বেশি না। আর HTML এর টিউটোরিয়াল দেখবেন HTML 5 এর। নতুন। পুরান গুলা দেখবেন না। 
https://­freecoursesite.com/­builcd-responsive-rea­l-world-websites-wit­h-html5-and-css3-1/
এই লিংকে গিয়া কোর্সটা নামাবেন। এই লোক যা যা করে তা তা করবেন। 
শুধু HTML করবেন আপাতত। ২ ঘন্টাও লাগবে না। স্পীড বাড়ায়ে কমায়ে নিজের সুবিধা মতো দেখবেন। (এই লোক অনেক স্লো কথা বলে, স্পীড বাড়াইতে কমাইতে Pot Player এ z x আর c দিয়ে চেঞ্জ করা যায়) । 
একটা HTML এর চিটশীট দিয়ে দিচ্ছি https://­web.stanford.edu/­group/csp/cs21/­htmlcheatsheet.pdf

HTML শেষ করলে আপনি নিজেকে inspire করতে HTML ইঞ্জিনিয়ার বলতে পারেন।.২ ঘন্টায় আপনি হয়ে গেলেন HTML ইঞ্জিনিয়ার :P 

এইবার নিজের একটা CV বানাবেন শুধু HTML দিয়ে। আপনি যে HTML পারেন এইটা শো তো করা লাগবে। কোডারদের সেই শো কেসের জায়গা হইলো গিট হাব। আপনি এই গিটহাবে আপনার কাজ সবসময় আপডেট করবেন আর মানুষকে শেয়ার করবেন নিজের আইডি। মানুষ দেখে বলবে ওয়াও আপনি তো ভালো কোড করেন। এই শো অফের জন্য কিছু পরিশ্রম করা লাগবে ব্রো। গিটহাব maintain করবেন। নিজের ছোটো বড় যা ই কোড থাকুক, HTML শিখে দুই তিনটা কংকাল ওয়েবসাইট (HTML only site রে কংকাল ওয়েবসাইট বলে) আপলোড দিয়ে রাখবেন। 
কেম্নে করবেন?
https://­www.youtube.com/­watch?v=kgzTmXVv5-w এই লিংক থেকে দেখে নেন। ২ মিনিট এর ভিডিও। তবে গিট নিয়ে সামনে আরো পড়াশোনা করার আছে। 

2) CSS
উপরে যেই কোর্সের লিংক দিলাম (https://­freecoursesite.com/­builcd-responsive-rea­l-world-websites-wit­h-html5-and-css3-1/) 
এইটার CSS পার্ট শেষ করবেন। CSS নিয়ে ভালো ধারনা খুব জরুরী। 
ওইটা শেষ হলে https://­www.udemy.com/course/­css-the-complete-guid­e-incl-flexbox-grid-­sass/ - এইটা করবেন। এইটা শেষ করতে আপনার টাইম এত লাগবে না। কমন টপিক আগের কোর্সের শেখা জিনিস স্কিপ করে যাবেন। 

ভাই চিটশীট দিবেন না? কঠিন লাগতেছে? https://­web.stanford.edu/­group/csp/cs21/­csscheatsheet.pdf লন চিটশীট। 
কমপ্লিট করছেন? আপনি নিজেকে কিঞ্চিত ফ্রন্ট এন্ড ডেভোলপার বলতে পারেন। এই স্টেটে আপনি ইন্টার্নশীপ এর অফার খুঁজতে পারবেন চাইলে। 

3) Bootstrap
ভাই আপনি যেই যেই অসাম কোর্স করছেন CSS এর (ফাঁকি না দিলে এই স্টেড আপনার কাছে পানি ভাত) 
ইউটিউবে গিয়া সুন্দর মতো 
https://­www.youtube.com/­watch?v=yvm_Rng7Jmo&l­ist=PLgH5QX0i9K3oC_w­mWEZa2xWxJauIRQ9kG 
এই প্লেলিস্ট ফলো করেন। 
Done. আর কিছু নিয়ে মারামারি করা লাগবে না। 


প্রয়োজনীয় কিছু লিংকঃ 
https://devdocs.io/
https://­www.w3schools.com/
https://­developer.mozilla.org­/en-US/

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

আপনি এখনো 100% Front End Developer না, তবে আপনি বেশ দামওয়ালা একজন মানুষ এখন। 
আপনি PSD to HTML করার ক্ষমতা রাখেন। যেইটা অনেক বড় স্কিল।


নিজেকে কিছু টেকনিক শিখে আরেকটু ঝালাই করতে চাইলে 
https://­www.udemy.com/course/­psd-to-html5-beginner­-to-advanced/
এই কোর্স টা করতে বলবো। এই লোক ভালো বুঝায়। প্লাস অনেক প্রো টিপ দিবে আপনারে। দেখবেন কত সহজে বড় বড় কোড হয়ে যায়। দেখে মজা পাবেন। (অপশনাল) 

আপনি যা যা জানেন তা দিয়ে ডেমো ওয়েব সাইট স্ট্যাটিক ভাবে github হোস্ট করতে পারেন। আপনার পোর্টফোলিও ভারী হবে। 

(চলবে)