Next.js API Routes তৈরি করা গাইড ও নোট

Next.js শুধু পেজ রাউটিংই নয়, API রাউটিংও সমর্থন করে। এর মাধ্যমে আপনি সার্ভার-সাইড কোড লিখে ক্লায়েন্ট এবং সার্ভারের মধ্যে যোগাযোগ তৈরি করতে পারেন, যেমন ডেটাবেসের সাথে ইন্টারঅ্যাকশন, ফর্ম সাবমিশন প্রক্রিয়া, ইত্যাদি। Next.js এর API Routes আপনাকে সাধারণ React অ্যাপ্লিকেশনে সার্ভারলেস ফাংশনালিটি যোগ করার সুযোগ দেয়, যাতে আপনার অ্যাপ্লিকেশনটি সহজে পূর্ণাঙ্গ ফ্রন্ট-এন্ড এবং ব্যাক-এন্ড ফিচার সম্পন্ন হতে পারে।

এখানে Next.js API Routes তৈরি করার প্রক্রিয়া বিস্তারিতভাবে আলোচনা করা হয়েছে।

১. API Routes কী?

Next.js API Routes আপনাকে আপনার প্রজেক্টের pages/api/ ফোল্ডারে API রাউট তৈরি করতে দেয়। এই রাউটগুলো একটি HTTP রিকোয়েস্ট (যেমন GET, POST, PUT, DELETE) গ্রহণ করে এবং সাড়া পাঠায়। আপনি এই API রাউটগুলো ব্যবহার করে ডেটা ফেচিং, সার্ভার সাইড অপারেশন, এবং আরও অনেক কার্যক্রম করতে পারেন।

API Routes React অ্যাপ্লিকেশনের ফিচারের মতোই কাজ করে, কিন্তু এগুলো সার্ভার সাইডে চলে, অর্থাৎ আপনি একে ক্লায়েন্ট-সাইড জাভাস্ক্রিপ্ট থেকে কল করতে পারেন।

২. API Routes তৈরি করা

Next.js এ API Routes তৈরি করতে, আপনাকে প্রথমে pages/api/ ফোল্ডার তৈরি করতে হবে। এই ফোল্ডারের মধ্যে আপনি আপনার API ফাইলগুলো রাখবেন, এবং এই ফাইলগুলির নাম হবে সেই API রাউটের URL পাথ।

উদাহরণ:

Step 1: প্রথমে pages/api/ ফোল্ডারে একটি নতুন ফাইল তৈরি করুন, যেমন hello.js।

pages/api/hello.js

Step 2: ফাইলে একটি API ফাংশন তৈরি করুন। এই ফাংশনটি দুটি প্যারামিটার গ্রহণ করবে: req (request) এবং res (response)। তারপর আপনি এর মাধ্যমে HTTP রিকোয়েস্টের উত্তর পাঠাবেন।

// pages/api/hello.js

export default function handler(req, res) {
  res.status(200).json({ message: 'Hello, Next.js!' })
}

এই API রাউটটি GET রিকোয়েস্ট গ্রহণ করবে এবং একটি JSON অবজেক্ট পাঠাবে, যা { message: 'Hello, Next.js!' }।

৩. API Routes এর HTTP Methods

Next.js API Routes বিভিন্ন HTTP Methods (GET, POST, PUT, DELETE) সমর্থন করে। আপনি req.method ব্যবহার করে বিভিন্ন HTTP মেথডের জন্য আলাদা কাস্টম লজিক তৈরি করতে পারেন।

উদাহরণ:

// pages/api/user.js

export default function handler(req, res) {
  if (req.method === 'GET') {
    // GET রিকোয়েস্টের জন্য ডেটা পাঠান
    res.status(200).json({ name: 'John Doe' })
  } else if (req.method === 'POST') {
    // POST রিকোয়েস্টে নতুন ডেটা গ্রহণ করুন
    const { name } = req.body
    res.status(201).json({ message: `User ${name} created successfully!` })
  } else {
    // অন্যান্য HTTP মেথডের জন্য 405 (Method Not Allowed) রিটার্ন করুন
    res.status(405).json({ message: 'Method Not Allowed' })
  }
}

এখানে, GET রিকোয়েস্টে আমরা একটি প্রিলোড করা নাম পাঠাচ্ছি এবং POST রিকোয়েস্টে আমরা একটি নাম প্যারামিটার গ্রহণ করে সেটিকে JSON আউটপুট হিসেবে রিটার্ন করছি।

৪. API Routes ব্যবহার করা

আপনি যখন API Routes তৈরি করবেন, তখন সেগুলো URL এর মাধ্যমে অ্যাক্সেস করা যাবে। উদাহরণস্বরূপ, যদি আপনার API ফাইলের নাম hello.js হয়, তাহলে এটি http://localhost:3000/api/hello URL এ পাওয়া যাবে।

উদাহরণ:

• GET রিকোয়েস্ট: আপনি ব্রাউজার বা একটি HTTP ক্লায়েন্ট (যেমন Postman) ব্যবহার করে http://localhost:3000/api/hello এ GET রিকোয়েস্ট পাঠাতে পারেন।

  ব্রাউজারে গিয়ে আপনি নিম্নলিখিত JSON রেসপন্স দেখতে পাবেন:

  { "message": "Hello, Next.js!" }
  

• POST রিকোয়েস্ট: একটি POST রিকোয়েস্ট পাঠানোর জন্য আপনি Postman বা কোনো HTTP ক্লায়েন্ট ব্যবহার করতে পারেন। পোস্ট রিকোয়েস্টে একটি নাম প্যারামিটার পাঠাতে পারেন:

  { "name": "John" }
  

  সেক্ষেত্রে, আপনি নিম্নলিখিত রেসপন্স পাবেন:

  { "message": "User John created successfully!" }
  

৫. কাস্টম API Route (API Authentication)

আপনি যদি কাস্টম API Route তৈরি করতে চান যেখানে ইউজার অথেনটিকেশন বা অন্যান্য কাস্টম লজিক থাকতে পারে, তবে আপনি সেইসব চেক এবং লজিক req অবজেক্টের মাধ্যমে করতে পারবেন।

উদাহরণ (Basic Authentication):

// pages/api/login.js

export default function handler(req, res) {
  if (req.method === 'POST') {
    const { username, password } = req.body;

    if (username === 'admin' && password === 'password123') {
      res.status(200).json({ message: 'Login successful' });
    } else {
      res.status(401).json({ message: 'Invalid credentials' });
    }
  } else {
    res.status(405).json({ message: 'Method Not Allowed' });
  }
}

এখানে, username এবং password এর সাথে মেলালে 200 OK রেসপন্স দেয়া হবে এবং ভুল হলে 401 Unauthorized রেসপন্স দেয়া হবে।

৬. API Routes এর সুবিধা

• এটা সম্পূর্ণ সার্ভারলেস ফাংশনালিটি: Next.js এর API Routes সার্ভার সাইডের কাজগুলো ক্লায়েন্টের কাছে অদৃশ্য রেখে পরিচালনা করতে সাহায্য করে। এটি সহজে ডিপ্লয় করা যায়, বিশেষত Vercel বা অন্য সার্ভারলেস প্ল্যাটফর্মে।
• ডেটা ফেচিং: API Routes ব্যবহার করে আপনি সার্ভার থেকে ডেটা ফেচ করতে পারেন এবং সেই ডেটা ক্লায়েন্টে পাঠাতে পারেন।
• স্কেলেবিলিটি: আপনি সহজেই ছোট থেকে বড় অ্যাপ্লিকেশনেও এই API Routes ব্যবহার করতে পারেন এবং এটি অ্যাপ্লিকেশনটির স্কেলেবিলিটি উন্নত করে।

Next.js API Routes আপনাকে আপনার React অ্যাপ্লিকেশনের মধ্যে ব্যাক-এন্ড কার্যক্রম সম্পন্ন করতে একটি শক্তিশালী উপায় প্রদান করে, যা অ্যাপ্লিকেশনটির ডেভেলপমেন্ট প্রক্রিয়াকে অনেক সহজ করে তোলে।