Chapters of Frontend Dev থেকে Full-Stack Backend

Week 3 - Interview-এ সবচেয়ে বেশি জিজ্ঞেস করা TopicsChapter 19 of 282 min read

Englishবাংলা

Real-time - Socket.io দিয়ে notification আর chat-এর basic

HTTP কেন যথেষ্ট নয়, WebSocket সংযোগ, room, event আর disconnect handling

Order-এর status বদলাল - 'রান্না হচ্ছে' থেকে 'রওনা দিয়েছে'। Customer-এর screen-এ সেটা তখনই দেখাতে হবে, page refresh করা ছাড়া। সাধারণ HTTP দিয়ে এটা হয় না - HTTP-তে client না চাইলে server কিছু পাঠাতে পারে না। বিকল্প হিসেবে প্রতি ৫ সেকেন্ডে জিজ্ঞেস করা (polling) যায়, কিন্তু সেটা অপচয় - বেশিরভাগ সময়ই উত্তর হবে 'কিছু বদলায়নি'।

WebSocket - খোলা টেলিফোন লাইন

WebSocket হলো একবার সংযোগ খুলে সেটা খোলাই রাখা - তারপর দুই পক্ষই যেকোনো সময় কথা বলতে পারে। Socket.io এই সংযোগের উপর দাঁড়িয়ে কাজ সহজ করে দেয়: event নাম দিয়ে বার্তা পাঠানো, কার সংযোগ কাটল সেটা সামলানো, আর পুরনো browser-এ বিকল্প পথে চলা।

import { Server } from "socket.io";

const io = new Server(httpServer, { cors: { origin: "https://your-frontend.com" } });

io.on("connection", (socket) => {
  // user নিজের নামের room-এ ঢুকল - শুধু তার কাছেই তার খবর যাবে
  socket.on("join", (userId) => socket.join("user:" + userId));

  socket.on("disconnect", () => {
    console.log("একটা সংযোগ কাটল:", socket.id);
  });
});

// order status বদলালে শুধু ওই customer-কে জানানো
io.to("user:" + order.userId).emit("order-status", {
  orderId: order.id,
  status: "on-the-way",
});

Room - সবাইকে সব শোনাতে হয় না

Room হলো দল ভাগ করা। প্রতিটা user নিজের room-এ থাকে, chat-এর প্রতিটা group-এর আলাদা room। বার্তা পাঠানোর সময় শুধু সংশ্লিষ্ট room-এ পাঠালেই হয় - বাকি হাজার user-এর কাছে অপ্রয়োজনীয় বার্তা যায় না। Chat বানাতে গেলে এই ধারণাটাই মেরুদণ্ড: message আসবে একটা event-এ, যাবে শুধু ওই room-এর সদস্যদের কাছে, আর সাথে database-এও সেভ হবে যাতে পরে history দেখা যায়।

একটা সীমা মনে রাখুন: একটা server-এ হাজার সংযোগ চললেও, server একাধিক হলে কে কোন server-এ connected সেটা মিলিয়ে রাখতে হয় - তখন Redis adapter লাগে (সপ্তাহ ৪-এর chat capstone-এ এটা আবার আসবে)। আর সংযোগ খোলা মানেই বিশ্বাস নয় - কে connect করছে সেটা token দিয়ে যাচাই করতে হয়, ঠিক HTTP auth-এর মতো।

সবাই যে ভুলটা করে

Real-time দরকার নেই এমন জায়গায়ও WebSocket বসানো - যেখানে সাধারণ API call-ই যথেষ্ট। উল্টো ভুলটাও দেখা যায়: প্রতি সেকেন্ডে polling করে server-এর ঘাড়ে চাপ দেওয়া। আরেকটা ভুল - socket সংযোগে auth যাচাই না করা, ফলে যে কেউ অন্যের room-এ ঢুকে বার্তা শুনতে পারে।

আজকের Practice

আপনার API-তে Socket.io বসান। Order-এর status বদলালে সংশ্লিষ্ট user-এর room-এ event পাঠান। দুটো আলাদা browser tab-এ দুই user হিসেবে connect করে যাচাই করুন - একজনের খবর আরেকজন পাচ্ছে না তো?

Interview-এ কীভাবে বলবেন

যেখানে server-এর পক্ষ থেকে সঙ্গে সঙ্গে খবর পাঠাতে হয় - notification, chat, live status - সেখানে WebSocket ব্যবহার করি Socket.io দিয়ে। Room দিয়ে বার্তা শুধু সংশ্লিষ্ট user-দের কাছেই পাঠাই, সংযোগের সময় token দিয়ে auth যাচাই করি, আর একাধিক server হলে Redis adapter দিয়ে সংযোগগুলো মিলিয়ে রাখি।

All chapters of Frontend Dev থেকে Full-Stack Backend