DatePicker de Buefy en español

Buefy es un paquete de componentes que combinan BulmaCSS y Vue.js. Entre esos componentes encontramos el b-datepicker que no es más que un seleccionador de fechas, calendario o datepicker.

Por defecto viene en inglés, pero provee la manera de especificar los meses y días en español, cosa que te enseñaré hoy: cómo poner el datepicker de Buefy en español.

(más…)

Vue: eliminar referencias de arreglos

En posts anteriores mostré la manera de eliminar las referencias de arreglos en JavaScript usando slice o el operador de propagación. Sin embargo, con el framework Vue las cosas son un poco distintas debido a su reactividad.

Hoy te mostraré cómo eliminar la referencia de un arreglo en Vue o, en otras palabras, cómo realizar una copia de un arreglo en Vue.

Este error me dio bastantes dolores de cabeza, y siempre me los ha dado. Al fin encontré la solución y vengo a compartirla.

(más…)

Vue JS: inyectar HTML en vista

Como sabemos, las plantillas de Vue no permiten colocar contenido HTML, y cualquier cadena HTML que se coloque será saneada para evitar posibles ataques, XSS entre ellos.

Sin embargo Vue provee una manera fácil y sencilla de inyectar HTML “inseguro” en un componente o vista, y justamente es lo que veremos en este post.

(más…)

Calificación de tareas

App web de Go, Vue y PostgreSQL en Android con Termux

Este artículo es una demostración sobre cómo poder montar una aplicación web que usa VueJS del lado del cliente (con la vue cli), Go/Golang del lado del servidor y PostgreSQL como base de datos.

Vamos a montar el proyecto web en un teléfono móvil con Android, usando la app Termux. Todo estará ejecutándose en Android, ya que se usará para programar.

Es decir, tendremos a node vigilando los archivos js, a go compilando en el lado del servidor y a PostgreSQL almacenando los datos.

¡Vamos allá!

(más…)

Compilando componentes para usar Vue con Laravel

Vue con Laravel – Configuración con Laravel Mix

En este post te mostraré cómo usar Vue con Laravel, es decir, crear componentes de Vue y usarlos dentro de Laravel, compilando los componentes de Vue que estarán en un archivo con extensión .vue en lugar de usar HTML.

Laravel es un framework del lado del servidor que utiliza el lenguaje PHP. Vue es un framework del lado del cliente que utiliza JavaScript (ya sea con TypeScript, CoffeeScript, etcétera).

Veamos cómo usar estas dos tecnologías en conjunto.

(más…)

Comunicación entre componentes con Vue.js

Al trabajar con el framework Vue.js podemos dividir la lógica de las aplicaciones en componentes aislados e independientes; pero una cosa importante es la comunicación entre componentes.

En este post te mostraré cómo comunicar componentes usando $emit y $refs. En el primer caso usaremos $emit para comunicar al padre un evento, y en el segundo caso vamos a usar $refs para invocar a una función dentro del componente hijo.

Poniéndolo en otras palabras, primero veremos comunicación de componentes de hijo a padre, y después de padre a hijo. Gracias a esto vamos a llamar a una función de un componente desde otro componente usando Vue.js

Nota: esto funciona bien para componentes simples o para comunicación simple entre componentes; si quieres algo más complejo que involucre a más componentes puedes usar Vuex.

(más…)

Control escolar - Bienvenida al sistema

Control escolar – Software web para gestión de escuelas

En este post te voy a mostrar un sistema de control escolar o gestión de escuelas. Es un software web que hice hace algún tiempo y vengo a mostrar hoy. Lo que tiene a grandes rasgos es:

  • Control de estudiantes o alumnos
  • Registro de profesores o docentes
  • Registro de materias
  • Control de calificaciones
  • Calificaciones por período y número de evaluación
  • Asignación de materias a docentes
  • Generación de boletas
  • Control de horarios de materias
  • Impresión de boleta
  • Impresión de horario de clases
  • Gráficas de comparación entre períodos

Como lo dije, el sistema es un sistema web que puede trabajar en internet o de manera offline. Es compatible con Linux y Windows. También es totalmente responsivo, es decir, se adapta a cualquier pantalla.

(más…)