مقدمة إلى Astro


Astro هو إطار عمل (Framework) حديث ومفتوح المصدر لبناء مواقع ويب ثابتة (Static Sites) وتطبيقات خفيفة الوزن. يتميز Astro بقدرته على توليد صفحات HTML عند وقت البناء (Build Time)، مما يُنتج مواقع سريعة الأداء وصديقة لمحركات البحث.

أهم مميزات Astro

  • توليد ثابت (Static Generation) بحيث يبني صفحات HTML مسبقاً ويقلل من تحميل الجافاسكربت في المتصفح.

  • دعم متعدد الأطر (Framework Agnostic) حتى يمكن استخدام مكونات React، أو Vue، أو Svelte، أو SolidJS داخل مشروع Astro.

  • تحسين أداء تلقائي (Automatic Optimization) بحيث يقوم بتحميل الجافاسكربت فقط عند الحاجة (Partial Hydration).

  • كتابة المحتوى بملفات Markdown أو MDX مع إمكانية تضمين مكونات تفاعلية.

  • نظام ملفات بسيط (File-based Routing) بحيث يتم إنشاء الصفحات عبر تنظيم الملفات والمجلدات بدون إعدادات معقدة.

  • دعم TypeScript و JSX/TSX يسهّل كتابة كود منظم وآمن.

هيكلية مشروع Astro

  • src/pages/ كل ملف داخل هذه المجلد يصبح صفحة في الموقع.

  • src/components/ تخزن المكونات القابلة لإعادة الاستخدام.

  • astro.config.mjs ملف إعدادات المشروع.

  • public/ يحتوي على الأصول الثابتة مثل الصور والخطوط.

متى تستخدم Astro؟

  • عند الحاجة إلى مواقع مدونات أو وثائق (Docs) سريعة.

  • بناء صفحات Landing Pages خفيفة الأداء.

  • دمج مكونات من أطر عمل مختلفة ضمن مشروع واحد.

🔗 روابط مفيدة

التصنيفات: تطوير الويب