ফ্রন্ট এন্ড ডেভেলপার কমপ্লিট গাইডলাইন

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

পুরো লেখাটি পড়লে আপনি একটা ধারণা পেয়ে যাবেন এবং আশা করছি নিজের একটা রোডম্যাপ তৈরী করতে পারবেন ।

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

ধাপ - ১: HTML

আপনাকে সর্ব প্রথম HTML সম্পর্কে জানতে হবে । এইচটিএমএল সাধারণত একটি ওয়েবসাইটের স্ট্রাকচার তৈরি করতে সাহায্য করে, বলতে পরনে এটি ওয়েবসাইটের কঙ্কাল । html এর ট্যাগ গুলো জেনে নিতে হবে । তারপর একদম বেসিক টাইপ কিছু প্রজেক্ট করে নিতে হবে । প্রজেক্ট করার মাধ্যমে আপনার ওই ট্যাগ গুলো এর অনেকটা ইউস জেনে নিতে পারবেন ।

ধাপ - ২: CSS:

আমাদের html দিয়ে বানানো কঙ্কালে আপনি এখন একজন রং মিস্ত্রীর কাজ করবেন । সহজ ভাবে বলতে গেলে সিএসএস দিয়ে আমরা ওয়েবপেজ এর স্টাইল করতে পারি । সিএসএস খুব কঠিন কিছু না তবে মজার । খুব সহজেই এটি শেখা যাবে তবে আপনাকে অনেক প্রাকটিস করতে হবে । সিএসএস এ অনেক প্রোপার্টি রয়েছে তাই আপনাকে জানতে হবে কোন প্রোপার্টি এর কোন কাজ । আপনি একদিনে সব প্রপার্টি সম্পর্কে জানতে পারবেন না আর শুরুতেই যে সব প্রপার্টি সম্পর্কে একদম মাস্টার হতে হবে এমনও নয় । তবে মোটামুটি ডিজাইনকরা শিখতে হবে CSS দিয়ে । আস্তে আস্তে আপনার ডিজাইন এ ইমপ্রুভমেন্ট আনতে হবে । ইতিমধ্যে আপনি যদি html এবং css মোটামুটি শিখে নেন তবে আমি বলবো আপনি মিনিমাম ৫ টি প্রজেক্ট করেন ।

ধাপ - ৩: CSS ফ্রেমওয়ার্ক

HTML এবং CSS যদি মোটামুটি শিখে নেন তাহলে এখন আপনার কাজ হবে যেকোনো একটা CSS ফ্রেমওয়ার্ক সম্পর্কে জানা এবং এটি ব্যবহার করতে পারা।

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

                                                                                   

ধাপ - ৪: গিট এবং গিটহাব

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

ধাপ - ৫: প্রোগ্রামিং লেঙ্গুয়েজ - জাভাস্ক্রিপ্ট

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

১. যেমন- variable, Data type, condition, Array, Loop, function, object সম্পর্কে জানতে হবে ।

২. মোটামটি কিছু problem solving করতে হবে । একদম প্রব্লেম সলভিং এ বস হতে হবে না। তবে প্রব্লেম সলভিং প্রতিদিন আপনার প্রাকটিস এ রাখলে ভালো হবে ।

৩. জাভাস্ক্রিপ্ট এর- String, Prime number, Iteration, Recursion জেনে নিবেন ।

৪. আপনাকে DOM সম্পর্কে জানতে হবে । কিভাবে ওয়েবসাইট এর সাথে ডোম ব্যবহার করা যায়, ইভেন্ট হ্যান্ডেল করা যায়, কোথাও ক্লিক করলে কি কাজ করবে সেই সব । মনে করতে পারেন ওয়েবসাইটে যেমন একটা প্রাণ চলে আসলো। এবং পুরো ব্যাপারটা অনেক ইন্টারেস্টিং লাগবে |

*Dom শিখে নিলে ৫-৬ টা প্রজেক্ট করে নিবেন । মনে রাখবেন Practice makes a man perfect.

৫. আপনাকে এখন API নিয়ে কাজ শিখতে হবে । API নিয়ে কাজ করতে পারলে আরো কিছু API রিলেটেড প্রজেক্ট করে নিবেন ।

৬. ES6 সম্পর্কে আপনাকে জানতে হবে । এবং এটি আপনাকে শিখতে হবে ।

৭. ব্রাউজার API সম্পর্কে জানতে হবে ।

৮. এখন একটু ইন্টারমিডিয়েটে এবং অ্যাডভান্স বিষয় গুলো আস্তে আস্তে জানার চেষ্টা করবেন । যেমন, event loop, closure, OOP, Data Structure, etc.

**জাভাস্ক্রিপ্ট এর বেসিক জিনিসগুলো কখন কোনটা ইউজ করতে হয় সেটা জানার চেষ্টা করবেন। এবং ঝটপট কিছু প্রজেক্ট করে নিবেন ।

জেনে নিন কোন প্রোগামিং ভাষা কোন কাজে লাগে

ধাপ - ৬: ডিবাগিং, ডেভ টুল এবং ব্রাউজার

আপনি একজন ফ্রন্টএন্ড ডেভেলপার হতে চাইলে আপনাকে এটি জানতে হবে। console ট্যাব, source ট্যাব, application ট্যাব, Network ট্যাব, Elements ট্যাব নিয়ে আইডিয়া রাখতে হবে। সেই সাথে ডিবাগ করা জানতে হবে ।

ধাপ - ৭: JavaScript এর ফ্রেমওয়ার্ক

আপনি JavaScript এর একটা framework বা library শিখবেন। বর্তমানে অনেক library বা framework যেমন -jQuery, React, Angular, Vue রয়েছে। তবে এক্ষেএে আমার রিকোমেন্ডে হচ্ছে React দিয়ে শুরু করো। React এর সকল ফান্ডামেন্টাল বিষয় সম্পর্কে শিখবেন। সেই সাথে রাউটার কিভাবে কাজ করে এটি শিখতে হবে । তাঁরপর গরম গরম কিছু প্রজেক্ট করে নিবেন ।

ধাপ - ৭: স্টেট ম্যানেজমেন্ট

রিএক্ট শিখার পাশাপাশি আরেকটু state manage শিখে নিবেন Context api বা use reducer টাইপের জিনিসগুলা কিভাবে কাজ করে সেগুলা একটু প্রাকটিস করে নিবেন । যদি আপনি রিএক্ট এর সব বিষয় মোটামুটি শেষ করে নেন । এবং রিএক্ট এর ফান্ডামেনাল বিষয় দিয়ে state manage করতে পারেন তাহলে এখন আপনি Redux শিখতে পারেন । তবে আমি এই মুহূর্তে এটি রেকমেন্ড করছি না । যদি শিখতে পারেন অবশ্যই ভালো ।

ধাপ - ৮: প্রজেক্ট

এখন হচ্ছে আপনি কিছু প্রজেক্ট করবেন আপনার প্রব্লেম খুঁজে বের করবেন । শুরুতে প্রজেক্ট করার জন্যে আইডিয়া ইউটুব থেকে নিতে পারেন । পরবর্তীতে নিজে নিজে প্রজেক্ট করার চেষ্টা করবেন ।

ধাপ - ৯: একটু এক্স এর সাথে আড্ডা

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

ধাপ - ১০: জব/ফ্রীল্যানসিং

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

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

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

(সংগৃহীত)