Tecnología y arquitectura

 

 Los compontentes del framework que se utilizan para desarrollar una funcionalidad son:

Marco iónico

Un marco de desarrollo de aplicaciones móviles multiplataforma que utiliza las tecnologías web Angular JS y Front End.

Sitio web oficial : http://ionicframework.com/

Documentación : http://ionicframework.com/docs/

 Ionic CLI

La interfaz de línea de comandos de Ionic (CLI) es la herramienta de referencia para desarrollar aplicaciones de Ionic.

 

-          Instalación:

La CLI de Ionic se puede instalar globalmente con npm:

-          La CLI de Ionic se entrega con documentación de comando a la que se puede acceder con la --helpbandera.

 

Arquitectura

El Ionic CLI está construido con Typescript y Node.js. Es compatible con el Node 10.3+, pero siempre se recomienda el último Node LTS y se puede seguir el desarrollo en el repositorio de código abierto de GitHub .

Ionic Lab

Ionic Lab hace que sea mucho más fácil probar las aplicaciones en múltiples tamaños de pantalla y tipos de plataforma, Ionic es un gran SDK y una cadena de herramientas que brinda a los desarrolladores híbridos una ventaja sobre los nativos.

* Para comenzar con Ionic Lab, asegúrese de actualizar a la última versión de Ionic en NPM

 

Para abrir la nueva interfaz de usuario de Lab

* Serve abre la aplicación en un navegador pero muestra cómo se verá la aplicación en un teléfono, con iOS y Android uno al lado del otro.

Y es compatible con Live Reload y todas las otras cosas que se han agregado.

 

Si dentro del proyecto se va a la carpeta "src/pages/home" se encontraran tres archivos distintos:

·         Un HTML que contiene la vista de la pantalla de inicio de nuestra app.

·         Un CSS (archivo scss porque realmente Ionic usa Sass como preprocesador CSS) que contiene las hojas de estilo para esta página.

·         Un archivo .ts (de TypeScript) con lo que sería la declaración del componente de esta página.

 

 

 Como funciona el framework con los componentes del punto anterior

La base de Ionic esta desarrollada sobre AngularJs y Cordova.

Para entender de forma gráfica su funcionamiento, tenemos esta imagen de Ionic Framework

IONIC

Ionic Native es un conjunto de envoltorios seleccionados para los complementos de Cordova que facilitan la adición de cualquier funcionalidad nativa que necesite la aplicación móvil Ionic tambien envuelve las devoluciones de llamada de complementos en una promesa u observable, lo que proporciona una interfaz común para todos los complementos y facilita el uso de complementos con detección de cambios angulares.

 

CAPACITOR:

Capacitor proporciona un conjunto de API coherente y centrado en la web que permite que una aplicación se mantenga lo más cerca posible de los estándares web, al tiempo que accede a las funciones de dispositivos nativos en plataformas que los admiten. Agregar funcionalidad nativa es fácil con una API de complemento simple para Swift en iOS, Java en Android y JavaScript para la web.

2.       

        Algoritmo para nueva funcionalidad

 

1.Generamos alguna caracteristica con un nombre y opciones

 ionic generate <type> <name> [options]

Este comando usa la CLI de Angular para generar características como páginas, componentes, directivas, servicios, etc.

Ejemplos:

ionic generate page contact

ionic generate component login-form --change-detection=OnPush

ionic generate service api/user

 

 

 

2.Modificar el componente:

Ir al componente ya sea el archivo con extension .html, .css o .ts ej.: login.html y modificar el contenido al estilo y funcionalidades deseadas usando estilos en el .css o typescript en el archivo .ts