Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Eleazarguitar18/kantuta_pos_front/llms.txt

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

This guide walks you through cloning Kantuta POS, installing dependencies, pointing the app at your NestJS backend, and logging in for the first time. By the end you will have a running development server, an open cash session, and a completed sale.
Kantuta POS has no embedded backend. Every authentication call, product lookup, and sale depends on a running NestJS REST API. Make sure your backend is up and reachable before starting the development server, or the login screen will return network errors.

​
Prerequisites

Before you begin, confirm the following are available on your machine:
  • Node.js 18 or later — Vite 6 and React 19 both require it. Run node -v to check.
  • npm 9+ (bundled with Node 18) — or Yarn / pnpm if you prefer.
  • Git — to clone the repository.
  • A running NestJS backend — exposing a REST API (default: http://localhost:3000). The frontend expects JWT-based auth endpoints and the full Kantuta API surface.

​
Full setup walkthrough

1

Clone the repository

git clone <url-del-repositorio> kantuta_pos_front
cd kantuta_pos_front
2

Install dependencies

Choose your package manager. All three produce an identical node_modules from the lockfile.
npm install
The install pulls ~40 packages including React 19, Vite 6, Axios, Socket.IO Client, ApexCharts, and @react-pdf/renderer.
3

Create your .env file

Copy the example below into a new file named .env at the project root. Replace the value with the actual URL of your running NestJS API:
.env
VITE_API_BASE_URL=http://localhost:3000
VITE_API_BASE_URL is consumed in two places:
  • src/components/auth/services/urlBase.ts — exports API_BASE_URL used by every Axios service.
  • src/context/SocketContext.tsx — strips the /api suffix and opens a Socket.IO connection to the same host.
If your backend serves the REST API at a sub-path (e.g. /api), set the full base URL without a trailing slash: VITE_API_BASE_URL=http://localhost:3000. Each service file appends its own /api/... path segments.
4

Start the development server

npm run dev
Vite starts the HMR dev server — usually at http://localhost:5173 — and prints the exact URL in the terminal. Open that address in your browser.
5

Sign in

The app redirects unauthenticated visitors to /signin automatically (handled by ProtectedRoute).
  1. Enter the username and password for an existing backend user.
  2. On success, AuthContext stores the JWT access token, refresh token, and user object in localStorage and redirects you to the dashboard (/).
Two roles are available:
RoleAccess level
AdministradorFull access to all modules including Reportes, user management, and register configuration
CajeroDashboard, POS terminal, Cajas control, Recargas operations, and Agentes
6

Open a cash session

Before processing any sale, a cash register session must be active:
  1. Navigate to Cajas in the sidebar.
  2. Click the Control button on the register assigned to your workstation.
  3. Select Abrir Caja, enter the opening cash amount, and confirm.
The CajaContext provider makes the active session available to the POS terminal and all sale-recording components.
7

Ring up your first sale

  1. Go to Ventas → Punto de Venta (/ventas/pos).
  2. Search for a product by name or scan its barcode.
  3. Adjust quantity, then click Registrar Venta.
  4. The sale is persisted via the NestJS API and appears immediately in Ventas history.

​
Available npm scripts

These are the scripts defined in package.json:
ScriptCommandPurpose
devviteStart the Vite HMR development server
buildtsc -b && vite buildType-check then compile an optimised production bundle to dist/
previewvite previewServe the production build locally to verify it before deploying
linteslint .Run ESLint across the entire src/ tree
# Development
npm run dev

# Production build
npm run build

# Preview the production build locally
npm run preview

​
What’s next?

With the app running, explore the rest of the documentation to understand how each module works and how to tune the application for a production deployment.

Build docs developers (and LLMs) love

Get started for freeTalk to us