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). ...
Introducción En una de las materias que estoy cursando (o que cursé, dependiendo del momento en el que esto se publique) tuve que presentar todas esas cosas aburridas que conlleva el desarrollo de software. Me refiero a los diagramas, casos de uso, clases, interfaces y todas esas cosas que al final (desde mi punto de vista) no sirven para nada y solamente hacen perder tiempo. ...
Hoy vengo a presentar un software para realizar cotizaciones o presupuestos, el cual es totalmente gratuito de usar en la nube; así como open source. Es decir, aparte de que puedes usarlo en mi sitio, puedes descargarlo y modificarlo. Características del software No es la gran cosa, pero entre sus principales características encontramos las siguientes: Realizar cotizaciones o presupuestos Estimar el costo requerido, el cual se configura por cada servicio Calcular tiempo requerido por cada servicio Describir características y/o condiciones del trabajo Agregar clientes para ligarlos a las cotizaciones Imprimir la cotización o guardarla como PDF (esto depende del navegador la mayoría de veces) Multiusuario: cualquier usuario puede registrarse y usarlo, así de simple. Eso sí, las cotizaciones, servicios y características son separadas por usuario Totalmente open source Escrito con PHP, utiliza PDO para interactuar con la base de datos Base de datos MySQL Lado del cliente con Vue.JS y Bootstrap Mensaje de agradecimiento, presentación y pie totalmente configurables Se me ocurre que puede servir tanto como para estudiantes que tienen que entregar un proyecto con PHP simple, así como para personas que necesitan un software como estos. Voy a explicar cómo fue creado, en dónde se puede probar y también dónde se puede leer el código fuente. ...
App que explica cómo convertir hexadecimal a decimal en JavaScript con Vue.JS 2 Como lo dije en otro post, hice una pequeña app que te explica cómo convertir un número hexadecimal a decimal. No es como cuando vimos conversión entre bases con JS, pues eso se hacía pero el lenguaje se encargaba. Lo que trato de hacer aquí es explicar el procedimiento para realizar la conversión. Esto es por si estamos en nuestras clases de matemáticas discretas o simplemente algún día necesitamos hacer la conversión hexadecimal-decimal a mano. Nota: te invito a ver una app que convierte bases. ...
Introducción Vue.Js es un framework maravilloso. Ofrece, al igual que AngularJS (y no sé cuáles otros, no los he usado) una forma de vigilar el cambio de un valor a través de un watch, watcher u observador. Esto permite observar el cambio de una variable, ya sea primitiva o compleja como un objeto o arreglo. Veamos entonces cómo usar de forma correcta a watch en el framework web de JavaScript Vue.js ...
Introducción Para reforzar y aplicar lo que vimos en cómo convertir entre binario, octal, decimal y hexadecimal en JavaScript decidí crear un convertidor (o conversor) de bases numéricas o números. Lo que hace es muy simple, convierte (desde cualquier base) a las siguientes: Binario Octal Decimal Hexadecimal Para agregarle más comodidad al usuario pusimos la opción de copiar el texto directamente en el portapapeles. Veamos una pequeña explicación. ...
Introducción En mi clase de Administración de servidores tenía un poco de tiempo libre y decidí hacer una calculadora chmod (o así la llamo yo). Lo que hace es que, con una interfaz gráfica agradable eliges los permisos de usuario, grupo y el resto del mundo para un archivo, y también eliges permisos de lectura, escritura y ejecución. Una vez que terminaste de seleccionar, te da los comandos Linux que necesitas aplicar; ya sea en modo octal o con letra (que a mi parecer es más entendible). ...
Introducción VuetifyJS es un framework que añade estilos material design a nuestras apps creadas con VueJS. Existe un componente para mostrar datos en forma de tabla: v-data-table. Podemos acceder a los elementos que se repiten con props.item pero habrá ocasiones en las que necesitaremos el índice del elemento. Por ejemplo, si nuestros elementos son un arreglo y queremos quitar uno, necesitaríamos el índice para hacer un splice. Acceder a index o índice en v-data-table Es muy sencillo. Si tenemos una tabla más o menos así: ...
Introducción Los filtros de Vue.js son muy útiles. Generalmente son utilizados sólo en la vista. Por ejemplo, si queremos filtrar moneda hacemos esto: {{sueldo | currency}} ¿Pero qué pasa si queremos utilizar esos filtros en nuestro código javascript? recientemente me pasó que estaba generando un documento PDF con la magnífica librería jsPDF, pero para mostrar algunos montos necesitaba filtrarlos antes. Así que me puse a pensar en cómo utilizar los filtros no sólo en la vista, sino también en la lógica. Y encontré la respuesta. ...
Introducción Vue.js es un framework poderoso pero liviano. Por lo tanto, no viene con cosas innecesarias, los filtros son un ejemplo de ello. En las aplicaciones que desarrollamos, no siempre necesitaremos el filtro currency o de dinero. Pero habrá algunas ocasiones en las que sí lo necesitaremos, ¿y para qué reinventar la rueda, si alguien más ya lo hizo por nosotros? así que hoy veremos cómo utilizar el filtro de moneda en VueJS. ...