अपनी पहली Astro साइट शिप करें

Astro क्यों

Astro डिफ़ॉल्ट रूप से ज़ीरो JavaScript भेजता है। आपका कंटेंट सर्वर पर साधारण HTML में रेंडर होता है और इंटरैक्टिव आइलैंड सिर्फ़ वहीं हाइड्रेट होते हैं जहाँ आप चाहें। कंटेंट-भारी पर्सनल साइट — ब्लॉग, रिसर्च, गैलरी — के लिए यही सौदा चाहिए।

45 मिनट का रास्ता

1. npm create astro@latest — ब्लॉग टेम्पलेट चुनें, TypeScript strict।
2. src/content.config.ts में zod स्कीमा के साथ कंटेंट कलेक्शन परिभाषित करें।
3. अपनी पहली .mdx पोस्ट लिखें — फ़्रंटमैटर बिल्ड के समय वैलिडेट होता है।
4. getStaticPaths() + render() के साथ [slug].astro पेज जोड़ें।
5. डिप्लॉय: astro build पूरी तरह स्टैटिक dist/ बनाता है जिसे कहीं भी होस्ट कर सकते हैं।

आइलैंड: वो हिस्सा जो लोग चूक जाते हैं

<Hero client:load />        <!-- तुरंत हाइड्रेट होता है -->
<Chart client:visible />    <!-- व्यू में आने पर हाइड्रेट होता है -->
<Comments client:idle />    <!-- ब्राउज़र खाली होने पर हाइड्रेट होता है -->

फ़ोल्ड के नीचे की हर चीज़ के लिए client:visible चुनें। आपका Lighthouse स्कोर आपका धन्यवाद करेगा।

आगे क्या

[locale] डायनामिक रूट से i18n जोड़ें — वह अलग पाठ है।