Migrare una Web App da Cordova a Capacitor: Guida Passo dopo Passo

Questa guida ti aiuterà a migrare la tua web app da Cordova a Capacitor, rendendo il processo semplice e chiaro. Copriremo ogni sezione con un approccio step-by-step.

Introduzione a Cordova e Capacitor

Cordova e Capacitor sono entrambi strumenti che permettono agli sviluppatori web di creare app native per varie piattaforme usando HTML, CSS e JavaScript. Sebbene abbiano somiglianze, esistono differenze chiave nella gestione dei progetti nativi, dei plugin e della gestione CLI/versioni.

Strategia di migrazione

La migrazione da Cordova a Capacitor può essere graduale o una sostituzione completa, a seconda della complessità della tua app. Capacitor è retrocompatibile con Cordova, così puoi passare le tue web app esistenti quando sei pronto.

Per facilitare la migrazione, valuta di usare l' Estensione Ionic per VS Code e l'audit dei tuoi plugin Cordova attuali. Puoi continuare a usare i plugin Cordova se necessario, o sostituirli con gli equivalenti Capacitor.

Guida passo passo alla migrazione

Segui questi passaggi per migrare la tua web app da Cordova a Capacitor:

Lavora su un branch code separato: Si consiglia di lavorare su un branch code separato quando applichi queste modifiche.
Inizializza la tua app con Capacitor: Apri il tuo progetto nel terminale e segui le guide per aggiungere Capacitor a una web app o aggiungere Capacitor a un'app Ionic. Usa le informazioni del tuo file Cordova config.xml per il nome dell'app e il Bundle ID.
Build della web app: Esegui la build del progetto web almeno una volta prima di aggiungere piattaforme native. Questo assicura che la www folder sia configurata correttamente nel file di configurazione di Capacitor.
Aggiungi le piattaforme: Esegui npx cap add ios e npx cap add android per aggiungere le piattaforme iOS e Android. Verranno create cartelle di progetto native separate nella root del tuo progetto.
Genera icone e splash screen: Se hai già le icone e le splash screen, usa il cordova-res tool per generarle e copiarle nei progetti nativi.
Verifica e migra i plugin Cordova esistenti: Esamina i plugin Cordova esistenti e sostituiscili con equivalenti Capacitor se possibile. Rimuovi i plugin non necessari.
Rimuovi il plugin Cordova: Dopo aver sostituito o rimosso un plugin Cordova, disinstallalo ed esegui npx cap sync per rimuovere il plugin code dal progetto nativo.
Applica permessi aggiuntivi: Mappa i valori tra plugin.xml e le impostazioni richieste su iOS e Android per applicare i permessi necessari.
Configura le preferenze: Aggiungi manualmente le preferenze da config.xml al file di configurazione Capacitor.
Gestire le configurazioni specifiche per piattaforma: Configura gli elementi da config.xml per ogni piattaforma (iOS e Android) secondo necessità.
Cambiare lo scheme per il serving dei contenuti: Se necessario, cambia lo scheme utilizzato per servire i contenuti della tua app per evitare la perdita di dati.
Testare e rimuovere Cordova: Testa la tua app migrata per assicurarti che tutte le modifiche siano state applicate correttamente. Una volta soddisfatto, puoi rimuovere Cordova dal progetto o lasciarlo se intendi continuare a usare i plugin Cordova.

Congratulazioni! Hai migrato con successo la tua web app da Cordova a Capacitor. Per saperne di più sull'uso dei plugin Cordova in un progetto Capacitor o sul workflow di sviluppo Capacitor, visita la documentazione ufficiale di Capacitor.

Live Updates con il nostro servizio Capgo

Siamo orgogliosi di offrire Capgo, la nostra soluzione che abilita i Live Updates per le tue app Capacitor, permettendoti di rilasciare aggiornamenti Over-The-Air (OTA) a un prezzo equo. Questa funzione è utilissima per fix rapidi, il deployment di nuove feature e per garantire che i tuoi utenti abbiano sempre l'ultima versione dell'app senza attendere l'approvazione degli app store.

Come funziona il nostro servizio Capgo

Capgo è un servizio cloud che ti permette di distribuire live updates alle tue app Capacitor. È composto da una web dashboard e da un SDK nativo da integrare nella tua app. Il SDK controlla la presenza di aggiornamenti all'avvio o a intervalli specifici e li scarica in background. Quando un aggiornamento è disponibile, il SDK chiederà all'utente di installarlo. Se l'utente accetta, l'aggiornamento verrà installato e applicato immediatamente.

Vantaggi di Capgo Live Updates

Aggiornamenti più rapidi: Distribuisci gli aggiornamenti all'istante senza attendere l'approvazione dell'app store.
Minore dipendenza dall'App Store: Supera le restrizioni e i limiti degli app store.
Migliore user experience: Tieni gli utenti coinvolti con le ultime feature e i bug fix, senza che debbano aggiornare l'app manualmente.

Come implementare Capgo Live Updates

Per implementare i live updates di Capgo nel tuo progetto Capacitor, segui questi passaggi:

Iscriviti a account Capgo.
Installa il SDK Capgo nel tuo progetto.
Configura la tua app per controllare gli aggiornamenti all'avvio o a intervalli specifici.
Distribuisci gli aggiornamenti della tua app tramite la dashboard Capgo.

Conclusione

Speriamo che questa guida ti sia stata utile per migrare la tua web app da Cordova a Capacitor. Se hai domande o hai bisogno di assistenza durante la migrazione, non esitare a contattarci sul nostro discord server.

Continua da Migrare una web app da Cordova a Capacitor: guida passo passo

Se stai usando Migrare una web app da Cordova a Capacitor: guida passo dopo passo per pianificare la migrazione e le operazioni enterprise, collegalo a Capgo Enterprise per il workflow del prodotto in Capgo Enterprise, Alternative ai plugin Ionic Enterprise per il workflow del prodotto nelle alternative ai plugin Ionic Enterprise, Alternative a Capgo per il workflow del prodotto in Capgo Alternatives, Consulenza Capgo per il workflow di prodotto in Capgo Consulting, e Supporto Premium Capgo per il workflow di prodotto in Capgo Premium Support.