Ejercicios 1

En esta sección de ejercicios vamos a desarrollar la primera parte de una aplicación destinada a la gestión de un videoclub.

Ejercicio 1.1 - Inicio de la aplicación

En primer lugar crea un nuevo proyecto mediante el cli de Ionic, usa la plantilla en blanco (tipo blank) y llama al proyecto "iVideoclub". Al crear un proyecto de este tipo se incluirá el contenido mínimo de ejemplo dentro de la carpeta src, lo cual será suficiente para empezar nuestro proyecto.

Una vez creada la aplicación vamos a revisar su contenido:

1. Revisa el contenido de las carpetas del proyecto, ¿qué carpetas se han creado y para qué sirve cada una?

2. Como podrás ver no se han creado las carpetas de Cordova, prueba a añadir la plataforma "android" y revisa las nuevas carpetas que se añaden.

3. Revisa el contenido de la carpeta "src" y busca el contenido de la página que se incluye por defecto (llamada home).

4. ¿Cómo se carga la página por defecto? Busca si se hace referencia a la página "home" desde algún fichero y cómo se indica que se cargue como página principal.

Una vez hecho esto vamos a visualizar la aplicación:

• Abre la aplicación en el navegador usando la opcion "serve" del cli de ionic con el parámetro "--lab". Revisa la apariencia de esta aplicación para Android, iOS y Windows phone.

• De forma opcional compila y ejecuta la aplicación para la plataforma Android. Prueba a utilizar las opciones "-c" y "-l" (¿para qué sirven estas opciones?).

Ejercicio 1.2 - Crear páginas de la app

En este segundo ejercicio vamos a añadir algunas páginas a la aplicación. Para esto, usando el comando apropiado de Ionic, crea tres páginas con el siguiente nombre:

• autor

• curriculum

• videoclub

Una vez hecho esto modifica el título de la barra de navegación de cada una de las páginas (incluida la página home). El título de cada página será el siguiente:

• home --> Inicio

• autor --> Autor

• curriculum --> Currículum

• videoclub --> iVideoclub

Además añade al área de contenido de cada página un encabezado h1 con el mismo texto indicado para el título y un párrafo con el texto "Contenido de ejemplo".

Para poder ver los cambios realizados, como todavía no están enlazadas las páginas, modifica la página principal cargada al inicio desde el fichero de rutas. Prueba cada una de las nuevas páginas en el navegador y, de forma opcional, en el emulador de Android.