تنزيل next boilerplate - تنزيل رمز مصدر next boilerplate

next boilerplate

كود الذكاء الاصطناعي

1.0.0

تنزيل

وداعا بير المقبل ، مرحبا بكم في superplate!

لقد مر وقت طويل منذ أن بدأنا مشروع BoilerPlate التالي. نحن فخورون بأنه ساعد العديد من مطوري الواجهة الأمامية في جميع أنحاء العالم على تسريع دورات تطوير الواجهة الأمامية.

في الوقت المناسب ، أخذنا دروسًا قيمة من تجربتنا وتعليقات المجتمع:

هناك عدد لا حصر له من تقنيات الواجهة الأمامية ومن المستحيل الجمع بين كل شيء في منتج واحد من Boilerplate.
من الصعب الحفاظ على المشروع بأطنان من التبعيات الخارجية.

لمعالجة مشكلة التعقيد ، بدأنا مشروعًا جديدًا من الصفر. نسميها "Superplate" - Prithend Boilerplate مع قوى عظمى.

إنه مبني فوق بنية البرنامج المساعد ويسمح لك بدمج الأدوات الخاصة بك وأفضل الممارسات بسهولة. ويشمل أيضًا أكثر من 30 مكونًا إضافيًا مدمجًا للأدوات المفضلة لديك.

الإطار الافتراضي لـ Superplate هو next.js ، بحيث يمكنك البدء في استخدامه فورًا بدلاً من poolerplate التالي. المزيد من الأهداف الإطارية ستأتي قريبًا.

يمكنك الخروج من المشروع من صفحة repo أو الوثائق.

المجال التالي

الأداء الموجهة لـ Next.js Application Boilerplate مع Redux و TypeScript و Express.js و Sass.

_{أنشأها بانكود}

عن

Next.js هو إطار رد فعل أضيق الحدود يعمل على المتصفح والخادم. إنه يوفر للمطورين وسيلة سهلة للبدء ، ومع استخدام REACT.JS للالتقاط ، إنها أيضًا طريقة مباشرة للمطورين الذين لديهم خبرة في React للحصول على إنتاجية بسرعة.

تتمثل ميزة هذا النهج في أن تكون قادرًا على إنشاء تجارب مستخدم غنية بطريقة موحدة ، دون المساس بعوامل SEO (محرك البحث) SEO والتي تعد مفتاح الترتيب الجيد على Google ومحركات البحث الأخرى.

يجعل هذا Boilerplate من السهل الصعود والتشغيل باستخدام تطبيق Next.js وتنظيم TypeScript.

سمات

يوفر مشروع BoilerPlate التالي الكثير من الميزات خارج الصندوق. فيما يلي نظرة عامة على المكونات والأدوات المضمنة.

Next.js - إطار عمل الحد الأدنى لتطبيقات React التي تم تقديمها الخادم.
TypeScript - Superset من JavaScript الذي يوفر في المقام الأول الكتابة الثابتة والفئات والواجهات.
Redux - حاوية حالة يمكن التنبؤ بها لتطبيقات JavaScript.
Express.js - إطار تطبيق الويب الخاص بـ Node.js الحد الأدنى والمرونة والذي يتولى عرض جانب الخادم ويتكامل مع Next.js.
مشروع مدمج CLI- قم بإنشاء صفحات ومكونات وإجراءات ومخفضات بأمر واحد باستخدام CLI المدمج.
SASS/SCSS - CSS Preprocessor ، الذي يضيف ميزات خاصة مثل المتغيرات والقواعد المتداخلة والمزيج (يشار إليها أحيانًا باسم السكر النحوي) إلى CSS العادية.
DOCKER - أداة مصممة لتسهيل إنشاء التطبيقات ونشرها وتشغيلها باستخدام الحاويات.
بابل - المترجم للجيل القادم جافا سكريبت.
ESLINT - فائدة linting قابلة للتوصيل.
عكس الوكيل - خادم خفيف الوزن لطلبات واجهة برمجة تطبيقات وكيل.
Bundler Analyzer - تصور حجم ملفات إخراج WebPack مع treemap التفاعلية القابلة للتكبير.
Jest - JavaScript Testing Framework ، الذي أنشأه المطورون الذين أنشأوا React.
رد الفعل المكتبة - أدوات اختبار DOM بسيطة وكاملة لتشجيع ممارسات الاختبار الجيدة.
DOTENV-RUNTIME-DOTENV- فضح متغيرات البيئة لتكوين وقت التشغيل من NEXT.JS
NEXT-I18NEXT- عمل تدويل يوفر وظيفة تتطلب مفتاحًا وبعض الخيارات وإرجاع القيمة للغة الحالية. يساعدك على إضافة دعم ترجمة اللغة إلى تطبيقك.
Storybook - أداة مفتوحة المصدر لتطوير مكونات واجهة المستخدم بمعزل عن React.
Bootstrap - إطار عمل HTML و CSS و JavaScript الأكثر شعبية لتطوير مواقع الويب المستجيبة للهواتف المحمولة.

الإعداد والوثائق

يرجى الرجوع إلى دليل الإعداد لدينا لإنشاء تطبيق جديد.

لمزيد من الوثائق التفصيلية ، تحقق من https://pankod.github.io/next-boilerplate/

CLI مدمج

يتم شحن Pankod Boilerplate باستخدام أداة CLI لتبسيط إنشاء مكونات جديدة. باستخدام أداة CLI ، يمكنك بسهولة إضافة الصفحات أو مكونات الفصل أو المكونات الوظيفية إلى مشروعك ولديك جميع الإجراءات المطلوبة ، يتم إنشاء المخفضات والواردات تلقائيًا لك.

لبدء CLI ، قد تضطر إلى تثبيته مسبقًا إذا لم تقم بذلك بعد.

 ~ $ npm i -g @pankod/pankod-cli

ثم يمكنك استخدامه في مشاريعك:

 ~ $ npm run cli

بعد البدء ، ستتيح لك قائمة تفاعلية تكوين المكون المراد إنشاؤه. أولاً ، يُطلب منك نوع المكون سواء كانت صفحة أو مكون وظيفي. ثم تتم مطالبتك بالخيارات الأخرى ذات الصلة باختيارك.

في نهاية المطاف ، ستنتهي بصفحة أو مكون مع ملفات النمط واختبار الملفات في أي وقت من الأوقات.