ابدأ من هنا
تطبيقات React والأطر البرمجية
حوّل مشاريع React وNext.js وAstro وVue
1✅ الأطر المدعومة#
يمكنك تحويل التطبيقات المبنية بهذه الأطر الشائعة:
- React (Vite) - الأكثر شيوعًا والموصى به
- Next.js - مبني على React، الصفحات وموجّه التطبيق
- Astro - مواقع ثابتة سريعة مع مكونات React
- Vue.js (Vite) - تطبيقات Vue أحادية الصفحة
كل هذه تعمل تلقائيًا، فقط ارفع ملف ZIP لمشروعك!
2📦 طريقتان للرفع#
الخيار أ - ارفع الكود المصدري (الأسهل):
اضغط مجلد مشروعك كما هو في ZIP وارفعه. ستنشئه سحابتنا لك تلقائيًا.
الخيار ب - ارفع ملفات مبنية مسبقًا:
شغّل 'npm run build' على جهازك أولًا، ثم اضغط مجلد المخرجات (dist/ أو build/ أو out/) وارفعه.
💡 الخيار أ هو الموصى به لمعظم المستخدمين، فلا حاجة إلى سطر أوامر أو برمجة!
3📁 كيف تجهّز ملف ZIP#
- افتح مجلد مشروعك على جهازك
- حدد كل الملفات بداخله (بما فيها package.json وsrc/ وpublic/ وغيرها)
- انقر بزر الفأرة الأيمن ← 'ضغط' أو 'إرسال إلى ZIP'
⚠️ تأكد أن package.json في جذر ملف ZIP وليس داخل مجلد فرعي.
يمكنك أيضًا تنزيل مشروعك من GitHub كملف ZIP مباشرة.
4🚀 أنشئ APK الخاص بك#
- اختر وضع 'Offline ZIP' في الخطوة 1
- اختر ملف ZIP لمشروعك
- سيكتشف التطبيق إطار العمل لديك تلقائيًا
- املأ اسم التطبيق والأيقونة وشاشة البداية وغيرها.
- اضغط 'إنشاء APK'، وانتهى الأمر!
📶 الاتصال بالإنترنت مطلوب أثناء الإنشاء لمشاريع الكود المصدري.
5🎯 نصائح لأفضل النتائج#
- اجعل تطبيقك تطبيق صفحة واحدة (SPA)، فهذا يعمل بأفضل شكل
- إذا كان تطبيقك يستخدم خادمًا خلفيًا/API، فأبقِ الخادم الخلفي مستضافًا على الإنترنت
- تُضمَّن الصور والموارد الموجودة في مجلد 'public/' تلقائيًا
- اختبر تطبيقك في المتصفح أولًا للتأكد من أنه يعمل
6❌ ما لن يعمل#
- ميزات جهة الخادم (استعلامات قواعد البيانات وواجهات API الخادمية المضمنة في التطبيق)
- التطبيقات التي تحتاج إلى Node.js أو خادم لتعمل
- مواقع WordPress أو Shopify أو المبنية على أنظمة إدارة المحتوى
- مشاريع Svelte وAngular (قريبًا!)
إذا كان تطبيقك يعمل في المتصفح بدون خادم، فسيعمل كـ APK!
7📥 نزّل مشاريع نموذجية#
جرّب هذه المشاريع النموذجية الجاهزة لاختبار الميزة. نزّل أي ملف ZIP أدناه، ثم استخدمه في الخطوة 1 بوضع 'Offline ZIP' لإنشاء APK فورًا!
8📥 نموذج Next.js#
تطبيق Next.js متعدد الصفحات مع التوجيه، ممتاز لاختبار التنقل بين الصفحات في APK الذي تنشئه.
9📥 نموذج Astro#
موقع ثابت سريع مبني بـ Astro ومكونات React، مثالي للتطبيقات الغنية بالمحتوى.
10📥 نموذج HTML واحد#
اختبار بدون إنترنت بسيط بملف واحد (index.html فقط). ممتاز للفحص السريع عند معالجة الشاشات الفارغة.
11📥 نموذج HTML + CSS#
اختبار بسيط بدون إنترنت بملفين (index.html + style.css) للتحقق من تحميل CSS خارجي في التطبيقات المُنشأة.