Parzibyte's blog

Hoy traigo al blog otro punto de venta gratuito y open source, pero este es especial pues fue el primer programa que hice y que fue usado por varias personas.

El punto de venta que presento es un POS web, totalmente open source y gratuito, además de simple y bonito.

Punto de venta web con PHP, MySQL, jQuery, JavaScript y Bootstrap

Está hecho con PHP y JavaScript con jQuery (era el año 2016), usa MySQL/MariaDB como motor de base de datos y Bootstrap para los estilos, con varios temas.

Como ya dije anteriormente, este fue mi primer punto de venta oficial que comencé como por el 2015 (apenas iniciaba la universidad, qué tiempos) y luego terminé en el 2016.

Aunque parezca antiguo sigue funcionando como un encanto incluso con PHP 8.

En este post te mostraré los módulos del sistema y cómo puedes descargarlo e instalarlo en tu computadora o en tu hosting compartido.

El programa es totalmente responsivo y permite la impresión de tickets de manera local.

(más…)

Hoy te mostraré un software que realicé algún tiempo. Se trata de una herramienta web que sirve para generar etiquetas escolares.

Estas etiquetas escolares son las que llevan nombre del alumno, escuela, grado, etcétera y son colocadas en las libretas y/o libros de los estudiantes.

De este modo se pueden generar etiquetas de este tipo con este software web, generando al final un PDF con las etiquetas escolares listas para ser impresas y recortadas.

Entre las características encontramos que se puede:

• Subir plantillas de las etiquetas
• Opción para indicar tamaño de etiqueta
• Crear la etiqueta usando una tipografía personalizada
• Personalizar el color del texto
• Generar la vista previa de la etiqueta escolar
• Descargar la etiqueta generada, para usarla como imagen

Todo esto a través de un programa web creado con PHP y Bootstrap. A lo largo del post te mostraré las características de este generador de etiquetas web.

(más…)

En este post te mostraré un sistema que acabo de programar en PHP y MySQL, además de usar Bootstrap para framework de diseño. Este software que te presento es totalmente gratuito para descargar, y open source.

El sistema en PHP que he creado se encarga de llevar el registro de asistencia de empleados. Por cada empleado, el sistema guarda si ha asistido o no en determinada fecha.

Un módulo con el que este sistema cuenta es con el de registro y gestión de empleados. El segundo módulo se encarga de tomar la asistencia en una fecha concreta (se puede elegir entre asistencia o falta).

Finalmente el tercer módulo muestra el reporte de asistencia de empleados en donde muestra a partir de un rango de fechas la cantidad de faltas y asistencia que tuvo cada empleado.

Como lo dije, este software es totalmente open source y gratuito. La base de datos que usa es MySQL, con el lenguaje de programación PHP, un poco de JavaScript con Vue y finalmente con Bootstrap para el diseño.

A lo largo de este post te mostraré cómo es que fue creado este sistema así como detallar sus módulos, y te dejaré un enlace de descarga como suelo hacer.

Nota: también puedes ver este sistema funcionando con tarjetas RFID.

(más…)

En este post te mostraré un juego que he programado recientemente. Se trata de El ahorcado o hangman, en su versión web programado con JavaScript; totalmente gratuito y open source.

El ahorcado en JavaScript – Programación de juego

El juego está escrito con el lenguaje JavaScript, usando Vue.js y Bootstrap. Cuenta con:

• Gestión de palabras. Puedes agregar y eliminar palabras para jugar al ahorcado
• Elección de palabra aleatoria: cada vez que juegas se selecciona una palabra aleatoria del banco de palabras que el usuario ha registrado
• Botones con letras para adivinar la palabra, mismos que se deshabilitan una vez que se ha intentado esa letra
• Imagen del ahorcado, misma que cambia con el número de intentos
• Juego totalmente responsivo (adaptable a teléfonos, tabletas, etcétera)

A continuación te mostraré cómo está hecho, en dónde puedes descargarlo, etcétera. Pues es un juego open source y gratuito que puedes modificar sin problemas.

(más…)

En este post sobre estilos CSS y el framework Bootstrap 4 te mostraré cómo ocultar y mostrar ciertos elementos al momento de imprimir la página web.

De este modo puedes imprimir la página web ajustando solo ciertas características. Por ejemplo, mostrar el botón de impresión en la pantalla, pero ocultarlo al imprimir.

Todo esto lo haremos con clases que ya vienen en Bootstrap. No  vamos a programar nada manualmente, aunque si quieres, puedes hacerlo de manera nativa.

(más…)

Clima con Angular – App que consume API

Hoy te voy a mostrar un sistema web hecho con Angular. Se trata de una app web que muestra el clima a través de una API.

Lo que hace este software es obtener la ubicación del usuario a través de su IP y obtener el pronóstico del tiempo usando otra API a partir de la latitud y longitud obtenidas anteriormente.

Verás que está implementado de una manera muy sencilla utilizando componentes y servicios. Al final vamos a tener una app web que muestra:

• Ubicación del usuario con nombre de la ciudad y país
• Reloj
• Reporte del clima para los próximos 5 días usando imágenes
• La temperatura máxima y mínima esperada para determinado día

Además, la aplicación web será responsiva pues vamos a usar Bootstrap. Al final del post dejaré el enlace del repositorio para que puedas explorar el código fuente y descargarlo si es necesario. Como lo dije, utiliza Angular.

(más…)

En este post te voy a mostrar cómo puedes realizar una paginación en Laravel; es decir, mostrar registros (de la base de datos) por página, en lugar de mostrarlos todos a la vez.

Laravel ya provee una manera realmente sencilla de agregar paginación, incluso da la opción de agregar los enlaces a la página, y por supuesto, también permite cosas como la búsqueda u otros métodos del Query Builder, todo esto sin escribir ninguna consulta SQL manual.

(más…)

En este post  te mostraré cómo hacer un autocompletado, autocomplete, auto completado o como le llames usando Bootstrap, Vue y una API.

De modo que al final (por si no sabes lo que es un autocompletado) se cuente con una caja en donde se complete mientras el usuario escribe, así como la búsqueda de Google.

Te mostraré dos ejemplos, uno en donde los resultados se completan localmente, y otro en donde se hace una búsqueda para traer los resultados de la API en tiempo real. Voy a dejar el código completo al final.

Nota: si buscas un autocompletado con JavaScript puro, mira Awesomplete.

(más…)