Marketing site και blog σε React/Vite με άρθρα σε Markdown, prerendered σελίδες, παραγωγή responsive εικόνων, sitemap και RSS, και Cloudflare Pages Functions για τις φόρμες του.
Το πρόβλημα
Ένα marketing site με επίκεντρο το περιεχόμενο χρειάζεται έξοδο που μπορούν να διαβάσουν οι crawlers, πειθαρχημένο χειρισμό πολυμέσων και ασφαλή υποβολή φορμών, χωρίς να χάνεται η συντηρήσιμη εμπειρία ανάπτυξης σε React.
Τι φτιάχτηκε
Marketing site και blog σε React και Vite με παραγωγή περιεχομένου από Markdown, prerendered routes, responsive τοπικές παραλλαγές εικόνων, sitemap/RSS και Cloudflare Pages Functions.
Τεχνική προσέγγιση
- Μετατροπή του Markdown σε δεδομένα άρθρων
- Παραγωγή αρχείων routes, sitemap και RSS κατά το build
- Prerendering του HTML σελίδων και άρθρων
- Δημιουργία responsive τοπικών παραλλαγών εικόνων
- Επικύρωση των προστατευμένων υποβολών φορμών σε Cloudflare Pages Functions
Αποφάσεις μηχανικής
- Ενσωμάτωση των δεδομένων SEO κάθε σελίδας στο τελικό HTML, αντί να βασιζόμαστε μόνο σε client rendering.
- Παραγωγή αρχείων περιεχομένου και εικόνων από την πηγή κατά το build.
- Επικύρωση του Turnstile στον server πριν από την αποστολή email.
- Ρύθμιση headers cache και ασφάλειας στο edge.
Πώς ελέγχθηκε
- Το repository χρησιμοποιεί Vite, React, Cloudflare Pages και Pages Functions.
- Το build παράγει περιεχόμενο blog, routes, sitemap, RSS και prerendered HTML.
- Ο χειρισμός φορμών περιλαμβάνει επαλήθευση Turnstile στον server και αποστολή email μέσω Resend.
Τι δείχνει
Μηχανική web προσανατολισμένη στην παραγωγή: αρχιτεκτονική frontend, συστήματα περιεχομένου, SEO, serverless επικύρωση, ασφάλεια και ανάπτυξη.
Για την πηγή
Ανεξάρτητο έργο: το marketing site και το blog μιας άλλης επιχείρησης. Το repository του κώδικα είναι ιδιωτικό και δεν συνδέεται δημόσια.