Γεια σου, Astro! 🚀
Αυτή η σελίδα είναι 100% static HTML.
Κανένα JavaScript δεν στάλθηκε στον browser σου.
Zero JS by default
Κάθε σελίδα είναι καθαρό HTML. JavaScript φορτώνει μόνο στα islands.
Islands Architecture
Τα interactive components φορτώνουν ανεξάρτητα, χωρίς να επηρεάζουν το υπόλοιπο.
Framework Agnostic
Χρησιμοποίησε React, Vue, Svelte, ή Solid — ακόμα και μαζί στο ίδιο project.
Lighthouse 95+
Static HTML + zero JS = τέλεια Core Web Vitals και SEO out of the box.
Πώς δουλεύει;
1
Γράφεις .astro components
Μοιάζουν με HTML + JSX. Ο κώδικας στο frontmatter τρέχει μόνο στο build.
2
Build → Static HTML
Κάθε σελίδα γίνεται ένα πλήρες HTML αρχείο. Ο Google βλέπει τα πάντα.
3
Islands για interactivity
React/Vue/Svelte components φορτώνουν JS μόνο όπου χρειάζεται.
Δομή αρχείων
src/
├── layouts/
│ └── BaseLayout.astro ← HTML shell
├── pages/
│ ├── index.astro ← Αυτή η σελίδα!
│ ├── about.astro ← /about route
│ └── contact.astro ← /contact route
├── components/
│ ├── Header.astro ← Static (0 JS)
│ ├── Footer.astro ← Static (0 JS)
│ └── Counter.tsx ← React island (JS μόνο εδώ)
public/
└── images/ ← Static assets