Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/giovanymevi/pedidoHAM/llms.txt

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

Esta guía te lleva desde cero hasta tener pedidoHAM corriendo en tu máquina local. En menos de cinco minutos verás el menú completo de GMV Burger en el navegador, con el carrito funcionando y listo para conectar al número de WhatsApp real de tu negocio.

Prerrequisitos

Antes de comenzar asegúrate de tener instalado lo siguiente:
  • Node.js 18 o superiornodejs.org
  • npm, yarn o pnpm — npm viene incluido con Node.js
  • Gitgit-scm.com
  • Una cuenta de WhatsApp para el restaurante (el número que recibirá los pedidos)

Instalación

1

Clona el repositorio

Descarga el código fuente de pedidoHAM desde GitHub:
git clone https://github.com/giovanymevi/pedidoHAM
cd pedidoHAM
2

Instala las dependencias

Instala React 19, Vite 8, Lucide React y el resto de dependencias del proyecto:
npm install
3

Inicia el servidor de desarrollo

Levanta Vite en modo desarrollo:
npm run dev
Vite compilará el proyecto y abrirá un servidor local en http://localhost:5173. Cualquier cambio que hagas en el código se reflejará en el navegador de forma instantánea gracias al Hot Module Replacement (HMR).
4

Abre la aplicación

Navega a http://localhost:5173 en tu navegador. Verás:
  • 🍔 Hero Header — nombre del restaurante, horario de atención (Lun–Dom · 5:00 pm – 11:00 pm) y el botón de créditos.
  • 🗂️ Cuadrícula de hamburguesas — nueve tarjetas con foto, ingredientes, precio y botón “Agregar al pedido”.
  • 🛒 Cart Sidebar — panel lateral (escritorio) o botón flotante (móvil) con el resumen del carrito, totales y el botón “Pedir por WhatsApp”.
5

Personaliza el número de WhatsApp

Abre src/App.jsx y localiza la siguiente línea dentro de la función sendWhatsAppOrder:
// Cambia este número por el WhatsApp real del restaurante
const phoneNumber = "573000000000";
Reemplaza "573000000000" por el número real del restaurante en formato internacional sin espacios ni guiones (código de país + número). Por ejemplo, para Colombia:
const phoneNumber = "573101234567";
Guarda el archivo — Vite recargará la app automáticamente. A partir de ese momento, el botón “Pedir por WhatsApp” abrirá una conversación directa con ese número incluyendo el resumen completo del pedido.

Scripts disponibles

Todos los scripts se definen en package.json y se ejecutan con npm run <script>:
ScriptComandoDescripción
devviteInicia el servidor de desarrollo en http://localhost:5173 con HMR habilitado.
buildvite buildGenera el bundle de producción optimizado en la carpeta dist/.
linteslint .Analiza el código con ESLint para detectar errores y malas prácticas.
previewvite previewSirve localmente el bundle de producción generado por build para su verificación.
Antes de desplegar a producción, ejecuta npm run build seguido de npm run preview para probar el bundle final en tu máquina. vite preview sirve el contenido de dist/ exactamente como lo haría un servidor estático, lo que te permite detectar problemas de rutas o assets faltantes antes de hacer el deploy.

Build docs developers (and LLMs) love