Crear una aplicación

Para crear una nueva aplicación abriremos una consola (o en Windows la consola de Node.Js llamada "Node.js command prompt") y ejecutamos el siguiente comando:

$ cordova create myapp com.example.myapp HelloWorld

# O también podemos ejecutar:
$ cordova create myapp

Donde:

  • El primer argumento, "myapp", es el nombre de la carpeta donde se generará el contenido. Si el directorio no existe se creará automáticamente.

  • El segundo argumento, "com.example.myapp", es el nombre del paquete del proyecto usado como identificador. Este argumento es opcional y se puede modificar después desde el fichero "config.xml" (pero hay que llevar cuidado ya que se utiliza en el código generado, como en el nombre de los paquetes de Java). El valor por defecto es "com.cordova.helloworld", por lo que se recomienda asignarle un valor apropiado. Normalmente se suele utilizar el nombre de dominio de la organización pero en orden inverso y añadiendo el nombre de la aplicación. Este nombre no puede contener espacios ni números después de punto.

  • El tercer argumento, "HelloWorld", es el nombre del proyecto que se generará para las distintas plataformas (por ejemplo, el nombre del proyecto que se abrirá en Android Studio o XCode). Este argumento es opcional y también se puede modificar después desde el fichero "config.xml" (pero hay que llevar cuidado ya que se utiliza en el código generado). El valor por defecto es "HelloWorld", por lo que se recomienda indicar un valor adecuado. Este nombre no puede contener espacios y debe de empezar con mayúsculas.

Al ejecutar este comando se creará una carpeta con el nombre que le hayamos indicado, "myapp" en este caso, con todo el contenido necesario para empezar a desarrollar nuestra aplicación. La estructura de carpetas generada es la siguiente:

  • hooks - Esta carpeta se utiliza para añadir scripts que se ejecutarán cuando se produzcan determinados eventos, como por ejemplo antes o después de la compilación, etc. En la propia carpeta se incluye un fichero con instrucciones para su utilización.

  • merges - Esta carpeta se utiliza para añadir código que nos permitirá modificar o personalizar nuestra aplicación para determinadas plataformas. Es posible que esta carpeta no se cree con la instalación inicial, pero la podemos crear nosotros. El contenido que pongamos aquí se unirá o mezclará (de ahí su nombre) con el de la compilación por plataforma. Por ejemplo, si creamos la carpeta "merges/android/css/overrides.css", al compilar para android se utilizará este CSS en lugar del que esté colocado en la carpeta "www/css".

  • platforms - Contiene el código específico de las plataformas para las cuales se va a compilar. El código de esta carpeta es generado y no se ha de modificar manualmente.

  • plugings - Contiene los plugins o módulos instalados para nuestra aplicación, los cuales se utilizan para añadir funcionalidad como el acceso a las características nativas del móvil.

  • res - Contiene los recursos de iconos y splashcreen para cada una de las plataformas de compilación.

  • www - Contiene el código fuente de nuestra aplicación web. Esta carpeta es donde tendremos que desarrollar nuestra aplicación web de forma centralizada. Posteriormente, al compilar nuestro proyecto para las plataformas deseadas, se copiará la última versión del contenido de esta carpeta.

Al crear un nuevo proyecto todas las carpetas se encontrarán vacías a excepción de res y www. La carpeta res incluye iconos y splashscreen de ejemplo para todas las plataformas de compilación, mientas que en www podemos encontrar una primera aplicación de ejemplo (que mostrará el Hola Mundo de Cordova), con una estructura de carpetas básica (css, img y js). Para empezar a desarrollar un proyecto partiremos de este código de ejemplo, pudiendo modificar todo lo que queramos dentro de la carpeta www, incluso las subcarpetas de recursos (css, img y js).

Además de esta estructura, en la raíz de nuestra aplicación encontraremos el fichero config.xml, el cual se utiliza para la configuración del proyecto.

En las siguientes secciones se tratarán cada uno de estos puntos más en detalle.

Importante: El resto de comandos que ejecutemos utilizando el CLI de Cordova, los tendremos que ejecutar dentro de la carpeta del proyecto o aplicación, o en una subcarpeta dentro de la misma, en otro caso nos daría error.

Última actualización