Me 3
Me 3
Me 3
UNIDAD Nº II
DESARROLLO DE APLICACIONES DISTRIBUIDAS EN OMNICANAL.
www.iplacex.cl
SEMANA 3
Introducción
Estimados alumnos sean todos bienvenidos a la semana 3, en esta semana veremos los
contenidos relacionados a “Desarrollo de Aplicaciones Distribuidas en Omnicanal” para
poder dar funcionalidad a nuestras aplicaciones desarrolladas en Ionic framework.
Hoy en día nos movemos con distintos dispositivos, más de alguno debe tener un
dispositivo inteligente, ya sea Tablet, Smartphone, autos Inteligentes, etc.. Artículos que
hace una década atrás eran impensable que tuvieran las características actuales. Es por
este motivo que nace la necesidad de orientar el desarrollo de aplicaciones hacia
distintas plataformas.
www.iplacex.cl 2
Ideas Fuerza
Multiplataforma: hoy en día existen distintas plataformas y sistemas operativos, entre
los dispositivos que tenemos actualmente pueden ser variados, por ejemplo: teléfonos
inteligentes (Android, IOS), Computadoras de escritorio (Windows, Linux, MacOs),
incluso Autos con sistema operativo Android, es por esto que nace la necesidad de
desarrollar software orientado a multiplataforma.
Módulo: Los módulos son estructuras dentro de Angular e Ionic que nos sirven para
estructurar y tener una mejor organización de nuestro código, nos permite componentes
de forma interna y componentes externos.
REST: Es una interfaz que nos permite conectar varios sistemas mediante protocolo
HTTP, rest es agnóstico sobre cómo está programada la plataforma en sí, sino que su
fin es ser un intermediario de comunicación, podemos comunicar mediante un método
post el inicio de sesión de una aplicación, con get poder obtener un resultado de un
cálculo o la suma del total de múltiples productos etc.
www.iplacex.cl 3
Desarrollo
1. Multiplataforma:
Es la capacidad de un software de ser soportado en múltiples plataformas informáticas.
Cross-plataform en inglés (distintos sistemas operativos)
El software multiplataforma se puede dividir en dos tipos; uno que requiere compilación
o compilación individual para cada plataforma que admite, y el otro que se puede ejecutar
en cualquier plataforma sin preparación especial, por ejemplo, software escrito en un
lenguaje interpretado o bytecode portátil recompilado para el cual los intérpretes o el
tiempo de ejecución de los paquetes son componentes comunes o estándar de todas las
plataformas de Sistemas Operativos.
www.iplacex.cl 4
Las Plataformas de Software son un sistema operativo o un entorno de programación,
aunque más comúnmente es una combinación de ambos. Una excepción notable es
Java, que utiliza una máquina virtual (JVM) independiente del sistema operativo para su
código compilado, conociendo el mundo de Java como bytecode.
2. Multidispositivo:
La revolución tecnológica ha desarrollado unas habilidades impensables hasta ahora.
Nos hemos convertido en usuarios multidispositivo y multipuntillo. En la actualidad,
vivimos en un mundo multipantalla que provoca que el comportamiento de los
consumidores esté en continuo cambio: el 90% de las interacciones con los medios son
multipantalla.
www.iplacex.cl 5
Estas son las principales conclusiones que se desprenden del estudio llevado a cabo por
Gfk, a petición de Facebook; realizado sobre una muestra de más de 2000 usuarios
(2018).
Lo más curioso es la capacidad que han desarrollado estos usuarios para compatibilizar
el uso multidispositivo. Una capacidad que ha generado nuevos hábitos de consumir
información y realizar tareas, cambiando indistintamente de uno a otro, durante las
distintas fases de la actividad. El 40% de los participantes en el estudio admite que
cambia de dispositivo a lo largo del proceso que están realizando; bien en función de la
tarea. O bien por imperativo del entorno. De ahí la necesidad de que las empresas
ofrezcan una experiencia integrada a través de todos los dispositivos.
El 54% de los usuarios que utilizan 2 dispositivos admite que cambia de uno a otro en
mitad de alguna tarea. Como, por ejemplo, busca información sobre un producto con el
smartphone, y más tarde decide ver vídeos o más fotos sobre el mismo en la tablet. Este
comportamiento se evidencia todavía más en el caso de los usuarios que disponen de 3
o más dispositivos, donde el 73% de ellos pasa con frecuencia de uno a otro.
Estamos ante una nueva generación de consumidores, que presenta nuevos hábitos de
navegación, de demanda de contenidos y un nuevo comportamiento online. Su demanda
de información es constante y continua, desempeñando unas funciones multitarea ante
las que las empresas deben saber responder. El éxito dependerá de su capacidad para
adaptarse.
www.iplacex.cl 6
3. Omnicanal:
• Ubicaciones físicas
• Páginas web
• Redes sociales
• Chat en vivo
• Comunicación telefónica
Los orígenes del Omnicanal se remontan al uso de Best Buy de centrarse en el cliente
para competir con el departamento de electrónicos de Walmart en 2003. La compañía
creo un enfoque que se entró alrededor del cliente, tanto en la tienda como en la línea
de productos, mientras que proporcionaba un apoyo post-venta. Omnicanal fue acuñado
www.iplacex.cl 7
como una forma de Comercio Ensamblado y se extendió a las industrias de servicios de
salud y financieras.
• Aumenta las ventas: según Harvard Business Review, los clientes que utilizan
más de 5 canales gastan aproximadamente un 9% más en una tienda que los que
acceden a uno solo.
www.iplacex.cl 8
4. Servicios REST
REST es una interfaz que se utiliza para conectar varios sistemas basándose en
protocolos HTTP y nos sirve para obtener y generar datos y operaciones, devolviendo
esos datos en formatos muy específicos, como XML y JSON. El formato más utilizado
actualmente es JSON, ya que es más ligero y legible en comparación al formato XML.
Principios de REST
• Todos tienen una URL: Todo lo que se ve en internet tiene una URL, imágenes,
videos, archivos de música, páginas de internet, sin ella no se podría acceder a
su información. Las URL de los servidores deben ser intuitivas.
www.iplacex.cl 9
• Comunicaciones sin estado: Los servicios web REST necesitan escalar para
poder satisfacer una demanda que tiene un constante crecimiento, por lo que se
utilizan servidores intermedios. Para mejorar la escalabilidad es necesario que los
clientes envíen peticiones completas e independientes, es decir, se deben enviar
peticiones que incluyan todos los datos necesarios para cumplir con el pedido, de
esta manera los componentes de los servidores intermedios pueden redireccionar
y gestionar la carga sin mantener el estado localmente entre las peticiones.
www.iplacex.cl 10
respuestas a las peticiones se hagan siempre en el lenguaje de intercambio de
información usado, normalmente XML o JSON.
5. RESTFUL
Características:
• Para las operaciones anteriores se necesita de una URL y un método HTTP para
acceder a ellas.
www.iplacex.cl 11
6. URI RESTful
• Los nombres de URI no deben implicar una acción, por lo tanto, debe evitarse
usar verbos en ellos.
• Deben ser únicas, no debemos tener más de una URI para identificar un mismo
recurso.
7. Módulos
Un módulo es uno de los elementos principales con los que podemos organizar el código
de las aplicaciones en Angular. Sin embargo, en lugar de colocar el código de todos los
componentes, directivas o pipes en el mismo módulo principal, lo adecuado es
desarrollar diferentes módulos y agrupar distintos elementos en unos u otros. El orden
se realizará de una manera lógica, atendiendo a nuestras propias preferencias, el modelo
de negocio o las preferencias del equipo de desarrollo.
www.iplacex.cl 12
Anatomía de un módulo
Una vez creado nuestro proyecto dentro de la carpeta “src/app” se crea un subdirectorio
con el mismo nombre del módulo generado. Dentro encontraremos el archivo con el
código del módulo.
Da igual crear el nombre del módulo como “modulo1” o “Modulo1” con la primera letra en
mayúscula. El CLI aplica las convenciones de nombres más adecuadas y como los
módulos son clases internas les colocará en el código la primera letra siempre en
minúscula. Y a los nombres de los directorios y archivos son otra cosa y no se
recomienda usar mayúsculas, por los que los nombrara siempre con minúscula.
www.iplacex.cl 13
Si abrimos el código del módulo generado “modulo1.module.ts” encontraremos como se
define un módulo en Ionic la parte más importante es el decorador de módulos que se
llama @NgModule.
declarations: Las vistas que pertenecen a tu módulo. Hay 3 tipos de clases de tipo vista:
componentes, directivas y pipes.
imports: Otros módulos cuyas clases exportadas son requeridas por templates de
componentes de este módulo.
www.iplacex.cl 14
Toda aplicación de Angular tiene al menos un módulo de Angular, el módulo principal (o
root module). Por convenio se le llama AppModule y se encuentra en el archivo
app.module.ts. La clase AppModule sirve para cargar la aplicación e indicar todas sus
dependencias. Como el resto de módulos, se declara con el decorador @NgModule.
8. Anatomía de un Componente
Hasta ahora el componente que hemos creado han sido dentro de un módulo principal,
pero si queremos podemos especificar otro modulo a crear, mediante el comando:
Nos generará una carpeta dentro del módulo indicado, en la que colocará todos los
archivos del componente recién creado.
www.iplacex.cl 15
El comando ingresado anteriormente modificara el código del módulo, agregando
automáticamente el import del componente y su referencia en el array “declarations”.
Ahora el código del módulo “modulo1.modules.ts” tendrá una forma distinta en caso de
que esto no se actualice automáticamente en el código deberemos hacerlo de forma
manualmente declarado el componente previamente creado en la notación de
“declarations”
www.iplacex.cl 16
Para declarar el componente de forma manual, deberemos simplemente en el arreglo de
“declarations” agregar la clase de nuestro componente, lo podemos visualizar en el
archivo “componente1.components.ts”
Para ver como se llama la clase nos tenemos que fijar en la estructura que dice “export
class Componente1Component”
www.iplacex.cl 17
9. Exportar un Módulo
Para poder realizar la exportación de uno de nuestros módulos, tendremos que agregar
nueva información al decorador del módulo dentro del array la palabra exports.
www.iplacex.cl 18
10. ¿Cómo utilizar nuestro componente en otros módulos?
Tenemos que hacer import del módulo de TypeScript, para que conozca el módulo
debemos importarlo primero en el archivo app.modules.ts
www.iplacex.cl 19
Luego en el decorador del módulo principal en el arreglo imports agregamos nuestro componente.
Para utilizar el componente creado vamos a colocar en el template por defecto ubicado
en la raíz el selector declarado en el componente creado, el selector del componente es
el tag o etiqueta que se debe utilizar para mostrar nuestro componente por lo cual nos
dirigimos al archivo “componente1.components.ts y dentro en el decorador del
componente encontraremos una propiedad que se llama selector: ‘app-componente1’
www.iplacex.cl 20
www.iplacex.cl 21
Como última instancia nos dirimimos al archivo por defecto html home.page.html e
ingresamos la etiqueta <app-componente1> </app-componente1>
www.iplacex.cl 22
11. Historia de las API
Las API surgieron en los principios de la informática, mucho antes que las computadoras
personales. En esa época, una API normalmente se usaba como biblioteca para los
sistemas operativos, casi siempre estaban habilitadas localmente en los sistemas en los
que operaban, aunque a veces pasaban mensajes entre las computadoras centrales.
Después de casi 30 años, las API se expandieron más allá de los entornos locales. A
principios del año 2000, ya eran una tecnología importante para la integración remota de
datos.
Las API permiten que las aplicaciones y servicios se comuniquen con otros, sin
necesidad de saber cómo esta implementados. Esto simplifica el desarrollo de las
aplicaciones y permite ahorrar tiempo y dinero. Las API otorgan flexibilidad; simplifican
el diseño, la administración y el uso de las aplicaciones, y proporcionan oportunidades
de innovación, lo cual es ideal para diseñar nuevas aplicaciones.
A veces, las API se consideran como contratos, con documentación que representan un
acuerdo entre las partes: si una de las partes envía una solicitud remota con cierta
estructura en particular, esa misma estructura determinará como responderá el software
de la otra parte.
Debido a que simplifican la forma en que los desarrolladores integran los elementos de
las aplicaciones nuevas en una arquitectura actual, las API permiten la colaboración
entre el equipo comercial y el de TI. Las necesidades comerciales suelen cambiar
rápidamente en respuesta de los mercados digitales en constante cambio, donde la
competencia puede modificar un sector entero con una aplicación nueva. Para seguir
siendo competitivos, es importante admitir la implementación y el desarrollo rápido de
servicios. El desarrollo de aplicaciones nativas de la nube es una forma identificable de
www.iplacex.cl 23
aumentar la velocidad de desarrollo y se basa en la conexión de una arquitectura de
aplicaciones de microservicios a través de las API.
Las API son un medio simplificado para conectar su propia infraestructura a través del
desarrollo de aplicaciones nativas en la nube, pero también le permiten compartir sus
datos con clientes y otros usuarios externos. Las API publicas representan un valor
comercial único porque simplifican y amplían la forma en que se con otros servicios,
pueden rentabilizar sus datos (un ejemplo conocido es la API de Google Maps).
Por ejemplo, una empresa distribuidora de libros. Podría ofrecer a los clientes una
aplicación que les permita a los empleados de la librería verificar la disponibilidad de los
libros con el distribuidor. El desarrollo de esta aplicación podrá ser costoso, estar limitado
por la plataforma y requerir mucho tiempo de desarrollo y mantenimiento continuo.
Otra aplicación es la distribución de los libros que proporcionara una API para verificar
la disponibilidad en inventario. Existen varios beneficios de este enfoque:
• Permite que los clientes accedan a los datos con una API que les ayude a añadir
información sobre su inventario en un solo lugar.
www.iplacex.cl 24
• La distribuidora de libros podría realizar cambios en su sistema interno sin afectar
a los clientes, siempre y cuando el comportamiento de la API fuera el mismo.
• Con una API, los desarrolladores que trabajan para la distribuidora de libros, los
vendedores o los terceros podrían desarrollar una aplicación para ayudar a los
clientes a encontrar libros que necesitan. Esto podría dar como resultado mayores
ventas u otras oportunidades comerciales.
En resumen, las API permite habilitar acceso a recursos y, al mismo tiempo mantener la
seguridad y el control. Como habilitar acceso y a quienes dependan de él. La seguridad
de las API tiene que ver con que se gestionen bien. Para conectarse a las API y crear
aplicaciones que utilicen los datos o las funciones que estas ofrecen, se puede utilizar
una plataforma de integración distribuida que conecte todos los elementos, incluidos los
sistemas heredados y el internet de las cosas(IoT).
Privado: Las API solo se pueden usar internamente, así que las empresas tienen un
mayor control sobre ellas. Esto les da a las empresas un mayor control sobre su API.
De partners: Las API se comparten con partners empresariales específicos, lo cual puede
ofrecer flujos de ingresos adicionales, sin comprometer la calidad. Esto puede
proporcionar flujos de ingreso adicionales, sin comprometer la calidad.
Publico: Todos tienen acceso a las API, así que otras empresas pueden desarrollar API
que interactúen con la que creamos, Esto permite que tercero desarrollen aplicaciones
que interactúan con la API.
www.iplacex.cl 25
Conclusión
Hoy en día existen distintas plataformas, y distintos sistemas operativos en distintos
lugares, es por esto que es indispensable orientar nuestras aplicaciones a distintas
plataformas, y con la ayuda de Angular e Ionic lograr el desarrollo de forma rápida y
ahorrando costes de mantención.
Con la ayuda de servicios REST, podremos comunicarnos con una api, y desde la api
comunicar con nuestra aplicación y backend.
www.iplacex.cl 26
Bibliografía
David Booth, Hugo Haas. (2004). Web Services Architecture. 2021, de W3C Sitio web:
https://www.w3.org/TR/ws-arch/
Reclu IT. (2019). Historia y evolución de las API. 2021, de Reclu IT. Sitio web:
https://recluit.com/historia-y-evolucion-de-las-api
www.iplacex.cl 27
www.iplacex.cl 28