إنشاء تطبيق Next.js
تتيح لك واجهة سطر الأوامر create-next-app
إنشاء تطبيق Next.js جديد باستخدام القالب الافتراضي أو مثال من مستودع GitHub العام. إنها أسهل طريقة للبدء مع Next.js.
الاستخدام الأساسي:
npx create-next-app@latest [project-name] [options]
المرجع
الخيارات المتاحة هي:
الخيارات | الوصف |
---|---|
-h أو --help | عرض جميع الخيارات المتاحة |
-v أو --version | إخراج رقم الإصدار |
--no-* | إلغاء الخيارات الافتراضية. مثلاً --no-eslint |
--ts أو --typescript | تهيئة المشروع كـ TypeScript (افتراضي) |
--js أو --javascript | تهيئة المشروع كـ JavaScript |
--tailwind | تهيئة مع إعدادات Tailwind CSS (افتراضي) |
--eslint | تهيئة مع إعدادات ESLint |
--app | تهيئة المشروع كموجه تطبيق |
--api | تهيئة المشروع بمعالجات المسارات فقط |
--src-dir | تهيئة داخل مجلد src/ |
--turbopack | تمكين Turbopack افتراضيًا للتطوير |
--import-alias <alias-to-configure> | تحديد اسم مستعار للاستيراد (افتراضي "@/*") |
--empty | تهيئة مشروع فارغ |
--use-npm | إخبار واجهة سطر الأوامر صراحةً باستخدام npm |
--use-pnpm | إخبار واجهة سطر الأوامر صراحةً باستخدام pnpm |
--use-yarn | إخبار واجهة سطر الأوامر صراحةً باستخدام Yarn |
--use-bun | إخبار واجهة سطر الأوامر صراحةً باستخدام Bun |
-e أو --example [name] [github-url] | مثال لبدء التطبيق به |
--example-path <path-to-example> | تحديد مسار المثال بشكل منفصل |
--reset-preferences | إخبار واجهة سطر الأوامر صراحةً بإعادة تعيين التفضيلات المخزنة |
--skip-install | إخبار واجهة سطر الأوامر صراحةً بتخطي تثبيت الحزم |
--yes | استخدام التفضيلات السابقة أو الإعدادات الافتراضية لجميع الخيارات |
أمثلة
باستخدام القالب الافتراضي
لإنشاء تطبيق جديد باستخدام القالب الافتراضي، قم بتنفيذ الأمر التالي في طرفيتك:
npx create-next-app@latest
ثم سيتم سؤالك الأسئلة التالية:
ما اسم مشروعك؟ my-app
هل ترغب في استخدام TypeScript؟ لا / نعم
هل ترغب في استخدام ESLint؟ لا / نعم
هل ترغب في استخدام Tailwind CSS؟ لا / نعم
هل ترغب في وضع الكود داخل مجلد `src/`؟ لا / نعم
هل ترغب في استخدام موجه التطبيق؟ (موصى به) لا / نعم
هل ترغب في استخدام Turbopack لـ `next dev`؟ لا / نعم
هل ترغب في تخصيص الاسم المستعار للاستيراد (`@/*` افتراضيًا)؟ لا / نعم
بعد الإجابة على الأسئلة، سيتم إنشاء مشروع جديد مع التكوين الذي اخترته.
باستخدام مثال رسمي من Next.js
لإنشاء تطبيق جديد باستخدام مثال رسمي من Next.js، استخدم علم --example
. مثلاً:
npx create-next-app@latest --example [example-name] [your-project-name]
يمكنك عرض قائمة بجميع الأمثلة المتاحة مع تعليمات الإعداد في مستودع Next.js.
باستخدام أي مثال عام من GitHub
لإنشاء تطبيق جديد باستخدام أي مثال عام من GitHub، استخدم خيار --example
مع رابط مستودع GitHub. مثلاً:
npx create-next-app@latest --example "https://github.com/.../" [your-project-name]