Aplicaciones web: desarrollo front-end y back-end, multiplataforma

APLICACIONES WEB. DESARROLLO FRONT-END Y EN SERVIDOR, MULTIPLATAFORMA Y MULTIDISPOSITIVO. LENGUAJES: HTML, XML Y SUS DERIVACIONES. NAVEGADORES Y LENGUAJES DE PROGRAMACIÓN WEB. LENGUAJES DE SCRIPT

PREPARACIÓN OPOSICIONES TÉCNICOS AUXILIARES DE INFORMÁTICAB3T8

ÍNDICE

• APLICACIONES WEB, NATIVAS, HÍBRIDAS Y PWA

  1. Aplicaciones NATIVAS.

  2. Aplicaciones WEB

  3. Aplicaciones HÍBRIDAS

  4. Aplicaciones PWA

  5. Comparativa tipos de aplicaciones móviles.

• ARQUITECTURAS PARA APLICACIONES WEB

  1. MVC (Modelo-Vista-Controlador)

  2. MVP (Modelo-Vista-Presentador)

  3. MVVM (Modelo-Vista-VistaModelo)

  4. MVW (Modelo-Vista-Whatever)

  5. Flux

• DESARROLLO FRONT-END Y EN SERVIDOR, MULTIPLATAFORMA Y MULTIDISPOSITIVO

  1. Front-end

  2. Back-end.

  3. Stacks disponibles.

• LENGUAJES: HTML, XML Y SUS DERIVACIONES

  1. HTML (HyperText Markup Language)

  2. XML (extensible Markup Language)

  3. XSL (extensible Stylesheet Language)

  4. XOP (XML-binary Optimized Packaging)

  5. CSS

  6. Web semántica

• NAVEGADORES Y LENGUAJES DE PROGRAMACIÓN WEB

  1. Navegadores web.

  2. Lenguajes de programación web

  3. Renderizado de páginas webs

• LENGUAJES DE SCRIPT

PABLO ARELLANO www.theglobeformacion.com Página 2

APLICACIONES WEB

APLICACIONES WEB, NATIVAS, HÍBRIDAS Y PWA

Una aplicación web es un tipo de aplicación alojada en un servidor web que es accesible a través de un navegador web.

Tipos de aplicaciones:

• Nativas.

• Web.

• Híbridas.

• PWA.

Aplicaciones NATIVAS

Una aplicación nativa es la que se desarrolla de forma específica para un determinado sistema operativo (Windows, macOS, S.O. para móviles).

Cada una de las plataformas (Android o iOS por ejemplo) tienen un sistema diferente, por lo que si queremos que una app esté disponible en todas las plataformas se deberá desarrollar la misma app varias veces, una para cada plataforma.

PABLO ARELLANO www.theglobeformacion.com Página 3B3T8

APLICACIONES WEB

Tecnologías utilizadas en aplicaciones nativas

Tecnologías utilizadas:

• Las apps para iOS se desarrollan con lenguaje Objective-C y Swift. El IDE utilizado es Xcode.

• Las apps para Android se desarrollan con lenguaje Java y XML. Actualmente el lenguaje Kotlin ha cobrado mucha fuerza en la comunidad de desarrolladores, utilizando el IDE IntelliJ IDEA. Android Studio es el IDE desarrollado por Google, con un uso elevado.

Ventajas de las aplicaciones nativas

Ventajas:

• Adaptación perfecta al dispositivo concreto, siendo posible acceder a todas las características del hardware del dispositivo: cámara, GPS, agenda, almacenamiento ...

• Ofrecen la mejor experiencia de usuario.

• Rendimiento muy alto.

• No necesitan conexión a internet para funcionar.

• La descarga e instalación de estas apps se realiza a través de las tiendas de aplicaciones.

• Envío de notificaciones o avisos a los usuarios (notificaciones push o mobile push).

• / Actualización constante de la app.

Inconvenientes de las aplicaciones nativas

Inconvenientes:

• Costes y tiempos de desarrollo elevado ya que hay que desarrollar la aplicación para cada plataforma concreta usando las tecnologías propias de cada una.

• Requiere el conocimiento de varios lenguajes nativos (como Kotlin o Swift) para poder ser desarrollada y distribuida en todas las plataformas.

• Mantenimiento de varias fuentes de código.

• El código no es reutilizable entre las distintas plataformas.

• Actualización costosa y no inmediata, ya que hay que subir la nueva versión a las distintas tiendas y cada usuario tiene que actualizarla.

Xcode

Xcode es un conjunto de herramientas que los desarrolladores utilizan para crear apps para las plataformas de Apple.

Para desarrollar aplicaciones se hace uso de:

• SwiftUI: es un framework declarativo para crear apps para cualquier plataforma de Apple.

• SwiftData: API para modelar y conservar los datos de la aplicación usando código Swift.

• Swift Testing: API para probar aplicaciones creadas con código Swift.

• Xcode Cloud: es un servicio de CI/CD integrado en Xcode y diseñado específicamente para desarrolladores de Apple. Acelera el desarrollo y la entrega de aplicaciones de alta calidad al integrar herramientas basadas en la nube que ayudan a crear aplicaciones,

PABLO ARELLANO www.theglobeformacion.com Página 4B3T8

APLICACIONES WEB

ejecutar pruebas automatizadas en paralelo, entregar aplicaciones a los testers y consultar y gestionar los comentarios de los usuarios.

• TestFlight: permite distribuir versiones beta de una aplicación, gestionar a los beta testers y recopilar comentarios.

Apple ofrece diferentes SDKs y herramientas de desarrollo para las siguientes plataformas:

• iOS/iPadOS.

• watchOS.

• macOS.

• tvOS.

• visionOS.

Android Studio

Un proyecto de Android Studio incluye uno o más módulos con archivos de código fuente y archivos de recursos. Entre los tipos de módulos, se incluyen los siguientes:

• Módulos de apps para Android.

• Módulos de biblioteca.

• Módulos de Google App Engine.

Para desarrollar aplicaciones se hace uso de:

• NDK (kit de desarrollo nativo): es un conjunto de herramientas que permite implementar partes de las aplicaciones Android mediante código C y C++. Desde el código Java se puede, llamar a funciones en la biblioteca nativa por medio de JNI. NDK permite a los desarrolladores:

  1. Utilizar bibliotecas de plataforma para acceder a componentes físicos del dispositivo, como sensores y entrada táctil.

  2. Reutilizar código escrito en C/C++ y ejecutarlo en sus aplicaciones.

  3. Optimizar costosas operaciones matemáticas.

  4. Sacar el máximo rendimiento de la CPU.

• Gradle: es la base del sistema de compilación.

• CMake: es una herramienta de compilación externa que funciona junto con Gradle para compilar una biblioteca nativa.

• Systrace y Logcat: generan datos de rendimiento y depuración para un análisis detallado de la app.

• LLDB: depurador que usa Android Studio para depurar código nativo.

• Lint: para identificar problemas de rendimiento, usabilidad y compatibilidad de versiones, entre otros.

• Google Cloud Platform: compatibilidad integrada que facilita la integración con Google Cloud Messaging y App Engine.

PABLO ARELLANO www.theglobeformacion.com Página 5B3T8

APLICACIONES WEB

Aplicaciones WEB

Una aplicación web o webapp es una app que se ejecuta dentro del propio navegador web del dispositivo a través de una URL y es desarrollada con las tecnologías HTML, CSS y JavaScript.

En definitiva, una webapp no es más que páginas web servidas por un servidor web (como Apache o Nginx).

La principal ventaja de este tipo de app con respecto a la nativa es la posibilidad de programar independiente del sistema operativo en el que se usará la aplicación. De esta forma se pueden ejecutar en diferentes dispositivos con sistemas operativos distintos sin tener que crear varias las aplicaciones. Imprescindible el diseño web adaptable para los distintos dispositivos existentes.

Ventajas de las aplicaciones web

Otras ventajas:

• El coste y tiempo de desarrollo es reducido. Solo se desarrolla una app y las tecnologías utilizadas son sencillas.

• No necesitan ser instaladas/actualizadas/desplegadas en los dispositivos del usuario. Siempre se dispone de la última versión y está disponible en el servidor web.

Inconvenientes de las aplicaciones web

El gran inconveniente es que las webapp NO tienen acceso a los recursos del dispositivo. Otros inconvenientes:

• No disponible en las tiendas de aplicaciones.

• No dispone del icono de acceso de forma directa en la pantalla del móvil.

• Necesita conexión a Internet.

• La experiencia del usuario (UX) y el tiempo de respuesta es inferior en comparación con una app nativa.

Un framework para desarrollo de webapp para Java es Vaadin. Como alternativa para alojar una app móvil tenemos Firebase, que es una plataforma desarrollada por Google que facilita el desarrollo de apps, proporcionando un servidor backend para las aplicaciones. Además, el mismo backend puede ser utilizado de forma común en diversas plataformas: Android, IOS y web.

PABLO ARELLANO www.theglobeformacion.com Página 6B3T8

APLICACIONES WEB

Tecnologías para aplicaciones web

Tecnologías

JAVA EE / JAKARTA EE

• Lenguajes programación: Java.

• Entornos de desarrollo: Eclipse, IntelliJ IDEA.

• Frameworks desarrollo: Spring, Spring Boot, Spring MVC.

• Tecnologías web: Servlet, JSP, JSF.

• Servidor web: Apache, Nginx, Tomcat.

• Tecnologías servidor aplicaciones: clases modelo Java, WS, EJB.

• Servidores aplicaciones: Wildfly, Eclipse GlassFish

• Persistencia datos: Hibernate, OpenJPA, EclipseLink.

.NET

• Lenguajes programación: C#, F#, VB.

• Entornos de desarrollo: Visual Studio.

• Tecnologías web: ASP.NET, ASP.NET Core.

• Servidor web: IIS, Apache, Nginx, Kestrel.

• Tecnologías servidor: clases modelo .NET, WCF.

• Persistencia datos: ADO.NET, NHibernate, Entity Framework.

Aplicaciones HÍBRIDAS

Una aplicación híbrida es una combinación de las dos anteriores (nativa y web) recogiendo lo mejor de cada una de ellas. Es una app web dentro de una app nativa.

Las apps híbridas se desarrollan con tecnologías propias de las webapp (HTML, CSS y JavaScript) por lo que se pueden usar en diferentes plataformas, pero también dan la posibilidad de acceder a gran parte de las características del hardware del dispositivo.

Una vez desarrollado el código, se compila para las distintas plataformas (Android, IOS ... ), ahorrando costes y tiempos de desarrollo. El formato de empaquetado de la app es app (Apple Store) y .apk (Google Play).

La app desarrollada se visualiza en un WebView (no mediante un navegador web) que es un navegador integrado en una aplicación nativa y es lo que permite acceder a los recursos hardware específicos del dispositivo a través de plugins. El WebView ejecuta y representa contenidos web dentro de la app, pero sin incluir la barra de direcciones y otros elementos típicos del navegador. Así, la presentación del contenido tiene el mismo efecto que la IU de una app nativa.

La principal ventaja de las aplicaciones híbridas es que son independientes del sistema operativo (plataforma). Consecuencia de esto es la reducción del coste y tiempos de desarrollo respecto a las apps nativas, ya que no requiere mantener varios desarrollos (uno por sistema operativo).

PABLO ARELLANO www.theglobeformacion.com Página 7