EcoTaskApp: Aplicación Web de Gestión de Tareas Ecológicas con Angular

Introducción La concienciación medioambiental se ha convertido en uno de los principales retos de la sociedad actual. Cada vez más personas desean adoptar hábitos sostenibles, pero en muchas ocasiones carecen de herramientas que les permitan organizar, controlar y realizar un seguimiento de sus acciones ecológicas. Ante esta necesidad surge EcoTaskApp, una aplicación web desarrollada con Angular cuyo objetivo es facilitar la gestión de tareas relacionadas con el cuidado del medioambiente y promover hábitos sostenibles mediante un sistema de seguimiento y recompensas. EcoTaskApp permite a los usuarios registrarse, iniciar sesión, crear tareas ecológicas, clasificarlas…continue reading →

Tracking de Pedidos en Tiempo Real con Angular, ASP.NET Core, SignalR y Azure Cosmos DB

Temas del Master que cubre este proyecto Este proyecto integra contenidos de varias areas del Master en Desarrollo Full Stack + Arquitecturas Cloud: Arquitectura: SPA desacoplada Angular + API REST, diseno de APIs RESTful escalables y versionadas, patron Repository en ASP.NET Core Seguridad: Autenticacion y autorizacion con JWT, gestion de roles y politicas en APIs REST, proteccion CORS Computacion en la nube: Base de datos en Azure (Cosmos DB como equivalente a MongoDB Atlas en la nube) Comunicacion y Tiempo Real: SignalR en ASP.NET Core para aplicaciones en tiempo real, arquitectura orientada a…continue reading →

Arquitectura SPA desacoplada: Angular + API REST con JWT paso a paso

🚨 El problema: cuando el frontend y el backend viven pegados Si llevas un tiempo desarrollando aplicaciones web, es probable que hayas empezado con proyectos donde el servidor genera el HTML directamente y lo manda al navegador. Funciona, pero escala mal. ¿Qué pasa cuando el equipo de front y el de back quieren trabajar por separado? ¿O cuando la misma API necesita servir a una app móvil además de a la web? Aquí es donde aparece la arquitectura SPA desacoplada: el frontend es una aplicación completamente independiente que vive en el navegador, y…continue reading →

La librería RxJS: Reactive Extensions for JavaScript

El Problema En el desarrollo de aplicaciones web modernas, uno de los mayores retos es manejar flujos de datos en tiempo real, como puede ser una aplicación de mensajería instantánea, eventos de usuario, actualizaciones de una API... Con el uso tradicional de promesas anidadas, callbacks, estados múltiples, la complejidad del código aumenta de forma no sostenible. Es por esto que se utiliza la librería RxJS (Reactive Extensions for JavaScript). Puntos Importantes ¿Qué es RxJS?: RxJS es una librería que implementa el paradigma de programación reactiva en JavaScript. Permite trabajar con observables, que son…continue reading →

Capacitor con Ionic en el Framework de Angular

Objetivos Este proyecto trata de mostrar la gran funcionalidad que nos ofrece Ionic junto con Angular para el desarrollo de una aplicación, no solo de escritorio sino que también para dispositivos móviles, ya sea en android o ios. En este caso, emplearemos el emulador de Android Studio y el plugin de Capacitor para ver el resultado final del proyecto. Ionic y Capacitor Ionic es un Framework de Front-End de código abierto que simplifica enormemente al desarrollo de aplicaciones multiplataforma, pues utiliza la misma base de código, basado en las tecnologías Web (HTML, CSS,…continue reading →