En este tema, exploraremos la estructura de un proyecto Apache Cordova. Comprender cómo está organizado un proyecto es crucial para trabajar de manera eficiente y efectiva. Vamos a desglosar cada componente y su propósito.

Cuando creas un nuevo proyecto Cordova, se genera una estructura de directorios específica. A continuación, se muestra una lista de los directorios y archivos más importantes:

1. hooks/:

   • Propósito: Este directorio contiene scripts que se ejecutan en diferentes momentos del ciclo de vida del proyecto Cordova (por ejemplo, antes de construir, después de agregar una plataforma, etc.).
   • Ejemplo: Puedes tener un script que se ejecute antes de cada compilación para limpiar archivos temporales.

2. platforms/:

   • Propósito: Aquí es donde se almacenan los archivos específicos de cada plataforma (iOS, Android, etc.) después de que se agregan al proyecto.
   • Ejemplo: Si agregas la plataforma Android, se creará un subdirectorio android/ dentro de platforms/.

3. plugins/:

   • Propósito: Este directorio contiene todos los plugins que has instalado en tu proyecto Cordova.
   • Ejemplo: Si instalas el plugin de la cámara, se creará un subdirectorio cordova-plugin-camera/ dentro de plugins/.

4. www/:

   • Propósito: Este es el directorio principal donde resides tu aplicación web. Contiene archivos HTML, CSS, JavaScript, imágenes, etc.
   • Ejemplo: index.html es el archivo de entrada principal de tu aplicación.

5. config.xml:

   • Propósito: Este archivo de configuración es crucial para tu proyecto Cordova. Define la configuración global de la aplicación, como el nombre, el identificador, las preferencias de la plataforma, los permisos, etc.
   • Ejemplo: Puedes especificar el nombre de tu aplicación y el identificador único en este archivo.

6. package.json:

   • Propósito: Este archivo es utilizado por npm (Node Package Manager) y contiene información sobre las dependencias del proyecto, scripts de construcción, y otra configuración relevante.
   • Ejemplo: Puedes definir scripts personalizados para automatizar tareas comunes.

Vamos a crear un proyecto Cordova y explorar su estructura. Sigue estos pasos:

1. Crear un Proyecto Cordova:

   cordova create myApp com.example.myapp MyApp
   cd myApp
   

2. Agregar una Plataforma:

   cordova platform add android
   

3. Instalar un Plugin:

   cordova plugin add cordova-plugin-camera
   

4. Explorar la Estructura del Proyecto:

   tree myApp
   

   Deberías ver una estructura similar a la descrita anteriormente.

Objetivo: Familiarizarse con la estructura del proyecto Cordova.

1. Crear un nuevo proyecto Cordova:

   • Nombre del proyecto: TestApp
   • Identificador: com.example.testapp
   • Nombre de la aplicación: TestApp

2. Agregar la plataforma iOS.

3. Instalar el plugin de red (cordova-plugin-network-information).

4. Explorar la estructura del proyecto y describir el propósito de cada directorio y archivo principal.

Solución:

1. Crear el proyecto:

   cordova create TestApp com.example.testapp TestApp
   cd TestApp
   

2. Agregar la plataforma iOS:

   cordova platform add ios
   

3. Instalar el plugin de red:

   cordova plugin add cordova-plugin-network-information
   

4. Explorar la estructura del proyecto:

   tree TestApp
   

   Descripción:

   • hooks/: Scripts de ciclo de vida.
   • platforms/: Archivos específicos de la plataforma iOS.
   • plugins/: Contiene cordova-plugin-network-information.
   • www/: Archivos de la aplicación web.
   • config.xml: Configuración global de la aplicación.
   • package.json: Información de dependencias y scripts.

Comprender la estructura de un proyecto Cordova es fundamental para gestionar y desarrollar aplicaciones de manera eficiente. Cada directorio y archivo tiene un propósito específico que facilita la organización y el desarrollo del proyecto. En el próximo módulo, profundizaremos en los conceptos básicos y las APIs de Cordova para comenzar a interactuar con las funcionalidades del dispositivo.