Creacion de Modales en React con SweetAlert2

Usos de SweetAlert2 A la hora de crear modales, popups y alertas con Javascript, pueden utilizarse diferentes bibliotecas u opciones. Una de esas bibliotecas es SweetAlert2. SweetAlert2 es una biblioteca que esta pensada para poder utilizarse junto a JavaScript Vanilla. Al estar pensado para usarse de esa manera, también funciona con React, Vue y Angular, aunque en este post se utilizara con React. Todo el código creado para esta explicación se puede encontrar en el siguiente repositorio de GitHub. Instalar y crear modales Instalando SweetAlert2 en React Para instalar SweetAlert2 y poder utilizarlo…continue reading →

Consumir servicios de una API Firebase con React

Introducción Firebase es una plataforma en la nube de Google para el desarrollo de aplicaciones web y móvil. Posee múltiples herramientas y funciones para facilitar el desarrollo de aplicaciones, procurando optimizarlas sin renunciar en ningún momento a la calidad. Firestore: Es una base de datos NoSQL flexible, escalable y en la nube con el fin de almacenar y sincronizar datos en tiempo real para la programación tanto en el lado del cliente como en el del servidor. Creación de la base de datos En primer lugar crearemos un nuevo proyecto Firebase desde  https://firebase.google.com/  …continue reading →

Creación de Rutas, pasar parámetro por URL y rutas hijas en Angular

Las aplicaciones Angular son aplicaciones SPA, Single Page Applications, en las cuales están formadas por componentes.  Donde cada componente es una página de la aplicación. Entonces, cómo es que se relacionan dichos componentes para poder navegar por toda la aplicación? Sencillo es gracias a un fichero en el cual se establecen las rutas de internas de la aplicación donde se podrá navegar. Este fichero se localiza dentro del proyecto el src/app. Existen dos formas distintas para la creación de dicho fichero: Durante la creación del proyecto de angular con el comando ng new…continue reading →

MaterialUI en Angular (for dummies)

Buenas a todxs! Hoy vamos a ver una pequeña parte de nuestro mundo como desarrolladores. Veremos básicamente lo que es Angular Material: una libreria de componentes UI con una guía de estilos ya creadas por Google, y que están casi destinadas a la responsividad y en general a Android y sus aplicaciones. En resumidas cuentas, Angular Material es un conjunto de estilos con una lógica por detrás para poder hacerles referencia. Lo que vamos a necesitar será: -Un proyecto de angular ya creado o nuevo -Angular CLI 10.2 -Consola de comandos (Yo he…continue reading →

Ciclo de vida de los Componentes en React

¿Estás tenido problemas para entender el ciclo de vida de React? No te preocupes, en este post te lo voy a resumir para que lo aprendas fácilmente. Primero, avisarte de que en la última versión de React han comentado que van a dejar soporte a determinados métodos que se estan quedando antiguos, pero no te preocupes porque esos no los vamos a ver, y con esto comentado, empezemos ¿Qué son los métodos de ciclos de vida? Son la serie de eventos que sucede desde que se crea el componente hasta su destrucciónPara que…continue reading →