Qué son pages y cómo generar las primeras de nuestra app

Desde ojos del usuario podemos decir que una aplicación está compuesta por distintas paginas o pages en Ionic.

Nuestra aplicación contara con cuatro distintas páginas:

1. Login: nuestro usuario podrá ingresar o registrarse a partir de esta pantalla.
2. Home: será nuestro dashboard o página central de la aplicación donde se podrá ver la lista de amigos, así como información del usuario, también podrá cambiar su status.
3. Configuración: en esta pantalla el usuario podrá cambiar toda su información, dicha información se guarda en una base de datos remota.
4. Conversación: accedes a ella desde Home dando click en algún amigo con el que quieras conversar, este chat es en tiempo real.

Dentro de nuestra carpeta pages/home encontraremos tres archivos con el mismo nombre, pero distinta terminación, el archivo que termina en .ts se refiere a TypeScript.

En nuestro archivo ts encontraremos al inicio los imports que sirven para indicarle a nuestra clase de TypeScript donde estará cada objeto externo que vayamos a utilizar. También tenemos un decorador cuya funcionalidad es provista por TypeScript y podemos observar que es el decorador de Component el cual es propio de Angular, este decorador siempre tendrá asignado un archivo html.

Los decoradores proporcionaran una funcionalidad especifica para cada clase en la que se utilice, dependiendo del decorador que se utilice será la funcionalidad que añada, por ejemplo:

• Component: tendrán atado un html pero pueden estar dentro de algún componente o página.
• Pages: están atados a un html pero a diferencia del Component estos no pueden estar dentro de un componente o alguna otra página.
• Injectable: no tienen atados ningún html, son servicios que pueden agregarse a otras clases diferentes.

Dentro de las clases en la programación orientada a objetos, el método constructor es el primer método que se ejecuta y sus parámetros serán aquellos objetos que necesitemos inyectar para usarlos dentro de esa clase en específico. Un objeto común que inyectemos en las paginas de nuestra aplicación será el NavController, este objeto se encarga de las funciones de navegación en Ionic.

En la misma carpeta encontraremos un archivo de estilos, los estilos que se encuentren dentro de este archivo solo afectaran a la página en específico.
Para generar nuestras propias paginas debemos correr el comando:

ionic generate page <nombre del page o página >

Las clases de Ionic tienen un método especifico llamado ionViewDidLoad que se ejecuta automáticamente cuando termina de cargar la vista del html.
Ionic crea un archivo modulo para cada página que genere, este archivo se encarga de hacer disponible la página para el resto de la aplicación.

Debemos añadir manualmente nuestras páginas al sidemenu dentro de nuestro archivo app.component.ts para poder navegar a ellas desde nuestro menú.
Por último, debemos añadir los archivos module de nuestras páginas al archivo module principal que se encuentra dentro de la carpeta app.