قالب خفيف الوزن وقابل للتخصيص للمدونات ومواقع المحفظة ، مصممة باستخدام Sveltekit.
تم بناؤه مع وضع بعض الأهداف في الاعتبار:
لقد حققت هذا بمساعدة Sveltekit. لا يوجد تقريبا أي جافا سكريبت ، ويعمل في الواقع مع تعطيل JS! في حين أن JS رائع ، من المهم معرفة متى لا تكون هناك حاجة إليها.
يمكنك رؤية القالب على الهواء مباشرة على الموقع التجريبي. بالإضافة إلى ذلك ، يمكنك التحقق من جميع المكونات بمعزل عن Histoire.
لتشغيله محليًا ، عليك ببساطة تشغيل:
# First, install dependencies
npm install
# Then, run it on dev mode
npm run dev
يجب أن يكون الموقع متاحًا الآن على http: // localhost: 5173/على جهازك المحلي ، وعنوان IP الخاص بجهازك المحلي على شبكتك - للاختبار على أنظمة الجوال.
لقد استخدمت Histoire ، وهو بديل قصص القصة القائمة على Vite لتتمكن من رؤية وتطوير المكونات بمعزل عن غيرها. لفتحه ، قم بتشغيل npm run story:dev
.
يستخدم هذا الموقع نقل الصور لتحسين الصور المستخدمة تلقائيًا في الموقع. هذا يعني أنه حتى إذا كنت تستخدم تنسيقات الصور غير الأمثل (مثل PNGs بدون خسارة) ، فسيتم تجاوز الصور وتحويل الصور إلى WebP و AVIF لك ، طالما أنك تستخدم مكون <Image />
بدلاً من <img />
. يتم ذلك عند الإنشاء ، لذلك لا يغير أي شيء عند تشغيل موقع الويب محليًا.
جميع المنشورات هي ملفات Markdown التي تتم معالجتها باستخدام MDSVEX للسماح باستخدام مكونات Svelte بداخلها. من أجل تسهيل إدارة المنشورات ، أوصي بشدة بتمديد المادة الأمامية مقابل رمز ، مما يمنحك واجهة مستخدم لطيفة تشبه CMS.
عند تشغيل npm run build
، سيتم تجميع موقع الويب في موقع ثابت ، مما يعني أنه يمكنك استضافته إلى حد كبير في أي مكان. بعض البدائل المجانية أوصي بها هي صفحات GitHub و Vercel و NetLify.