Marketing Agency / Wideview Internal
Social24 (Wideview)
WordPress σε headless Next.js με 97 redirects + zero SEO loss
26.000 γραμμές κώδικα boilerplate κάτω, Lighthouse 95-99 πάνω
Challenge
Τι έπρεπε να λυθεί
Παλαιό WP site σε page-builder theme έτρεχε σε shared hosting, με Lighthouse mobile 50-65, αργό admin για συντακτικό content, και third-party plugins που έβγαιναν χρονίως είτε σε σύγκρουση είτε σε security vulnerability. Παράλληλα, η Wideview ήθελε ενιαίο tech stack ανάμεσα στα δικά της projects (dosmart, mysupport, social24) ώστε ο ίδιος developer να μπορεί να επεμβαίνει σε όλα.
Solution
Τι χτίσαμε
Migration σε Next.js 16 + React 19 + TypeScript με WP κρατημένο μόνο ως source-of-truth για το newsletter system (wp.social24.gr, isolated). Ξεκινήσαμε από Next.js + Supabase SaaS boilerplate, αλλά αφαιρέσαμε 26.000 γραμμές κώδικα + 532 packages που δε χρειάζονταν (Supabase runtime, turbo, ξένα ui packages). Content μεταφέρθηκε σε Markdoc files στο repo, και τα 97 redirects έπιασαν όλο το παλιό SEO equity.
Custom Modules
Τι το κάνει διαφορετικό
97 redirects με 1:1 SEO mapping
Κάθε παλιό URL (homepage, blog, services) χάρτηκε σε νέο. 85 exact redirects + 12 wildcards. Σε 4 εβδομάδες μετά το launch, GSC δεν έδειξε καμία απώλεια organic traffic.
Lighthouse mobile 95-99 / 100 / 100 / 100
Performance, A11y, Best Practices, SEO όλα στα κορυφαία επίπεδα. FCP 1.4s, LCP 2.1s, TBT 40ms. Static generation όλων των marketing pages, deferred analytics (GA4 + Microsoft Clarity + Wideview pixel φορτώνουν στο πρώτο interaction), custom font subset.
FontAwesome Pro custom subset (1.2MB → 51KB)
Παρότι έχουμε FA Pro Plus license, το full bundle θα κόστιζε 1.2MB σε κάθε page load. Έτρεξε pyftsubset script που εξήγαγε μόνο τα 155 glyphs που χρειάζεται το site → 51KB woff2. CSS subset επίσης 156KB → 27KB.
Stripped boilerplate architecture (όχι Supabase runtime)
Ξεκίνησε από Next.js + Supabase SaaS boilerplate, αλλά αφαιρέθηκε το Supabase runtime + multi-tenant logic + i18n routing που δε χρειαζόταν. Έμειναν μόνο τα UI primitives, mailer wrapper, και βασικά layouts. Καθαρή Next.js δομή χωρίς overhead.
Markdoc content pipeline αντί για CMS
67 blog posts + 11 service pages + 4 plans μένουν ως `.mdoc` files στο repo. Edit μέσω VSCode/Cursor + git push → Coolify auto-deploys. Καμία WP admin, καμία βάση δεδομένων για το frontend, μηδενικά plugin updates που σπάνε.
Cloudflare Turnstile + Mailgun + WP newsletter sync
Floating contact + newsletter forms προστατεύονται με invisible Turnstile. Submissions στέλνονται μέσω Mailgun (notification.social24.gr) σε admin email, και auto-sync στο WP newsletter system μέσω WP REST API (subscribed list ή pending double-opt-in list).
Google Indexing API + IndexNow integration
Custom scripts που πληροφορούν Google + Bing/Yandex όταν προστίθεται νέο content. 27 URLs submitted via Indexing API OAuth. Αύξηση ταχύτητας crawl από 1-2 εβδομάδες σε 24-48h.
Live από production
Πώς δείχνει στην πράξη
Screenshots από το ζωντανό site. Τιμές, ονόματα πελατών και ευαίσθητα στοιχεία είναι μασκαρισμένα με skeleton blur ώστε να φαίνεται μόνο το functionality.
Mobile
Hero mobile, modern Next.js με animated phone mockup
Desktop
Hero desktop με floating Meta/TikTok/LinkedIn cards
Mobile
Book page mobile με 7-day rolling availability
Desktop
Book page desktop, free 30min consultation flow
Tech Stack
Με τι χτίστηκε
Όλο το stack είναι τυποποιημένο. Δεν βασίζεται σε κρυφά παραμετροποιημένα plugins ή proprietary cloud services. Μπορεί να μεταφερθεί ή να συντηρηθεί από οποιαδήποτε ομάδα γνωρίζει το stack.
FAQ
Συχνές ερωτήσεις
Χάθηκε organic traffic μετά τη μετάβαση από WordPress σε Next.js;
Όχι. Σε 4 εβδομάδες μετά το launch, το Google Search Console δεν έδειξε καμία απώλεια organic traffic. Στήθηκαν 97 redirects (85 exact + 12 wildcards) που χάρτηκαν 1:1 παλιό URL σε νέο για homepage, blog posts και service pages. Το SEO equity πέρασε ακέραιο γιατί κάθε ranking URL έβρισκε destination με σωστό 301.
Πόσο πιο γρήγορο είναι το νέο site;
Lighthouse mobile 95-99 για Performance, 100 για A11y, Best Practices και SEO. FCP 1.4s, LCP 2.1s, TBT 40ms. Ο παλιός WP site έτρεχε με Lighthouse mobile 50-65, οπότε υπήρξε 30-50 points αύξηση. Επιπλέον τα analytics (GA4, Microsoft Clarity, Wideview pixel) φορτώνουν deferred στο πρώτο interaction αντί για κάθε page load, οπότε το first paint είναι ακόμα πιο καθαρό.
Πώς αλλάζει content χωρίς WordPress admin;
Τα 67 blog posts, 11 service pages και 4 plans μένουν ως .mdoc files μέσα στο repo. Edit μέσω VSCode/Cursor + git push και το Coolify auto-deploys σε λεπτά. Δεν υπάρχει WP admin να πέσει, δε χρειάζεται plugin update που σπάει layout, και δεν υπάρχει DB query σε κάθε page load. Το trade-off είναι ότι content edits γίνονται από developer ή τεχνικά καταρτισμένο user, όχι από non-tech editor.
Γιατί κρατήσατε WordPress αν φύγατε σε Next.js;
Το WP είναι isolated σε wp.social24.gr και χρησιμοποιείται μόνο για το newsletter system (subscribed list + double-opt-in flow). Submissions από το νέο Next.js frontend στέλνονται μέσω Mailgun σε admin email και auto-sync μέσω WP REST API στο newsletter list. Έτσι κρατάμε το production-grade newsletter platform του WP χωρίς να σύρουμε όλο το WP front-end overhead.
Τι σημαίνει 26.000 γραμμές κώδικα κάτω;
Ξεκινήσαμε από Next.js + Supabase SaaS boilerplate, αλλά το dosmart δεν έχει multi-tenant authentication ή Supabase runtime needs. Αφαιρέσαμε 26.000 γραμμές κώδικα + 532 packages (Supabase runtime, turbo monorepo tooling, ξένα ui packages, i18n routing) που δε χρησιμοποιούνταν. Έμειναν μόνο τα UI primitives, mailer wrapper και base layouts, οπότε το production bundle είναι μικρότερο, build times γρηγορότερα, και attack surface ελάχιστο.
Πόσο μειώθηκε το FontAwesome bundle;
Από 1.2MB σε 51KB woff2 (font) + 156KB σε 27KB CSS subset. Παρότι έχουμε FA Pro Plus license, το full bundle θα κόστιζε 1.2MB σε κάθε page load. Έτρεξε pyftsubset script που εξήγαγε μόνο τα 155 glyphs που χρησιμοποιεί το site, και έγινε αντίστοιχο CSS subset. Έτσι παίρνεις premium icon set χωρίς το performance hit.