astrowind
1.0.0
؟ موضوع Astro الأكثر تميزًا بنجمة ومتفرع في عامي 2022 و2023 . ؟
AstroWind هو قالب مجاني ومفتوح المصدر لإنشاء موقع الويب الخاص بك باستخدام Astro 5.0 + Tailwind CSS . جاهز لبدء مشروع جديد ومصمم مع مراعاة أفضل ممارسات الويب.
؟ https://astrowind.vercel.app/
نحن نبدأ رحلة مثيرة مع AstroWind 2.0 ، ونريدك أن تكون جزءًا منها! نحن نتخذ حاليًا الخطوات الأولى في تطوير هذا الإصدار الجديد ورؤيتك لا تقدر بثمن. انضم إلى المناقشة وشارك تعليقاتك وأفكارك واقتراحاتك للمساعدة في تشكيل مستقبل AstroWind . دعونا نجعل AstroWind 2.0 أفضل معًا!
شارك بتعليقاتك في مناقشتنا!
يحاول AstroWind منحك وصولاً سريعًا لإنشاء موقع ويب باستخدام Astro 5.0 + Tailwind CSS. إنه موضوع مجاني يركز على البساطة والممارسات الجيدة والأداء العالي.
يتم استخدام القليل جدًا من جافا سكريبت الفانيليا فقط لتوفير الوظائف الأساسية بحيث يقرر كل مطور إطار العمل (React، Vue، Svelte، Solid JS...) الذي سيستخدمه وكيفية التعامل مع أهدافه.
في هذا الإصدار، يدعم القالب جميع الخيارات في تكوين output ، static ، hybrid ، server ، ولكن المدونة تعمل فقط مع prerender = true . نحن نعمل على الإصدار التالي ونهدف إلى جعله متوافقًا تمامًا مع SSR.
داخل قالب AstroWind ، سترى المجلدات والملفات التالية:
/
├── public/
│ ├── _headers
│ └── robots.txt
├── src/
│ ├── assets/
│ │ ├── favicons/
│ │ ├── images/
│ │ └── styles/
│ │ └── tailwind.css
│ ├── components/
│ │ ├── blog/
│ │ ├── common/
│ │ ├── ui/
│ │ ├── widgets/
│ │ │ ├── Header.astro
│ │ │ └── ...
│ │ ├── CustomStyles.astro
│ │ ├── Favicons.astro
│ │ └── Logo.astro
│ ├── content/
│ │ ├── post/
│ │ │ ├── post-slug-1.md
│ │ │ ├── post-slug-2.mdx
│ │ │ └── ...
│ │ └-- config.ts
│ ├── layouts/
│ │ ├── Layout.astro
│ │ ├── MarkdownLayout.astro
│ │ └── PageLayout.astro
│ ├── pages/
│ │ ├── [...blog]/
│ │ │ ├── [category]/
│ │ │ ├── [tag]/
│ │ │ ├── [...page].astro
│ │ │ └── index.astro
│ │ ├── index.astro
│ │ ├── 404.astro
│ │ ├-- rss.xml.ts
│ │ └── ...
│ ├── utils/
│ ├── config.yaml
│ └── navigation.js
├── package.json
├── astro.config.ts
└── ...
يبحث Astro عن ملفات .astro أو .md في الدليل src/pages/ . يتم عرض كل صفحة كمسار بناءً على اسم الملف الخاص بها.
لا يوجد شيء مميز في src/components/ ، ولكن هذا هو المكان الذي نود أن نضع فيه أي مكونات Astro/React/Vue/Svelte/Preact.
يمكن وضع أي أصول ثابتة، مثل الصور، في الدليل public/ إذا كانت لا تتطلب أي تحويل أو في الدليل assets/ إذا تم استيرادها مباشرة.
رائد فضاء محنك؟ احذف هذا الملف
README.md. قم بتحديثsrc/config.yamlوالمحتويات. استمتع!
يتم تشغيل جميع الأوامر من جذر المشروع، من المحطة:
| يأمر | فعل |
|---|---|
npm install | تثبيت التبعيات |
npm run dev | يبدأ تشغيل خادم التطوير المحلي على localhost:4321 |
npm run build | أنشئ موقع الإنتاج الخاص بك إلى ./dist/ |
npm run preview | قم بمعاينة البناء الخاص بك محليًا، قبل النشر |
npm run check | تحقق من مشروعك بحثًا عن الأخطاء |
npm run fix | قم بتشغيل Eslint وتنسيق الأكواد باستخدام Prettier |
npm run astro ... | قم بتشغيل أوامر CLI مثل astro add و astro preview |
ملف التكوين الأساسي: ./src/config.yaml
site :
name : ' Example '
site : ' https://example.com '
base : ' / ' # Change this if you need to deploy to Github Pages, for example
trailingSlash : false # Generate permalinks with or without "/" at the end
googleSiteVerificationId : false # Or some value,
# Default SEO metadata
metadata :
title :
default : ' Example '
template : ' %s — Example '
description : ' This is the default meta description of Example website '
robots :
index : true
follow : true
openGraph :
site_name : ' Example '
images :
- url : ' ~/assets/images/default.png '
width : 1200
height : 628
type : website
twitter :
handle : ' @twitter_user '
site : ' @twitter_user '
cardType : summary_large_image
i18n :
language : en
textDirection : ltr
apps :
blog :
isEnabled : true # If the blog will be enabled
postsPerPage : 6 # Number of posts per page
post :
isEnabled : true
permalink : ' /blog/%slug% ' # Variables: %slug%, %year%, %month%, %day%, %hour%, %minute%, %second%, %category%
robots :
index : true
list :
isEnabled : true
pathname : ' blog ' # Blog main path, you can change this to "articles" (/articles)
robots :
index : true
category :
isEnabled : true
pathname : ' category ' # Category main path /category/some-category, you can change this to "group" (/group/some-category)
robots :
index : true
tag :
isEnabled : true
pathname : ' tag ' # Tag main path /tag/some-tag, you can change this to "topics" (/topics/some-category)
robots :
index : false
isRelatedPostsEnabled : true # If a widget with related posts is to be displayed below each post
relatedPostsCount : 4 # Number of related posts to display
analytics :
vendors :
googleAnalytics :
id : null # or "G-XXXXXXXXXX"
ui :
theme : ' system ' # Values: "system" | "light" | "dark" | "light:only" | "dark:only" لتخصيص مجموعات الخطوط، تشير الألوان أو المزيد من العناصر إلى الملفات التالية:
src/components/CustomStyles.astrosrc/assets/styles/tailwind.cssيمكنك إنشاء بناء إنتاج محسّن باستخدام:
npm run build الآن، موقع الويب الخاص بك جاهز للنشر. جميع الملفات التي تم إنشاؤها موجودة في مجلد dist ، حيث يمكنك نشر المجلد على أي خدمة استضافة تفضلها.
انسخ هذا المستودع على حساب GitHub الخاص بك وانشره على Netlify:
انسخ هذا المستودع على حساب GitHub الخاص بك وانشره على Vercel:
إذا كانت لديك أي أفكار أو اقتراحات أو وجدت أي أخطاء، فلا تتردد في فتح مناقشة أو مشكلة أو إنشاء طلب سحب. وسيكون ذلك مفيدًا جدًا لنا جميعًا وسنكون سعداء بالاستماع إليه واتخاذ الإجراءات اللازمة.
تم إنشاؤه في البداية بواسطة onWidget ويتم صيانته بواسطة مجتمع من المساهمين.
تم ترخيص AstroWind بموجب ترخيص MIT — راجع ملف الترخيص للحصول على التفاصيل.
