منحة Nuxt 4

تعلم أساسيات Nuxt 4 وقم ببناء تطبيق ويب متكامل باستخدام هذا الدليل الشامل.
فريق RedEast
مميز
nuxtvueدرس

مقدمة إلى Nuxt 4

Nuxt 4 هو أحدث إصدار من إطار العمل الشهير Vue.js لبناء تطبيقات ويب متكاملة. يوفر أساساً قوياً لإنشاء تجارب ويب حديثة مع التصيير من جانب الخادم والإنشاء الثابت والمزيد.

ما هو Nuxt؟

Nuxt هو إطار عمل بديهي مبني على Vue.js يجعل تطوير الويب ممتعاً وقوياً. يوفر:

  • التوجيه المستند إلى الملفات: إنشاء المسارات تلقائياً من هيكل الملفات
  • الاستيراد التلقائي: يتم استيراد المكونات والمركبات تلقائياً
  • مسارات API: بناء نقاط نهاية الخلفية ضمن نفس المشروع
  • إحضار البيانات الموحد: استخدام useFetch و useAsyncData لإدارة البيانات

البدء

لإنشاء مشروع Nuxt جديد، قم بتشغيل:

npx nuxi@latest init my-app
cd my-app
npm install
npm run dev

سيكون تطبيقك متاحاً على http://localhost:3000.

الميزات الرئيسية

1. التوجيه المستند إلى الملفات

أنشئ ملفات في دليل pages/ و Nuxt ينشئ المسارات تلقائياً:

pages/
  index.vue          → /
  about.vue          → /about
  blog/
    [slug].vue       → /blog/:slug

2. مسارات الخادم

حدد نقاط نهاية API في server/api/:

// server/api/hello.ts
export default defineEventHandler((event) => {
    return { message: 'مرحبا من Nuxt!' }
})

الخطوات التالية

اقرأ الوثائق الرسمية لـ Nuxt لمزيد من المعلومات.

كود سعيد!