Costruisci la tua app mobile con Cordova

Utilizzare Cordova può essere il modo più veloce per molti sviluppatori Web per iniziare a creare un'applicazione mobile. Con Cordova, non hai bisogno di imparare un nuovo set di linguaggi di programmazione, puoi semplicemente usare HTML, CSS e JavaScript.

Puoi compilare i tuoi codici su numerose piattaforme mobili tra cui iOS, Android, Windows Phone e BlackBerry utilizzando lo strumento di costruzione di PhoneGap. La domanda ora è "da dove cominciare?"

Per cominciare, dobbiamo creare un "Progetto Cordova" . Se sei uno sviluppatore web che è interessato a costruire la tua applicazione mobile, segui questo post. Ti mostreremo il modo più veloce per avviare un progetto per la creazione di applicazioni mobili con Cordova. Iniziamo.

Cordova CLI

Cordova viene fornito con Command-line Interface (CLI) che include il comando per creare un progetto, emulare e costruire l'app. La CLI Cordova è disponibile come pacchetto Node.js. Quindi devi installare Node.js per poterlo installare.

Supponendo di averlo installato nel computer, è possibile digitare questa riga di comando in Terminale o Prompt dei comandi per installare Cordova CLI.

 npm install -g cordova 

Questo installerà il comando cordova livello globale; puoi raggiungere il comando ovunque nelle directory del tuo computer. Digitare cordova -v per ottenere la versione installata.

Creare un progetto

Una volta installato il Cordova CLI, avviare un progetto Cordova sarà un gioco da ragazzi. Anche senza avere familiarità con le linee di comando, questo dovrebbe essere facile da seguire. Possiamo creare un progetto con il comando create seguito dal nome della cartella del progetto, ad esempio:

 cordova creare hongkiatcom 

Questo comando scaricherà tutti i file necessari e alcuni file di esempio per aiutarci a iniziare lo sviluppo.

Una volta che il progetto è stato creato, inserisci la directory del progetto usando cd . Questa cartella dovrebbe contenere il numero di cartelle come segue.

• La cartella hooks può contenere script che personalizzano i comandi Cordova nativi.
• La cartella di unione può contenere file HTML, CSS e JavaScript per piattaforme specifiche e sovrascriverà quelli presenti nella cartella www durante la distribuzione dell'applicazione.
• La cartella delle piattaforme conterrà i file delle app native quando puntiamo a costruire per una piattaforma specifica.
• La cartella dei plugin conterrà plugin che estendono Cordova.
• La cartella www contiene file Web generali condivisi su piattaforme.

Platform IDE

Prima di proseguire, avremo bisogno di un IDE come Xcode per sviluppare app iOS, Android Studio per lo sviluppo di Android e Visual Studio per Windows Phone. Dato che sto usando OS X e ho già installato Xcode, li userò per aggiungere la piattaforma iOS nel mio progetto.

Digita il seguente comando:

 la piattaforma cordova aggiunge ios 

Come accennato, questo comando aggiungerà file nativi per creare app per la piattaforma specificata nella riga di comando. Dopo aver eseguito il comando precedente, dovresti trovare una cartella denominata ios contenente i file .xcodeproj e un gruppo di altri file, come segue.

Se hai aggiunto la piattaforma Android, devi cercare una cartella denominata Android .

Aggiungi il progetto in IDE (Xcode)

Ora aggiungiamo la directory del progetto all'IDE, che in questo caso è Xcode. Avvia Xcode. Vai su File> Apri menu e vai alla directory della piattaforma, ad esempio / piattaforme / ios . Fai clic su Apri per aprire la cartella in Xcode.

Puoi modificare qualsiasi cosa - HTML, CSS, Image e JS - all'interno della cartella www . Al termine, fai clic sul pulsante di riproduzione in alto a sinistra di Xcode per compilare l'app e presentarla in iPhone Simulator.

Pensiero finale

Cordova ha reso la creazione di un'app mobile facile da seguire. Possiamo costruire un'app mobile come se costruissimo un sito web. In questo post, ti abbiamo mostrato come creare un progetto Cordova e presentare l'app nel simulatore iOS. In realtà c'è molto altro da esplorare a Cordova. Purtroppo spero che questo post possa aiutarti a iniziare a utilizzare PhoneGap per lo sviluppo di app per dispositivi mobili.

Open Color: combinazione di colori ottimizzata per l'interfaccia utente per i progettisti

Quanto tempo sprecate giocando intorno scegliendo il giusto schema colori per i vostri progetti? Con Open Color hai accesso a una combinazione di colori predefinita creata appositamente per la progettazione dello schermo .I colori spaziano sull'intero spettro con scelte cromatiche molto opache e molto luminose

(Consigli tecnici e di design)

50 regali dell'ultimo minuto per i viaggiatori frequenti

È la fine dell'anno e la voglia di girovagare sta arrivando. È tempo di prendersi una pausa dalle scartoffie e andare in posti dove non siamo mai stati e mangiare cibo con nomi che non possiamo pronunciare ! Viaggiare è una grande esperienza, non importa se si tratta di un breve viaggio di un weekend, di uno zaino in spalla attraverso il continente, di una lunga vacanza dall'altra parte del mondo o di un campeggio da solista nel mezzo di Madre Natura.In

(Consigli tecnici e di design)