DAH 5B 6pm U1 Actividad#3 Equipo#2 DeluxeTeam Bryan Mahomedalid Lopez Aguirre

Actividad 3
Investigar acerca de la arquitectura de las aplicaciones multiplataforma (hibrido).20

16/03/2021
Página 1 de 27
DA
H2
Alumno: Semestre 9
López Aguirre Bryan Mahomedalid
Fecha de Entrega:
Catedrático: 16/03/21
Dr. Ibarra Carlos Francisco
NC:
Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC
Correo:
Tema 1. Introducción 17400124
Catedrático: Dr. Francisco Ibarra Carlos
brmalopezag@ittepic.edu.mx
Grupo 5B
Actividad 3
16/03/2021
Página 2 de 27
Contenido
Introducción..................................................................................................................................... 3
Competencias.................................................................................................................................. 4
Subtemas.......................................................................................................................................... 4
Contenido......................................................................................................................................... 5
A) Plasmar en al menos una hoja tamaño oficio o mejor aún doble carta
todos los componentes relacionados en las 4 tecnologías de la actividad 2.
Estos componentes deben mostrarse relacionados entre si y describir
palabras clave para cada uno de estos. Representar los componentes con la
simbología mas adecuada respetando sus colores nativos...................................5
B) En esta investigación se deberá incluir al igual que en la actividad 2
NetCore/Xamarin, React/JavaScript, Flutter/Dart......................................................6
C) Independiente al diseño de la arquitectura de las 4 tecnologías
plasmadas en el inciso (A), es importante describir y explicar su relación,
funcionamiento y diferencias entre cada arquitectura ya que se trata de una
investigación............................................................................................................................ 6
Conclusión..................................................................................................................................... 25
Glosario..................................................................................................................................... 26

Tema 1. Introducción Catedrático: Dr. Francisco Ibarra Carlos
Actividad 3
Palabras Clave: hibrido, desarrollo. 16/03/2021
Página 3 de 27
Introducción
El siguiente documento se abarca a fondo los temas siguientes: una investigación extensa
acerca de la arquitectura de las aplicaciones multiplataforma, en donde se busca tener todos
los componentes relacionados en las 4 tecnologías que anteriormente vimos en la actividad
2 es decir NetCore/Xamarin, React/JavaScript, Flutter/Dart.
Así mismo se incluye un breve pero concisa explicación del funcionamiento de estas

Actividad 3
16/03/2021
Página 4 de 27
Competencias
Distingue la historia y utilización de las tecnologías de desarrollo híbrido.
Analiza y compara distintos frameworks de desarrollo de aplicaciones híbridas.
Subtemas
1.1 Historia.
1.2 Potencialidades.
1.3 Comparativa entre aplicaciones híbridas nativas.
1.4 Frameworks.

Actividad 3
Palabras Clave: ionic, native. 16/03/2021
Página 5 de 27
Contenido
Actividad 3. Investigar acerca de la arquitectura
de las aplicaciones multiplataforma (hibridas).
A) Plasmar en al menos una hoja tamaño oficio o mejor aún

doble carta todos los componentes relacionados en las 4
tecnologías de la actividad 2. Estos componentes deben
mostrarse relacionados entre si y describir palabras
clave para cada uno de estos. Representar los componentes
con la simbología mas adecuada respetando sus colores
nativos.
NetCore/Xamarin, React/JavaScript, Flutter/Dart, Ionic/Angular.

Actividad 3
Palabras Clave: Ecma, Interfaz. 16/03/2021
Página 6 de 27
B) En esta investigación se deberá incluir al igual que

en la actividad 2 NetCore/Xamarin, React/JavaScript,
Flutter/Dart.
C) Independiente al diseño de la arquitectura de las 4

tecnologías plasmadas en el inciso (A), es importante
describir y explicar su relación, funcionamiento y
diferencias entre cada arquitectura ya que se trata de
una investigación.
Arquitectura Xamarin
En el diagrama se muestra la arquitectura general de una aplicación Xamarin

Palabras Clave: Contenedores, virtual.
multiplataforma. Xamarin permite crear una interfaz de usuario nativa en cada
plataforma y escribir lógica de negocios en C# que se comparte entre plataformas.
Xamarin se basa en Mono, una versión de código abierto de .NET Framework que
se basa en los estándares ECMA de .NET. Mono ha existido desde hace casi tanto
tiempo como .NET Framework y se ejecuta en la mayoría de plataformas, Linux,

Actividad 3
16/03/2021
Página 7 de 27
Unix, FreeBSD and macOS. The Mono runtime automatically handles tasks such as
memory allocation, garbage collection, and interoperability with underlying
platforms.
Xamarin.Android
Las aplicaciones Xamarin.Android se compilan desde C# en lenguaje intermedio

(IL) que, después, se compila Just-in-Time (JIT) en un ensamblado nativo cuando se
inicia la aplicación. Las aplicaciones Xamarin.Android se ejecutan en el entorno de
ejecución Mono, en paralelo con la máquina virtual en tiempo de ejecución de
Android (ART). Xamarin proporciona enlaces .NET a los espacios de nombres
Android.* y Java.*. El entorno de ejecución Mono llama a estos espacios de
nombres a través de contenedores administrados que se pueden llamar (MCW) y
proporciona a ART contenedores que se pueden llamar de Android (ACW) , lo que
permite que ambos entornos invoquen código entre sí.
Xamarin.IOS
Las aplicaciones Xamarin.iOS se compilan Ahead-of-Time (AOT) de forma

completa desde código de C# en código de ensamblado de ARM nativo. Xamarin
usa selectores para exponer Objective-C en código de C# administrado y
registradores para exponer código de C# administrado en Objective-C. Los
selectores y registradores se denominan colectivamente "enlaces" y permiten la
comunicación entre Objective-C y C#.

Actividad 3
Palabras Clave: DTO, Usuario. 16/03/2021
Página 8 de 27
.NET Core
El núcleo de la aplicación contiene el modelo de negocio, que incluye entidades,

servicios e interfaces. Estas interfaces incluyen abstracciones para las operaciones
que se llevarán a cabo mediante la infraestructura, como el acceso a datos, el acceso
al sistema de archivos, las llamadas de red, etc. En ocasiones los servicios o
interfaces definidos en este nivel tendrán que trabajar con tipos sin entidad que no
tienen dependencias en la interfaz de usuario o la infraestructura. Estos se pueden
definir como Objetos de transferencia de datos (DTO) simples.

Actividad 3
16/03/2021
Página 9 de 27
Tipos de núcleo de la aplicación
- Entidades (las clases de modelo de negocio que se conservan)

Palabras Clave: Migration,Enity Framework.
- Interfaces
- Servicios
- DTO
El proyecto de infraestructura incluye normalmente las implementaciones de acceso

a datos. En una aplicación web ASP.NET Core típica, estas implementaciones
incluyen DbContext de Entity Framework (EF), todos los objetos Migration de EF
Core que se hayan definido y las clases de implementación de acceso a datos. La
manera más común de abstraer el código de implementación de acceso a datos
consiste en usar el modelo de diseño de repositorio.
In addition to data access deployments, the infrastructure project must contain

deployments of services that have to interact with infrastructure interests. These
services must implement interfaces defined at the core of the application, so the
infrastructure must have a reference to the application core project.
Tipos de infraestructura
- Tipos de EF Core (DbContext, Migration)

- Tipos de implementación de acceso a datos (Repositorios)
- Servicios específicos de la infraestructura (por ejemplo, FileLogger o
SmtpNotifier)
La capa de interfaz de usuario en una aplicación ASP.NET Core MVC es el punto

de entrada para la aplicación. Este proyecto debe hacer referencia al proyecto
Application Core y sus tipos deben interactuar con la infraestructura estrictamente a

Actividad 3
16/03/2021
Página 10 de 27
través de las interfaces definidas en Application Core. En la capa de interfaz de

Palabras Clave: Controlador, Dependencia.
usuario no se debe permitir la creación de instancias directas o llamadas estáticas a
los tipos de la capa de infraestructura.
Tipos de capa de interfaz de usuario
- Controladores
- Filtros
- Vistas
- ViewModels
- Inicio
La clase Startup es responsable de configurar la aplicación y de conectar los tipos de

implementación a las interfaces, lo que permite que la inserción de dependencias
funcione correctamente en tiempo de ejecución.
Diferencias entre otros Frameworks
- La plataforma .NET tradicional, con la que podemos crear todo tipo de

aplicaciones. Estable, muy utilizada y con pocos cambios en el horizonte.
- La plataforma .NET Core: la tecnología de futuro de Microsoft. Ya en su
versión 2 y estabilizada, poco a poco irá tomando cuota de mercado y será
más y más utilizada, aunque de momento va por detrás de la anterior.
Multiplataforma y utilizada sobre todo a desarrollo Web.
- Xamarin: la última adquisición pero con muchos años de historia detrás.
Permite crear aplicaciones multi-plataforma sobre todo pensando en

Actividad 3
16/03/2021
Página 11 de 27
Palabras Clave:para
desarrollo Nativo, Transpilado.
móviles (iOS, Android), pero también para Mac, Windows 10
y en breve para Linux. En muy poco tiempo ha crecido como la espuma.
React Native
¿Qué es React Native?
React Native es un framework de programación de aplicaciones nativas

multiplataforma que está basado en JavaScript y ReactJS.
Esta definición puede resultar un poco simple, por lo que para aclarar mejor las
ideas y saber mejor lo que es este framework, vamos a ver lo que no es React
Native :
 No es un framework que nos permite ejecutar aplicaciones que tenemos ya

desarrolladas con ReactJS en un dispositivo móvil.
 No funciona como aplicaciones con PhoneGap o Cordova que nos permiten

tener una página web y genera un webview, sino que genera una aplicación
nativa con un rendimiento casi similar al nativo.
 No va a convertir todo el código una aplicación nativa , transpilado con Java
o con ObjectiveC.
 You won't help but have to touch the code on both Android and iOS, even if
you allow you to integrate all the parts you have of both systems into a single
application, with some differences but with a part of the code shared and
written in JavaScript, using JSX to define the interfaces.

Actividad 3
16/03/2021
Página 12 de 27
Palabras Clave: API, WebView.
Funcionamiento
React Native usa API nativas como un puente (bridge) para representar
componentes en dispositivos móviles. Por ejemplo, para los componentes de
Android, utiliza las API de Java e invoca la API de Objective-C para renderizar en
iOS. Es por eso, que React Native procesa algunos componentes de código con API
nativas, a diferencia de otros marcos multiplataforma como PhoneGap, que procesa
código a través de WebView, un motor móvil. Si bien el enfoque de WebView
reduce en gran medida el rendimiento, React Native se comunica con componentes
específicos para iOS o Android y presenta el código en las API nativas de forma
directa e independiente. Al hacer eso, React usa un hilo separado de la interfaz de
usuario, que también aumenta la puntuación de rendimiento.
Los módulos nativos desempeñan otro papel importante. Actualmente, React

proporciona un conjunto de módulos nativos escritos en Objective-C y Java listos
para usar. Estos módulos no pueden reutilizarse en dos plataformas, pero apuntan a
un mayor rendimiento en operaciones computacionalmente pesadas como la edición
de imágenes o la reproducción de videos. Básicamente, su equipo puede aplicar los
módulos existentes o, si tienen experiencia en Java y Objective-C, escribir módulos
personalizados ellos mismos.
Palabras Clave: MVC, Sevices.
Descripción general de la arquitectura
FilledStacks propone utilizar una arquitectura de estilo MVVM . La vista suele ser

un diseño de widget para una pantalla de su aplicación. Sin embargo, no contiene
ninguna lógica o estado. Eso está contenido en el modelo de vista, que no conoce

Actividad 3
16/03/2021
Página 13 de 27
ningún detalle específico sobre la vista. La mayoría de las aplicaciones necesitan

almacenar y acceder a datos y eso es manejado por Servicios, que son solo clases de
Dart que abstraen los detalles para que los Modelos de Vista no tengan que
preocuparse por cómo se hace.
You create a new view model for each screen in your app. However, the Services
are globally accessible, so they remain the same. A multi-screen application would
be structured in this way:

Actividad 3
16/03/2021
Página 14 de 27
En términos prácticos, los archivos podrían estar organizados de esta manera:

Actividad 3
16/03/2021
Página 15 de 27
Sin embargo, eres libre de utilizar una organización diferente. A FilledStacks le

gusta poner los modelos de vista en la corecarpeta (al menos en el tutorial original).
Creo que prefiero mantenerlos cerca de las vistas que los usan, pero por lo general
cambio de opinión con cada nueva aplicación que hago. Lea este artículo para
obtener más ideas sobre esto. Puede cambiar más tarde cuando surja la necesidad.
Todo lo que se necesita es mover los archivos y cambiar las rutas de importación.

Actividad 3
Palabras Clave: Bloc, Mapear. 16/03/2021
Página 16 de 27
Flutter
Flutter Bloc
Un BloC es un componente intermediario entre las vistas y nuestro modelo, como

puede ser el presenter cuando utilizamos MVP o el view model al utilizar MVVM.
El modelo es un concepto bastante amplio dependiendo del tamaño y arquitectura de
tu aplicación. Puede ser desde nuestra capa de datos en una arquitectura simplificada
hasta nuestro dominio o hexágono si utilizamos Clan Architecture o Hexagonal
Architecture. Al igual que Redux, BloC se basa en conceptos de programación
reactiva utiliando el patrón observer pero es bastante más simple y por lo tanto, más
versátil. El patrón BLoC inicialmente, como lo presentó Google, tiene varios
objetivos:
 Centralizar la lógica de negocio
 Centralizar cambios de estado
 Mapear al formato que necesita la vista
For each view (component or widget) or concept important enough we will have its
corresponding BloC. For example, the view (component or widget) that represents a
page or represents state that is shared by more than one view would be examples
where it makes sense to create a BLoC.

Actividad 3
Palabras Clave: Provider, Consumers. 16/03/2021
Página 17 de 27
Flutter Provider
Provider, es un paquete que ha sido lanzado recientemente (en Google I/O) el cual
tiene como función, permitirnos manejar el estado de nuestra app. Como sabemos,
en Flutter para poder construir una App, y alterar el aspecto visual de la misma,
debemos trabajar con el “Estado de la App”. La forma más sencilla de hacer esto, es
mediante el uso de “StateFul Widgets” y la función de “setState”. Eso puede
funcionar para alguna aplicación muy pequeña, sin embargo, cuando estamos
construyendo una app que contiene varias pantallas y hay que acceder a esas
propiedades en todas, el proceso se vuelve muy complejo.

Actividad 3
Palabras Clave: Clases, JQuery. 16/03/2021
Página 18 de 27
IONIC
Ionic Framework, un marco de desarrollo que junto con AngularJS nos facilitará
sobremanera la tarea de creación de aplicaciones
Desarrollado sobre AngularJS y lanzada su primera beta en el 2013, Ionic utiliza su

base para proporcionarnos la estructura de aplicación mínima sobra la que poder
comenzar a trabajar.
Sistema de Clases
Ni AngularJS ni Ionic son marcos de desarrollo orientado a objetos JavaScript , por

lo tanto no harán uso de un sistema de clases. Esta característica puede estar tanto en
el lado de los pros como en el de los contras para la valoración de su
implementación en un proyecto.
Control DOM
AngularJS incluye j qLite, una pequeña versión ultraligera de jQuery que permite la
gestión de DOM (Document Object Model, Modelo de Objetos del Documento) de
forma compatible en la inmensa mayoría de navegadores, dejando una pequeñísima
huella en los mismos haciendo la app mucho más ligera y eficiente.
Interfaz y Temas
We enter the strong field of Ionic, where its simplicity stands out for development.
In a similar way (not the same) as Google does with Android, Ionic seeks to make
use of the capabilities offered by HTML5 and CSS3 to deliver above all-fast user
experiences.
Widgets

Actividad 3
Palabras Clave: Responsive, HTML. 16/03/2021
Página 19 de 27
Los componentes de Ionic son tremendamente simples. Se trata de elementos HTML

personalizados que incorporan controladores para complementar configuración e
interacción. A diferencia de otros framework donde podemos encontrar widgets más
complejos, Ionic ofrece bloques de código más simples y orientados a que sean
combinados para ofrecer una interfaz de usuario más rica, intuitiva y atractiva para
el público receptor.
Responsive Design
Ionic por supuesto aprovecha los principios del diseño web Responsive para adaptar
el contenido al tamaño de pantalla o densidad de píxeles ofrecidas por el destino,
optimizando así los recursos empleados y prestándose a soportar prácticamente
todos los dispositivos del mercado.

Actividad 3
16/03/2021
Página 20 de 27

Actividad 3
16/03/2021
Página 21 de 27

Actividad 3
Palabras Clave: TypeScript, Templates. 16/03/2021
Página 22 de 27
Angular
Angular es una plataforma y framework utilizado para escribir aplicaciones web en

HTML y Typescript. Esta cuenta con diferentes librerías; muchas son parte del Core
y son necesarias para el funcionamiento correcto de nuestras aplicaciones, y otras son
opcionales.
Para crear nuestras aplicaciones con Angular, generamos templates con HTML y
controlamos estos mismos templates con lógica creada en nuestros componentes, que
serán exportados como clases. Así mismo, agregamos lógica en nuestros servicios
para manejar la data que nuestra aplicación tendrá y finalmente “encapsulamos”
nuestros componentes y servicios en módulos o NgModules.
Then we start our application by bootstraping our root module. Angular takes control
and displays content in the browser, reacting to the interaction of users using the app
according to the instructions we gave it in our logic (code).Por supuesto hay mucho
más detrás de esto. Podemos analizar cada uno de los actores en nuestra aplicación.
Módulos
Un módulo o NgModule declara un contexto de compilación para un conjunto de

Palabras Clave: root module, modulo.
componentes. Un NgModule puede asociar sus componentes con código relacionado,
como servicios, para formar unidades funcionales.
Cada aplicación generada con Angular cuenta con un root module o modulo de raíz
llamado convencionalmente AppModule, el cual provee el mecanismo de arranque

Actividad 3
16/03/2021
Página 23 de 27
que inicia nuestra aplicación. Una aplicación generalmente contiene varios módulos
funcionales.
Como en Javascript (y en muchos lenguajes con programación funcional), un módulo

puede importar funcionalidades de otros módulos, y exportar sus propias
funcionalidades.
Una buena práctica es crear diferentes módulos para tu aplicación y organizar tu

código de manera funcional, para poder crear aplicaciones ordenadas cuando son
complejas y escalables. Además, de esta forma podremos sacar provecho a lazy
loading — consiste en cargar solo los módulos que sean necesarios — y así mejorar
el rendimiento de nuestra aplicación.
Componentes
Cada aplicación de Angular tiene al menos un componente. Al igual que el root

module, existe el root component que conecta una jerarquía de componentes con el
DOM. Cada componente define una clase que contiene data y lógica, y está
Palabras Clave: binding, data.
vinculada a nuestro template HTML.
Templates, directivas y data binding
Un template es una mezcla de HTML con Angular markup — tags personalizados de

Angular — . Las directivas de un template proveen lógica de programación, y hacen
un data binding (enlaza la lógica que contiene la data de tu aplicación) con las vistas.
Hay dos tipos de data-binding:

Actividad 3
16/03/2021
Página 24 de 27
 Event binding o enlace de eventos, que responden a la interacción del

usuario al modificar algún input en la aplicación, actualizando la data.
 Property binding o enlace de propiedades, que permite agregar valores

modificados desde nuestra data, a nuestro HTML.
Antes de que se muestre una vista, Angular evalúa las directivas y resuelve la sintaxis
del data binding en el template para modificar los elementos HTML y el DOM,
según los datos y la lógica de nuestra aplicación. Angular cuenta con two-way data
binding, que significa que los cambios en el DOM también se reflejan en nuestra
data.
Servicios e Inyección de Dependencias 💉
All the data or logic that is not directly associated with a view and that you want to
use in different parts of your application and between different components, can be
written in a service. Like a component, services are exported as classes. The services
Palabras Clave: Inyección, Dependency.
have the decorator @Injectable() that provides metadata that allows your services to
be injected into components such as dependencies.
Dependency injection o Inyección de Dependencias te permite manejar las clases de

tus componentes de forma ligera y eficiente. No obtienen datos del servidor, validan
los user input o logs directamente en la consola; delegan la obtención de datos a los
servicios.

Actividad 3
16/03/2021
Página 25 de 27

Actividad 3
Palabras Clave: Aplicación Frontend, Backed. 16/03/2021
Página 26 de 27
Conclusión
Como bien sabemos una arquitectura se denota por los patrones y las técnicas que se
utilizan para diseñar y desarrollar aplicaciones. La arquitectura le proporciona un plan y las
prácticas recomendadas que debe seguir al momento de diseñar una aplicación, de modo
que obtenga una aplicación bien estructurada.
Siempre que hablemos de arquitectura habrá servicios de frontend y de backend. El

desarrollo de frontend se refiere a la experiencia del usuario con la aplicación, mientras que
el desarrollo de backend implica proporcionar acceso a los datos, los servicios y otros
sistemas actuales que permiten el funcionamiento de la aplicación.
Es por esto que debemos saber cómo atacar y adaptarnos a cada una de estas tecnologías
hibridas desde el punto de vista a gran escala de frontend y backed.

Actividad 3
16/03/2021
Página 27 de 27
Conocido al español y latino como «frontend» y en su traducción algo así

FrontEnd como frente o fachada final. Es una especialidad para el desarrollo web, que
trabaja la interfaz web
El backend es la parte del desarrollo web que se encarga de que toda la lógica
de una página web funcione. Se trata del conjunto de acciones que pasan en
Backend
una web pero que no vemos como, por ejemplo, la comunicación con el
servidor.
The word native has to do with where you're from. You're native to the
Native
country where you were born, and places have native plants and animals too.
Document Object Model o DOM ('Modelo de Objetos del Documento' o
DOM
'Modelo en Objetos para la Representación de Documentos')
Binding The power to bind, imprison or otherwise stop targets. Opposite to Freeing.
Localizar y representar gráficamente la distribución relativa de las partes de
Mapear
un todo
La interfaz de programación de aplicaciones, conocida también por la sigla
API
API,
Palabras Clave: en inglés, application
compilador, programming interface
nulo, idea.
Enity
Framework Permite a los desarrolladores programar con bases de datos relacionales
usando objetos .NET y Language Integrated Query (LINQ).
Glosario


DAH 5B 6pm U1 Actividad#3 Equipo#2 DeluxeTeam Bryan Mahomedalid Lopez Aguirre

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

DAH 5B 6pm U1 Actividad#3 Equipo#2 DeluxeTeam Bryan Mahomedalid Lopez Aguirre

Cargado por

Copyright:

Formatos disponibles

Actividad 3

Investigar acerca de la arquitectura de las aplicaciones multiplataforma (hibrido).20

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

1.3 Comparativa entre aplicaciones híbridas nativas.

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

A) Plasmar en al menos una hoja tamaño oficio o mejor aún

NetCore/Xamarin, React/JavaScript, Flutter/Dart, Ionic/Angular.

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

B) En esta investigación se deberá incluir al igual que

C) Independiente al diseño de la arquitectura de las 4

En el diagrama se muestra la arquitectura general de una aplicación Xamarin

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Las aplicaciones Xamarin.Android se compilan desde C# en lenguaje intermedio

Las aplicaciones Xamarin.iOS se compilan Ahead-of-Time (AOT) de forma

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

El núcleo de la aplicación contiene el modelo de negocio, que incluye entidades,

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Tipos de núcleo de la aplicación

- Entidades (las clases de modelo de negocio que se conservan)

El proyecto de infraestructura incluye normalmente las implementaciones de acceso

In addition to data access deployments, the infrastructure project must contain

- Tipos de EF Core (DbContext, Migration)

La capa de interfaz de usuario en una aplicación ASP.NET Core MVC es el punto

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

través de las interfaces definidas en Application Core. En la capa de interfaz de

Tipos de capa de interfaz de usuario

La clase Startup es responsable de configurar la aplicación y de conectar los tipos de

Diferencias entre otros Frameworks

- La plataforma .NET tradicional, con la que podemos crear todo tipo de

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

¿Qué es React Native?

React Native es un framework de programación de aplicaciones nativas

 No es un framework que nos permite ejecutar aplicaciones que tenemos ya

 No funciona como aplicaciones con PhoneGap o Cordova que nos permiten

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Los módulos nativos desempeñan otro papel importante. Actualmente, React

Palabras Clave: MVC, Sevices.

Descripción general de la arquitectura

FilledStacks propone utilizar una arquitectura de estilo MVVM . La vista suele ser

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

ningún detalle específico sobre la vista. La mayoría de las aplicaciones necesitan

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

En términos prácticos, los archivos podrían estar organizados de esta manera:

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Sin embargo, eres libre de utilizar una organización diferente. A FilledStacks le

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Un BloC es un componente intermediario entre las vistas y nuestro modelo, como

 Centralizar la lógica de negocio

 Centralizar cambios de estado

 Mapear al formato que necesita la vista

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Desarrollado sobre AngularJS y lanzada su primera beta en el 2013, Ionic utiliza su

Ni AngularJS ni Ionic son marcos de desarrollo orientado a objetos JavaScript , por

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Los componentes de Ionic son tremendamente simples. Se trata de elementos HTML

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Angular es una plataforma y framework utilizado para escribir aplicaciones web en

Un módulo o NgModule declara un contexto de compilación para un conjunto de

Desarrollo de aplicaciones Hibridas Instituto Tecnológico de Tepic / ISC

Como en Javascript (y en muchos lenguajes con programación funcional), un módulo