En esta ocasión vengo a compartir un simple diseño de un formulario de inicio de sesión o login hecho con Bootstrap 4. Generalmente un formulario de login solo lleva dos campos: el del correo y la contraseña. Gracias a los estilos de Bootstrap podemos diseñar un formulario responsivo, elegante y simple con pocas líneas de código. ...
Bootstrap 4 (y su versión anterior, la 3) es el framework CSS más usado en el desarrollo web (por ejemplo, el sistema de cotizaciones lo usa). Como desarrolladores, necesitamos una plantilla de donde partir. Una plantilla básica o una starter template de Bootstrap para cargarla y tomarla como base para nuestros proyectos. Me di a la tarea de crear una y traducirla, para tomarla como base al desarrollar con Bootstrap 4. ...
He creado un generador de multiplicaciones aleatorias, en donde se presiona un botón y se generan multiplicaciones para imprimirlas y resolverlas, funciona totalmente en línea y se pueden personalizar los números. ...
Hace algún tiempo creé una aplicación web como un ejercicio para aplicar para un trabajo. Decidí hacerla con Vue.js, Bootstrap y localStorage en conjunto. Al final resultó en algo como lo de la imagen: Es una simple aplicación de notas que puedes crear, eliminar, editar y listar. También se puede cambiar el color de todas las notas (fue un requisito, no cosa mía, así como el idioma). ...
Descargar Iconos de Font Awesome para usar sin internet En este post voy a explicar cómo descargar y configurar los iconos de la librería Font Awesome para alojarlos localmente o en nuestros propios servidores. Alojar estos iconos de manera offline es importante cuando creamos aplicaciones web que no van a tener acceso a internet, es decir, que serán aplicaciones fuera de línea. También es necesario saber cómo configurar el directorio de carpetas, fuentes y CSS dentro de nuestro proyecto, de esta manera podemos tener los iconos de Font Awesome en nuestro propio servidor o en localhost, sin depender del internet. ...
Hoy vengo a presentar un paquete de iconos totalmente open source y descargable (no es mío) llamado Eva Icons. Son unos iconos que se pueden usar en la web, o como PNG y SVG en distintos proyectos. Gracias a que son unos iconos open source y descargables, podemos usarlos como PNG o en la web para nuestro siguiente proyecto. En este post voy a explicar cómo descargar los iconos y cómo usarlos en la web. ...
Para ejemplificar y combinar el uso de BigInt con los Web Workers en JavaScript me di a la tarea de crear una sencilla aplicación web que permite calcular el factorial de cualquier número, todo desde el navegador, es decir, online. El uso de los Web workers es para hacer cálculos extensos, y el de BigInt para no quedarnos cortos a la hora de trabajar con números grandes. Por el momento sólo funciona en Chrome y Opera, ya que usa BigInt y no quise usar el polyfill. Voy a explicar la creación de la aplicación web y cómo utilicé cada cosa para crear todo esto. ...
Evitar que los navegadores web guarden en caché nuestros scripts y plantillas Los navegadores web guardan en caché algunos archivos para que a la próxima llamada se carguen más rápido. Esto es una mejora para el usuario final, pero no tanto para los programadores. Hay ocasiones (y te das cuenta 2 horas después de depurar como loco) en las que un script de JavaScript falla, arreglas el error pero misteriosamente sigue apareciendo, por más que refresques o guardes cambios. Lo mismo pasa con las vistas o los archivos HTML, a veces cambias algo en la vista y no aparece al usar la aplicación web. Todo esto es debido al caché de los navegadores web. Hoy veremos cómo obligar a los navegadores a que ya no guarden ese caché, y también otras medidas que podemos aplicar en caso de emergencia. ...
Introducción Hoy veremos cómo crear una tabla en HTML pero de la manera correcta, porque incluso en estos tiempos es un poco confuso la manera de crear una tabla, o al menos la sintaxis a seguir para tener un lugar de donde copiar y pegar, o un ejemplo simple. Veremos cómo ponerle bordes, poner encabezados y otras cosas. ...
Introducción ¿No te ha pasado que a veces ves un botón y quieres extraer su estilo? pero sólo el estilo del botón, no todo el archivo de estilos CSS. O simplemente quieres extraer CSS utilizado en una página web o sitio de internet. Pues bien, hoy veremos cómo extraer el estilo CSS de un componente de cualquier página. Así, si sólo quieres el estilo de determinado botón, div o link, podrás extraerlo y pegarlo directamente en otro sitio. ...