Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/jpbarbatic/webapp/llms.txt

Use this file to discover all available pages before exploring further.

Al final de esta guía tendrás una instancia completamente funcional del panel de administración ejecutándose en tu máquina local, con la base de datos cargada, las dependencias instaladas y el servidor de desarrollo en marcha. El proceso completo debería llevarte menos de diez minutos.

​
Requisitos previos

Antes de comenzar asegúrate de tener instalado en tu sistema:
  • PHP 8.1 o superior — con las extensiones pdo_mysql, gd y mbstring habilitadas.
  • Composer — gestor de dependencias PHP (getcomposer.org).
  • Node.js y npm — necesarios para ejecutar los scripts de package.json (p. ej. npm run serve).
  • MariaDB o MySQL — servidor de base de datos accesible localmente.
  • Apache con mod_rewrite — para entornos de producción. En desarrollo puedes usar el servidor integrado de PHP que arrancan los scripts npm.

​
Pasos de instalación

1

Clonar el repositorio

Clona el proyecto desde GitHub en el directorio de tu elección:
git clone https://github.com/jpbarbatic/webapp.git
cd webapp
La raíz del repositorio contiene todos los ficheros del proyecto. El directorio public/ es la única carpeta que debe quedar expuesta al servidor web.
2

Configurar la aplicación

El repositorio incluye config-ejemplo.php como plantilla. Cópialo a config.php (este fichero está excluido del control de versiones y del despliegue FTP):
cp config-ejemplo.php config.php
A continuación edita config.php y ajusta los valores a tu entorno. El contenido completo de la plantilla es el siguiente:
<?php
// Depuración de errores
ini_set('display_errors','On');
ini_set('error_reporting', E_ALL );
mysqli_report(MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);

// Conexión a base de datos
define('DEBUG', true);
define('DB_TYPE', 'mysql');
define('DB_HOST', '127.0.0.1');
define('DB_USER', 'root');
define('DB_PASS', 'example');
define('DB_NAME', 'empresa');
define('DB_PORT', 3308);

define('NOMBRE_WEB', 'Mi Empresa');
Descripción de cada constante:
ConstanteDescripción
DEBUGtrue muestra errores PHP en pantalla. Ponlo en false en producción.
DB_TYPETipo de base de datos. Usa 'mysql' tanto para MySQL como para MariaDB.
DB_HOSTDirección del servidor de base de datos (por defecto 127.0.0.1).
DB_USERUsuario de la base de datos.
DB_PASSContraseña del usuario de la base de datos.
DB_NAMENombre de la base de datos que usará la aplicación.
DB_PORTPuerto TCP del servidor de base de datos (por defecto 3306 en MySQL/MariaDB; la plantilla usa 3308 para entornos no estándar).
NOMBRE_WEBNombre de la empresa o aplicación que aparece en la interfaz.
Si vas a servir la aplicación desde una ruta que no sea la raíz del dominio, asegúrate de definir también la constante URL_BASE con la ruta base correcta para que los enlaces y redirecciones funcionen adecuadamente.
3

Instalar dependencias PHP

Ejecuta Composer desde la raíz del proyecto para instalar las librerías de generación de PDF declaradas en composer.json:
composer install
Esto descargará mpdf/mpdf ^8.3 y tecnickcom/tc-lib-pdf ^8.33 en el directorio vendor/. La carpeta vendor/ se excluye automáticamente del despliegue FTP (ver sync.sh).
4

Cargar el esquema de base de datos

El fichero esquema.sql contiene la definición completa de todas las tablas (categorias, productos, roles, permisos, roles_permisos, usuarios) junto con datos de ejemplo listos para usar.Opción A — Cliente MySQL en línea de comandos:Primero crea la base de datos si no existe y luego importa el esquema:
mysql -u root -p -e "CREATE DATABASE IF NOT EXISTS empresa CHARACTER SET utf8mb4;"
mysql -u root -p empresa < esquema.sql
Opción B — Utilidad web bd.php:El repositorio incluye bd.php en la raíz del proyecto. Accede a él desde el navegador mientras el servidor está en marcha para cargar el esquema de forma interactiva sin necesidad de un cliente de línea de comandos.Una vez importado, el esquema crea las siguientes tablas principales:
-- Tablas creadas por esquema.sql
categorias       -- 5 categorías de ejemplo (Tecnología, Ropa y Modas, Hogar y Decoración, Deportes, Alimentación)
productos        -- 49 productos de ejemplo distribuidos entre las categorías
roles            -- 1 rol inicial: "admin"
permisos         -- 4 permisos base para el módulo de usuarios
roles_permisos   -- Asignaciones de permisos a roles
usuarios         -- Usuario administrador + usuarios de prueba
5

Arrancar el servidor de desarrollo

El package.json incluye el script serve, que lanza el servidor integrado de PHP usando public/ como raíz web:
npm run serve
Este comando ejecuta internamente:
php -S 0.0.0.0:9000 -t public
Una vez iniciado, abre tu navegador y accede a:
http://localhost:9000
Serás redirigido automáticamente a la página de inicio de sesión.

​
Primer acceso

Al navegar a http://localhost:9000 la aplicación comprueba si existe una sesión PHP activa. Si no la hay, te redirige al formulario de inicio de sesión (public/login.php). Introduce las credenciales del usuario administrador que carga el esquema por defecto:
CampoValor
Emailadmin@example.com
Contraseñaadmin (hash bcrypt en la BD: $2y$10$xuReHiJqh4EfiRHf6/jsc..8tt6dLUyTj9BXEnmQ0z2YmX6qgjao6)
Tras una autenticación correcta, PHP crea una sesión segura y te redirige al dashboard principal, donde verás un resumen del estado del panel y el widget meteorológico.
Cambia la contraseña del administrador antes de pasar a producción. La contraseña por defecto es pública y conocida. Puedes cambiarla desde el módulo de Usuarios → editar el usuario admin@example.com → sección “Cambiar contraseña”. La contraseña se almacena con password_hash() usando el algoritmo bcrypt (coste 10).
¿Listo para desplegar en producción? El script sync.sh utiliza lftp para sincronizar el proyecto con tu servidor de producción de forma incremental, excluyendo automáticamente config.php, .env, vendor/, node_modules/ y .git/. Configura tus credenciales FTP copiando .env-ejemplo a .env y rellena las variables FTP_HOST, FTP_USER, FTP_PASS, FTP_LOCAL y FTP_REMOTE. Luego ejecuta npm run sync-ftp. Consulta la guía completa en Despliegue por FTP.

Build docs developers (and LLMs) love

Get started for freeTalk to us