React

Login Y Registro con AUTH0 en REACT

En este post vamos a enseñar como utilizar AUTH0 un proveedor de autenticación a REACT Lo primero es registrarse en AUTH0 https://www.flickr.com/photos/197088457@N08/52525159594/in/shares-10d138Xtp5/ Elegimos other y pinchamos en el checkbox para cambiar de región nuestra cuenta https://www.flickr.com/photos/197088457@N08/52525159584/in/shares-tSDkT4sSVz/ Elegimos el nombre del dominio que queramos y la regio EU https://www.flickr.com/photos/197088457@N08/52524411962/in/shares-m0PBz7Q821/ Pulsamos en el botón de crear aplicación https://www.flickr.com/photos/197088457@N08/52525159564/in/shares-nYC243pYb0/ Pinchamos en single page applications ya que es para una aplicación de React y pulsamos crear https://www.flickr.com/photos/197088457@N08/52524878616/in/shares-59071Xq863/ Le decimos que es para una aplicación de REACT https://www.flickr.com/photos/197088457@N08/52525431418/in/shares-X38tEks99e/ Pulsamos en el enlace de para conseguir la application keys…continue reading →

Pasarela de Pagos con React, Express.js y Stripe

En este post se procederá a explicar cómo realizar una pasarela de pagos con: para frontend > ReactJS, para backend > Express.js (con Node.js) y, para la pasarela propiamente, la plataforma > Stripe. React se usará principalmente para la visualización de contenido, establecimiento de información, el carrito de compra con los determinados elementos, etc... Y Express.js simplemente para que se puedan realizar de forma funcional las peticiones y se puedan mostrar dichas respuestas en la parte cliente. Es importante resaltar que la plataforma de Stripe es muy amplia. Tiene numerosas funcionalidades, pero lo…continue reading →

Librería de traducción i18next con React

Hoy en día es fundamental tener tus aplicaciones en tu idioma nativo, pero también es necesario dar la posibilidad al usuario de poder utilizar el inglés o cualquier otro idioma en tu aplicación. De esta manera podrás crecer más versátilmente entre mucha mas gente, pudiendo así dar a conocer tu aplicación internacionalmente. Para poder realizar una traducción, los propios navegadores como Chrome ya te dan la posibilidad de poder traducir el contenido de una página, siempre y cuando el idioma esté declarado en el atributo Lang del fichero HTML y sea distinto del…continue reading →

CÓMO IMPLEMENTAR GRÁFICOS CHARTJS EN REACT

En este post quiero hablar acerca de ChartJS (https://react-chartjs-2.js.org/) y más en concreto, de su librería análoga react-chartjs-2. Una herramienta muy completa, que nos permite trabajar con multitud de gráficos totalmente personalizables y con muy poco trabajo de implementación previa. Son muchos los casos en los que es necesario visualizar datos de una forma dinámica y atractiva. Para nosotros, como programadores, puede resultar algo tedioso implementar distintos tipos de gráficos para cada una de las decenas de conjuntos de datos que manejamos a diario en nuestros proyectos. En estos casos puede resultar muy…continue reading →

Creación de una WishList utilizando Amazon Elastic Cache

En esta ocasión os voy a enseñar a como crear y implementar Elastic Cache consumiendo los servicios de Amazon Web Servicies. Elastic Cache es una herramienta muy útil que nos permite almacenar, como dice su propio nombre, en la Cache la información que nosotros queramos de nuestra aplicación. Sus usos son variados, lo pueden implementar tanto para Session, como para una WishList o un Carrito de Compras. AWS Lo primero que necesitamos es tener una cuenta activa en AWS al entrar debemos comprobar que estamos en el Norte de Virginia, lo siguiente que…continue reading →

Realizar búsquedas y filtrar datos utilizando Casting en NetCore.5

Para esta aplicación necesitaremos crear un entorno de trabajo en MVC NetCore 5, tambien debemos tener a nuestra disposición una base de datos con la cual trabajar. En mi caso tendré Una base de datos denominada Kibunshi con tres tablas una de Peliculas , Superheroes y Mundos Base de datos: Como vemos a continuación yo tengo tres tablas en las cuales Pelis será destinada para la búsqueda y Mundo y Superhéroes serán destinadas para el filtro ya que los dos comparten el campo Id_Mundo ASP.NET CORE MVC: Creamos una aplicacion que sea de…continue reading →