InstagramTwitterYoutubeGithubLinkedInStackOverflow

APIs del navegador para crear progressive web apps

Freddy Montes - Frontend Developer, Designer and TeacherFreddy Montes|

Las progressive web apps son cada día más respaldadas por gigantes de la tecnología como Microsoft que te permite y te recomienda publicarlas en sus tiendas de aplicaciones.

La plataforma de la web contiene una serie de API que te permiten crear aplicaciones que proveen experiencias a los usuarios cada vez más cercanas a las aplicaciones nativas.

En este blog post voy a enumerar alguno de los APIs necesarios para construir web apps exitosas.

Contenido disponible sin conexión

Carga el contenido, cachéalo y úsalo mientras el usuario no tiene conexión internet, esto se puede lograr con:

Descarga de información en el fondo

Puedes delegar al browser, que detecta cuando esta online y comienza o reanuda la descarga de recursos con el Background Fetch API.

Compartir contenido

No solamente se puede compartir contenido desde tu PWA con el Web Share API, pero además puedes recibir contenido en tu web app con el Web Share Target API.

Refrescar el contenido de la web app en el fondo

Se puede mantener el contenido fresco en el “fondo” usando el Periodic Background Sync API.

Sincronizar el estado con el servidor

Y que pasa cuando el usuario no tiene conexión y hace algún cambio, pues necesitas permitir eso y puedes delegar, mantener la sincronización con el Background Sync API.

Controlar el app con las teclas de multimedia

Las teclas multimedia son soportados por el Media Session API.

Esto incluye las teclas del teclado, los botones de los audífonos, smartwatches, etc. También permite aprovechar de los media control del OS, como widgets.

Integrar con los archivos locales

Puedes leer y escribir archivos en el sistema usando el File System Access API, por supuesto esto va a requerir permisos.

Animaciones rápidas

Hay muchas maneras de hacer animaciones en Web algunas maneras incluyen:

Contenido fuera del PWA

Con el Content Index API le puedes decir al navegador que content del PWA va a “surface” fuera del main app.

Notificaciones

Pues tenemos dos API Push API y Notification Triggers API.

Badges

Sí, esas bolitas “incómodas” en el icono las puedes poner en el icono de tu progressive web app con el Push API.

Conclusión

Las aplicaciones web progresivas no solucionan todo ni mucho menos, pero la web como plataforma sigue mejorando y aportando herramientas que nos permiten a los que trabajamos en tecnología proveer buenas soluciones de manera eficiente y rápida.

Twitter

Gracias por leer esta entrada del blog. Cualquier comentario o pregunta llegame a mi Twitter.

Tweet Me

Copyright © 2023. Design and code by myself with Next.js. Fork it and create yours