العودة للمقالات

إتقان الدوال اللامركزية باستخدام Next.js و Vercel

Majd Muhtaseb28‏/04‏/20257 دقيقة

مقدمة

تعتبر الدوال اللامركزية طريقة قوية لإضافة وظائف خلفية إلى تطبيقات Next.js الخاصة بك دون الحاجة إلى إدارة الخوادم. يرشدك هذا الدليل خلال إنشاء ونشر هذه الدوال باستخدام مسارات API في Next.js و Vercel.

ما هي الدوال اللامركزية؟

الدوال اللامركزية هي دوال ذات غرض واحد تعتمد على الأحداث ويتم تنفيذها عند الطلب. تتولى Vercel البنية التحتية والتحجيم والإدارة، مما يتيح لك التركيز على التعليمات البرمجية الخاصة بك.

إنشاء مسار API في Next.js

يجعل Next.js إنشاء دوال لامركزية أمرًا سهلاً للغاية من خلال مسارات API. توجد هذه المسارات في الدليل pages/api.

لنقم بإنشاء مسار API بسيط يعيد استجابة JSON.

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

يحدد هذا الرمز دالة تتعامل مع الطلبات الواردة إلى نقطة النهاية /api/hello. يضبط رمز الحالة على 200 (موافق) ويعيد كائن JSON.

التعامل مع طرق HTTP المختلفة

يمكنك التعامل مع طرق HTTP المختلفة (GET, POST, PUT, DELETE, إلخ) داخل مسار API الخاص بك.

// pages/api/greet.js
export default function handler(req, res) {
  if (req.method === 'POST') {
    const { name } = req.body;
    res.status(200).json({ message: `Hello, ${name}!` });
  } else {
    res.status(405).json({ message: 'Method Not Allowed' });
  }
}

يتعامل هذا المثال فقط مع طلبات POST. إذا تم استخدام أي طريقة أخرى، فإنه يعيد خطأ 405 (الطريقة غير مسموح بها). تذكر تحليل نص الطلب (على سبيل المثال، باستخدام JSON.parse(req.body)) إذا كانت بيانات JSON.

النشر باستخدام Vercel

إن نشر تطبيق Next.js الخاص بك مع دوال لامركزية إلى Vercel أمر واضح:

1. إنشاء حساب Vercel (إذا لم يكن لديك حساب).
2. تثبيت Vercel CLI: npm install -g vercel
3. نشر مشروعك: انتقل إلى دليل مشروعك في الوحدة الطرفية وقم بتشغيل vercel.

تكتشف Vercel تلقائيًا مشروع Next.js الخاص بك وتنشر مسارات API الخاصة بك كدوال لامركزية. ستتلقى عنوان URL حيث يمكن الوصول إلى تطبيقك ومسارات API.

مثال: الاتصال بقاعدة بيانات

فيما يلي مثال أساسي للاتصال بقاعدة بيانات (على سبيل المثال، MongoDB) داخل دالتك اللامركزية. (تذكر تثبيت برنامج تشغيل قاعدة البيانات الضروري، مثل mongodb.)

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

const uri = process.env.MONGODB_URI; // قم بتخزين هذا في متغيرات بيئة Vercel

export default async function handler(req, res) {
  const client = new MongoClient(uri);

  try {
    await client.connect();
    const database = client.db("mydatabase");
    const users = database.collection("users");

    const allUsers = await users.find({}).toArray();

    res.status(200).json(allUsers);
  } catch (e) {
    console.error(e);
    res.status(500).json({ error: 'فشل في جلب المستخدمين' });
  } finally {
    await client.close();
  }
}

هام: لا تقم أبدًا بتضمين بيانات اعتماد قاعدة البيانات في التعليمات البرمجية الخاصة بك. استخدم متغيرات البيئة وقم بتخزينها بشكل آمن في إعدادات مشروع Vercel.

خاتمة

توفر مسارات API في Next.js و Vercel طريقة بسيطة وفعالة لبناء ونشر الدوال اللامركزية. من خلال إتقان هذه الأدوات، يمكنك إضافة وظائف ديناميكية إلى تطبيقات Next.js الخاصة بك دون الحاجة إلى إدارة الخوادم. تذكر معالجة الأخطاء بأمان وتأمين مسارات API الخاصة بك بشكل مناسب.