Full Stack

Como usar Material Icons con React

Hola, bienvenidos a este post donde veremos como trabajar con “icon”, que es un componente del framework material UI. Como introducción, Material UI es un framework que nos permite usar algunas herramientas para mejorar el interfaz de nuestra página. Una de estas herramientas de la que disponenemos es el componente “icon”, que nos permite usar iconos en nuestra página web, a continuación se explicará como implementar Material y como usar el componente mencionado desde cero. Necesitamos la aplicación cmder ( también sirve la consola de windows ) y Visual Studio Code. Material funciona…continue reading →

Reproductor de video responsivo con Vue

IFRAME Para crear nuestro reproductor de video en nuestra página web hecha con Vue js utilizaremos la etiqueta iframe. Este elemento HTML nos permite incrustar contenido de otras páginas web en la nuestra y poder visualizarlo, algunos de los elementos que se pueden incluir dentro de esta son documentos y videos de YouTube, como ejemplo. ANTES DE EMPEZAR Lo primero que tendremos que hacer antes de empezar con nuestro reproductor de video es crearnos nuestro proyecto de Vue js sobre el que trabajaremos, esto se hará a través de la consola de comandos,…continue reading →

Manejo de Pistas de Audio en Vue

¿Cómo insertar audios en tecnología Vue? En este post veremos como insertar pistas de audio en tecnología vue de manera sencilla y concisa, sin uso de tecnologías externas o librerías para un primer acercamiento a este sistema. Primeros Pasos Esto es algo que hemos visto en clase pero por si acaso y para que todo el mundo pueda probarlo veremos como abrir un proyecto nuevo y como lanzar el servidor. Para ello necesitaremos los siguientes comandos: pm install -g @vue/cli Con este comando instalaremos vue a través de node.js Una vez hecho esto…continue reading →

Implementación de notificaciones en React

Bienvenidos al post de Implementación de notificaciones en React, donde aprenderéis a implementar la librería de notificaciones react-hot-toast en React y poder así ofrecer un diseño mas llamativo a vuestras webs de cara al usuario. https://flic.kr/p/2mLC9vB Tendréis disponibles al final del post el código de GitHub, además de un link hacia el proyecto subido para que podáis ver la funcionalidad de las notificaciones. Requerimientos Para poder seguir el post correctamente, es necesario que tengáis un proyecto de React funcional. React-Hot-Toast, instalación e importación Empezamos por instalar la dependencia en nuestro proyecto mediante el…continue reading →

Reproductor de video responsivo con React

¿Quieres reproducir videos de una web externa o directamente de tu PC? En este post vamos a aprender a crear un reproductor de video desde cero ya sea con videos de webs externas como YouTube, como con videos que tengas en tu propio PC. Para realizarlo será necesaria la instalación del componente React-Player que nos proporciona React. Una vez instalado este componente realizaremos un ejemplo sencillo aunque conciso de como realizar nuestro reproductor. React-Player React-Player es un componente de React para reproducir una variedad de URL, incluidas rutas de archivos, YouTube, Facebook, Twitch,…continue reading →