AlanJereb.com
Programmazione

Riscrittura del blog - migrazione da Gatsby.js a Next.js

Oct 3rd, 2023

Dopo una breve pausa, sono entusiasta di tornare con un nuovo post sul blog. Come avrete notato, questo è diverso dai soliti contenuti di viaggi e fotografia. Grazie al suggerimento di mia moglie, ho deciso di diversificare gli argomenti che tratto qui sul blog. Il mio blog, le mie regole.

Nel post di oggi, ti guiderò attraverso alcune modifiche recenti che ho apportato al blog.

Addio a Gatsby.js, benvenuto Next.js

Addio a Gatsby.js, benvenuto Next.js

Nelle coulisse, ho dato al blog un completo restyling. Ho detto addio a Gatsby.js e abbracciato il tecnicamente avanzato Next.js. Inoltre, ho cambiato il sistema di gestione dei contenuti (CMS) da Contentful all'altamente flessibile Sanity CMS.

Non ti annoierò con i dettagli tecnici di queste transizioni, poiché ci sono molte risorse disponibili in giro. Tuttavia, se hai domande sulla migrazione da Gatsby.js a Next.js o sul passaggio da Contentful a Sanity, sentiti libero di scrivermi su Twitter, e farò del mio meglio per aiutarti.

Ora, entriamo nei dettagli delle modifiche.

Backend:

  • Sanity Revalidation Webhook: Ho configurato un webhook di riconvalida di Sanity per garantire che la cache venga aggiornata automaticamente dopo la pubblicazione di nuovi contenuti.
  • Traduzioni: Ho aggiunto chiavi per supportare la lingua inglese.
  • Duplicazione del database: Ho aggiunto una funzione per duplicare il database di produzione nell'ambiente di sviluppo, in modo da lavorare sempre con una copia fresca del sito durante lo sviluppo.
La migrazione del database dello studio di Sanity da produzione a sviluppo e viceversa

La migrazione del database dello studio di Sanity da produzione a sviluppo e viceversa

  • Server-Side Magic: Ho sfruttato le capacità di rendering lato server di Next.js per migliorare le prestazioni, spostando molti componenti verso il SSR per un'esperienza più veloce.
  • Aggiornamento dello schema del database: Ho aggiornato gli schemi per ospitare tag e parole chiave.

Frontend:

  • Pulsante Torna all'Inizio: Ho risolto un bug che causava un'impropria visualizzazione del pulsante "Torna all'inizio" su schermi più piccoli.
  • Colori di Accento: Ho regolato i colori di accento per una migliore leggibilità su sfondo bianco.
Tre nuovi colori per i collegamenti

Tre nuovi colori per i collegamenti

  • Chiavi Prevedibili: Ho sostituito l'uso di math.random() nei componenti JSX con chiavi più prevedibili e consistenti.
Esempio di modifiche

Esempio di modifiche

  • Miglioramenti CSS: Abbiamo risolto varie problematiche legate al CSS e apportato ottimizzazioni delle prestazioni.
  • Rinnovamento del Lightbox: Abbiamo migliorato il metodo di rendering del lightbox per assicurare che non si rompa anche se le risorse esterne non riescono a caricare.

Cosa ci aspetta:

  • Filtraggio per tag di categoria: Presto potrai filtrare i contenuti per tag di categoria. | Implementato - 2023.10.25
  • Paginazione: Attualmente sto lavorando per implementare la paginazione per una navigazione più fluida.
  • Nuove lingue: In programma ci sono traduzioni in spagnolo, francese e italiano per rendere i contenuti accessibili a un pubblico più ampio. | Implementato - 2023.10.24
  • Addio a Social Beaver: Il progetto Social Beaver andrà offline, e il suo link sarà sostituito da un dettagliato post di descrizione del progetto. | Implementato - 2024.04.22
  • Filtraggio dei post correlati: Questa funzione mostrerà solo post con tag correlati quando ci saranno più contenuti sul blog.

Rimani sintonizzato per queste entusiasmanti novità e, come sempre, grazie per far parte di questo percorso.

Return to top button