مقدمة إلى Nuxt 4

لماذا Nuxt؟

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

• Server Side Rendering (SSR): لتحسين الأداء وتحسين محركات البحث
• Static Site Generation (SSG): لإنشاء مواقع ثابتة سريعة جداً
• API Routes: لبناء APIs من داخل التطبيق
• Content Module: لإدارة المحتوى بسهولة

البدء السريع

لإنشاء مشروع Nuxt جديد:

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

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

1. File-Based Routing

Nuxt يستخدم نظام routing تلقائي بناءً على هيكل الملفات:

pages/
  ├── index.vue          → /
  ├── about.vue          → /about
  └── posts/
      └── [id].vue       → /posts/:id

2. Composables

استخدام Composition API بسهولة:

<script setup>
const { data } = await useFetch('/api/data')
</script>

3. Components Auto-Import

لا تحتاج لاستيراد المكونات يدوياً، Nuxt يفعل ذلك تلقائياً.

النتيجة

Nuxt هو الخيار الأمثل لبناء تطبيقات Vue.js احترافية مع أفضل الممارسات.