M

MLOG

বাংলা

Next.js API রাউটস ব্যবহার করে সরাসরি আপনার Next.js অ্যাপ্লিকেশনের মধ্যে সার্ভারলেস ব্যাকএন্ড তৈরি করতে শিখুন। এই গাইডটি বেসিক সেটআপ থেকে শুরু করে অথেন্টিকেশন ও ডেটা পারসিস্টেন্সের মতো অ্যাডভান্সড কৌশল কভার করে।

Next.js API রাউটস: সহজে আপনার ব্যাকএন্ড তৈরি করুন

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

Next.js API রাউটস কী?

API রাউটস হলো সার্ভারলেস ফাংশন যা আপনি আপনার Next.js প্রজেক্টের /pages/api ডিরেক্টরির মধ্যে তৈরি করেন। এই ফাংশনগুলি ইনকামিং HTTP রিকোয়েস্ট পরিচালনা করে এবং প্রতিক্রিয়া ফেরত পাঠায়, ঠিক একটি প্রথাগত ব্যাকএন্ড API-এর মতো। মূল পার্থক্য হলো এগুলি সার্ভারলেস ফাংশন হিসেবে স্থাপন করা হয়, যার মানে আপনাকে সার্ভার বা পরিকাঠামো পরিচালনা করতে হবে না।

এগুলিকে হালকা, অন-ডিমান্ড ব্যাকএন্ড ফাংশন হিসাবে ভাবুন যা আপনার Next.js ফ্রন্ট-এন্ডের সাথে নির্বিঘ্নে একত্রিত।

Next.js API রাউটস ব্যবহারের সুবিধা

Next.js API রাউটস দিয়ে শুরু করা

আসুন একটি সাধারণ API রাউট তৈরি করি যা একটি JSON প্রতিক্রিয়া ফেরত দেয়। প্রথমে, নিশ্চিত করুন যে আপনার একটি Next.js প্রজেক্ট সেট আপ করা আছে। যদি না থাকে, তাহলে এটি ব্যবহার করে একটি তৈরি করুন:

npx create-next-app my-app
cd my-app

এখন, /pages/api ডিরেক্টরির ভিতরে hello.js নামে একটি ফাইল তৈরি করুন:

// pages/api/hello.js
export default function handler(req, res) {
  res.status(200).json({ name: 'John Doe' })
}

এই কোডটি একটি সাধারণ API রাউট সংজ্ঞায়িত করে যা "John Doe" নামসহ একটি JSON অবজেক্ট দিয়ে প্রতিক্রিয়া জানায়। এই API রাউটটি অ্যাক্সেস করতে, আপনার Next.js ডেভেলপমেন্ট সার্ভার শুরু করুন:

npm run dev

তারপর, আপনার ব্রাউজার খুলুন এবং http://localhost:3000/api/hello-এ নেভিগেট করুন। আপনি নিম্নলিখিত JSON প্রতিক্রিয়া দেখতে পাবেন:

{"name": "John Doe"}

API রাউট হ্যান্ডলার বোঝা

আপনার API রাউটের handler ফাংশন দুটি আর্গুমেন্ট গ্রহণ করে:

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

বিভিন্ন HTTP মেথড পরিচালনা করা

আপনি ইনকামিং রিকোয়েস্টের HTTP মেথড নির্ধারণ করতে req.method প্রপার্টি ব্যবহার করতে পারেন এবং সেই অনুযায়ী বিভিন্ন মেথড পরিচালনা করতে পারেন। উদাহরণস্বরূপ:

// pages/api/method.js
export default function handler(req, res) {
  if (req.method === 'GET') {
    // Handle GET request
    res.status(200).json({ message: 'This is a GET request' })
  } else if (req.method === 'POST') {
    // Handle POST request
    res.status(200).json({ message: 'This is a POST request' })
  } else {
    // Handle other methods
    res.status(405).json({ message: 'Method Not Allowed' })
  }
}

এই উদাহরণে, API রাউটটি GET এবং POST উভয় রিকোয়েস্ট পরিচালনা করে। যদি রিকোয়েস্ট মেথড GET হয়, তবে এটি "This is a GET request" বার্তা সহ একটি JSON অবজেক্ট দিয়ে প্রতিক্রিয়া জানায়। যদি রিকোয়েস্ট মেথড POST হয়, তবে এটি "This is a POST request" বার্তা সহ একটি JSON অবজেক্ট দিয়ে প্রতিক্রিয়া জানায়। যদি রিকোয়েস্ট মেথড অন্য কিছু হয়, তবে এটি 405 Method Not Allowed ত্রুটি দিয়ে প্রতিক্রিয়া জানায়।

রিকোয়েস্ট বডি থেকে ডেটা পড়া

POST, PUT, এবং PATCH রিকোয়েস্টের জন্য, আপনাকে প্রায়শই রিকোয়েস্ট বডি থেকে ডেটা পড়তে হয়। Next.js JSON এবং URL-এনকোডেড রিকোয়েস্ট বডি পার্স করার জন্য বিল্ট-ইন সাপোর্ট প্রদান করে। একটি JSON রিকোয়েস্ট বডি পার্স করতে, আপনি req.body প্রপার্টি ব্যবহার করতে পারেন। উদাহরণস্বরূপ:

// pages/api/post.js
export default async function handler(req, res) {
  if (req.method === 'POST') {
    const { name, email } = req.body

    // Process the data
    console.log('Name:', name)
    console.log('Email:', email)

    res.status(200).json({ message: 'Data received successfully' })
  } else {
    res.status(405).json({ message: 'Method Not Allowed' })
  }
}

এই API রাউটটি পরীক্ষা করার জন্য, আপনি পোস্টম্যান বা curl-এর মতো একটি টুল ব্যবহার করে JSON বডি সহ একটি POST রিকোয়েস্ট পাঠাতে পারেন:

curl -X POST -H "Content-Type: application/json" -d '{"name": "Jane Doe", "email": "jane.doe@example.com"}' http://localhost:3000/api/post

প্রতিক্রিয়া হেডার সেট করা

আপনি প্রতিক্রিয়া হেডার সেট করতে res.setHeader() মেথড ব্যবহার করতে পারেন। এটি কন্টেন্ট টাইপ, ক্যাশে কন্ট্রোল এবং অন্যান্য গুরুত্বপূর্ণ তথ্য সেট করার জন্য দরকারী। উদাহরণস্বরূপ:

// pages/api/headers.js
export default function handler(req, res) {
  res.setHeader('Content-Type', 'application/json')
  res.setHeader('Cache-Control', 's-maxage=3600')
  res.status(200).json({ message: 'Hello, world!' })
}

এই উদাহরণে, API রাউটটি Content-Type হেডারটিকে application/json এ সেট করে, যা নির্দেশ করে যে প্রতিক্রিয়াটি একটি JSON অবজেক্ট। এটি Cache-Control হেডারটিকে s-maxage=3600 এ সেট করে, যা ব্রাউজার এবং CDN-কে ১ ঘন্টা পর্যন্ত প্রতিক্রিয়া ক্যাশে করতে বলে।

ত্রুটি ব্যবস্থাপনা (Error Handling)

আপনার API রাউটে ত্রুটিগুলি সুন্দরভাবে পরিচালনা করা গুরুত্বপূর্ণ। আপনি ব্যতিক্রমগুলি ধরতে এবং ক্লায়েন্টের কাছে উপযুক্ত ত্রুটির প্রতিক্রিয়া পাঠাতে ট্রাই-ক্যাচ ব্লক ব্যবহার করতে পারেন। উদাহরণস্বরূপ:

// pages/api/error.js
export default async function handler(req, res) {
  try {
    // Simulate an error
    throw new Error('Something went wrong')
  } catch (error) {
    console.error(error)
    res.status(500).json({ message: 'Internal Server Error' })
  }
}

এই উদাহরণে, API রাউটটি একটি নতুন Error অবজেক্ট থ্রো করে একটি ত্রুটি সিমুলেট করে। ক্যাচ ব্লকটি ত্রুটিটি ধরে, এটি কনসোলে লগ করে এবং ক্লায়েন্টের কাছে একটি 500 Internal Server Error প্রতিক্রিয়া পাঠায়। প্রোডাকশন পরিবেশের জন্য Sentry বা Datadog-এর মতো একটি শক্তিশালী লগিং সিস্টেম ব্যবহার করার কথা বিবেচনা করুন।

ডেটাবেসের সাথে সংযোগ স্থাপন

API রাউটের সবচেয়ে সাধারণ ব্যবহারগুলির মধ্যে একটি হল ডেটাবেসের সাথে সংযোগ স্থাপন। Next.js API রাউটস বিভিন্ন ডেটাবেসের সাথে নির্বিঘ্নে সংহত হয়, যার মধ্যে রয়েছে:

এখানে একটি Next.js API রাউটে একটি MongoDB ডেটাবেসের সাথে কীভাবে সংযোগ স্থাপন করতে হয় তার একটি উদাহরণ দেওয়া হলো:

// pages/api/mongodb.js
import { MongoClient } from 'mongodb'

const uri = process.env.MONGODB_URI
const options = {}

let client
let clientPromise

if (!process.env.MONGODB_URI) {
  throw new Error('Please add your Mongo URI to .env.local')
}

if (process.env.NODE_ENV === 'development') {
  // In development mode, use a global variable so that the value
  // is preserved across module reloads caused by HMR (Hot Module Replacement).
  if (!global._mongoClientPromise) {
    client = new MongoClient(uri, options)
    global._mongoClientPromise = client.connect()
  }
  clientPromise = global._mongoClientPromise
} else {
  // In production mode, it's best to not use a global variable.
  client = new MongoClient(uri, options)
  clientPromise = client.connect()
}

// Export a module-scoped MongoClient promise. By doing this in a
// separate module, the client can be safely reused across multiple
// functions.  See: https://github.com/vercel/next.js/blob/canary/examples/with-mongodb/lib/mongodb.js
export default async function handler(req, res) {
  try {
    const client = await clientPromise
    const db = client.db(process.env.MONGODB_DB)
    const collection = db.collection('users')

    const users = await collection.find({}).toArray()

    res.status(200).json({ users })
  } catch (e) {
    console.error(e)
    res.status(500).json({ message: 'Failed to fetch users' })
  }
}

এই কোডটি চালানোর আগে, নিশ্চিত করুন যে আপনার mongodb প্যাকেজটি ইনস্টল করা আছে:

npm install mongodb

আপনাকে MONGODB_URI এবং MONGODB_DB এনভায়রনমেন্ট ভেরিয়েবলও সেট করতে হবে। এই ভেরিয়েবলগুলি আপনার .env.local ফাইলে (অথবা প্রোডাকশনের জন্য আপনার হোস্টিং প্রদানকারীর এনভায়রনমেন্ট ভেরিয়েবল সেটিংসে) সংজ্ঞায়িত করা উচিত। MONGODB_URI আপনার MongoDB ডেটাবেসের সংযোগ স্ট্রিং ধারণ করে, এবং MONGODB_DB ডেটাবেসের নাম নির্দিষ্ট করে।

অথেন্টিকেশন এবং অথরাইজেশন

আপনার API রাউটগুলিকে সুরক্ষিত করা নিরাপত্তার জন্য অত্যন্ত গুরুত্বপূর্ণ। Next.js API রাউটগুলিকে বিভিন্ন অথেন্টিকেশন এবং অথরাইজেশন কৌশল ব্যবহার করে সুরক্ষিত করা যেতে পারে, যার মধ্যে রয়েছে:

এখানে JWT অথেন্টিকেশন ব্যবহার করে একটি API রাউট কীভাবে সুরক্ষিত করতে হয় তার একটি উদাহরণ দেওয়া হলো:

// pages/api/protected.js
import jwt from 'jsonwebtoken'

const secret = process.env.JWT_SECRET

export default function handler(req, res) {
  const token = req.headers.authorization?.split(' ')[1]

  if (!token) {
    return res.status(401).json({ message: 'Unauthorized' })
  }

  try {
    const decoded = jwt.verify(token, secret)
    // The "decoded" object contains the user information embedded in the token
    // For example: const userId = decoded.userId;

    // Continue processing the request
    res.status(200).json({ message: 'Protected resource accessed successfully' })
  } catch (error) {
    return res.status(401).json({ message: 'Invalid token' })
  }
}

এই কোডটি চালানোর আগে, নিশ্চিত করুন যে আপনার jsonwebtoken প্যাকেজটি ইনস্টল করা আছে:

npm install jsonwebtoken

আপনাকে JWT_SECRET এনভায়রনমেন্ট ভেরিয়েবলও সেট করতে হবে। এটি একটি শক্তিশালী, দৈবভাবে জেনারেট করা গোপন কী হওয়া উচিত যা JWTs সাইন এবং ভেরিফাই করতে ব্যবহৃত হয়। এটি নিরাপদে সংরক্ষণ করুন এবং আপনার ক্লায়েন্ট-সাইড কোডে কখনও প্রকাশ করবেন না।

মিডলওয়্যার

যদিও Next.js, Express.js-এর মতো করে API রাউটের জন্য প্রথাগত মিডলওয়্যার অফার করে না, আপনি আপনার API রাউট হ্যান্ডলারগুলিকে পুনঃব্যবহারযোগ্য ফাংশন দিয়ে মোড়ানোর মাধ্যমে অনুরূপ কার্যকারিতা অর্জন করতে পারেন। এটি আপনাকে নিম্নলিখিত কাজগুলি করতে দেয়:

এখানে একটি সাধারণ লগিং মিডলওয়্যার কীভাবে তৈরি করতে হয় তার একটি উদাহরণ দেওয়া হলো:

// utils/middleware.js
export function withLogging(handler) {
  return async function(req, res) {
    console.log(`[${new Date().toISOString()}] ${req.method} ${req.url}`)
    return handler(req, res)
  }
}

এই মিডলওয়্যারটি ব্যবহার করতে, কেবল আপনার API রাউট হ্যান্ডলারটিকে withLogging ফাংশন দিয়ে মোড়ান:

// pages/api/logged.js
import { withLogging } from '../../utils/middleware'

async function handler(req, res) {
  res.status(200).json({ message: 'This request was logged' })
}

export default withLogging(handler)

Next.js API রাউট তৈরির জন্য সেরা অনুশীলন

অ্যাডভান্সড কৌশল

ব্যাকগ্রাউন্ড জবস

দীর্ঘ সময় ধরে চলা কাজগুলির জন্য যা API প্রতিক্রিয়াকে ব্লক করা উচিত নয়, ব্যাকগ্রাউন্ড জব ব্যবহার করার কথা বিবেচনা করুন। আপনি আপনার ব্যাকগ্রাউন্ড জবগুলি পরিচালনা করতে এবং সেগুলিকে অ্যাসিঙ্ক্রোনাসভাবে প্রক্রিয়া করতে BullMQ বা Bree-এর মতো লাইব্রেরি ব্যবহার করতে পারেন।

ওয়েবসকেটস

রিয়েল-টাইম অ্যাপ্লিকেশনগুলির জন্য, আপনি আপনার Next.js API রাউটগুলিতে ওয়েবসকেট ব্যবহার করতে পারেন। Socket.IO এবং ws-এর মতো লাইব্রেরিগুলি ক্লায়েন্ট এবং সার্ভারের মধ্যে স্থায়ী সংযোগ স্থাপন করা সহজ করে তোলে।

গ্রাফকিউএল

ডেটা আনার জন্য যদি আপনার আরও নমনীয় এবং কার্যকর উপায়ের প্রয়োজন হয়, তাহলে গ্রাফকিউএল ব্যবহার করার কথা বিবেচনা করুন। আপনি আপনার Next.js অ্যাপ্লিকেশনে একটি গ্রাফকিউএল API এন্ডপয়েন্ট তৈরি করতে Apollo Server বা Yoga-এর মতো লাইব্রেরি ব্যবহার করতে পারেন।

উপসংহার

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

Next.js API রাউটস: সহজে আপনার ব্যাকএন্ড তৈরি করুন | MLOG