Hero Image
3 pattern (+1 anti-pattern) per eliminare la duplicazione in Vue 3

Nelle SPA di grandi dimensioni con Vue 3 è comune trovarsi con decine di pagine che sono variazioni dello stesso tema: stessa struttura, stesso boilerplate, stesse cinque righe di setup. Si parte con copia-incolla, poi un bug nel flusso di salvataggio va corretto in dodici posti. Tre pattern aiutano a gestire il problema, ciascuno per un tipo di duplicazione diverso. Un quarto caso mostra quando è meglio fermarsi. Gli esempi usano Nuxt 3 e Vuetify 3. Nel repository demo pinia-vue-demo si trova tutto il codice eseguibile.

10 minuti Leggi
Hero Image
OpenLayers e Vue 3: integrazione con composables e TypeScript

Il problema: Vue wrappa ciò che non dovrebbe OpenLayers è una libreria imperativa per mappe interattive. Si crea un oggetto Map, gli si passa un target DOM, si aggiungono layer e fonti dati chiamando metodi che mutano lo stato interno. Vue 3 funziona al contrario: si dichiara lo stato in una variabile reattiva, si usa quella variabile nel template, e il framework si occupa di aggiornare il DOM ogni volta che il valore cambia. Non serve manipolare il DOM manualmente.

12 minuti Leggi