SimplePOS24 Frontend

A Next.js frontend application for a simple Point of Sale (POS) system with modern UI components and real-time functionality.

Prerequisites

• Node.js 18 or higher
• npm or yarn package manager

Setup

1. Install Dependencies

npm install
# or
yarn install

2. Environment Variables

Create a .env file in the root directory and configure the backend API URL:

NEXT_PUBLIC_API_URL=http://localhost:8081

3. Running the Application

For development:

npm run dev
# or
yarn dev

For production:

npm run build
npm start
# or
yarn build
yarn start

The application will start on http://localhost:3000 by default.

Features

• Product Management: Browse and manage products by categories (Fruits, Vegetables, Bakery)
• Transaction Processing: Handle sales transactions with multiple payment methods
• Settings Panel: Configure products, deposits, discounts, passwords, and themes
• Modern UI: Built with Tailwind CSS and Radix UI components
• Dark/Light Theme: Toggle between themes
• Responsive Design: Works on desktop and mobile devices

Project Structure

• app/ - Next.js 13+ app router pages
  • settings/ - Settings pages (products, deposits, discounts, etc.)
  • fruits/, vegetables/, bakery/ - Product category pages (Fruits, Vegetables, Bakery)
• components/ - Reusable React components
  • ui/ - Base UI components (buttons, cards, inputs, etc.)
• context/ - React context providers
• services/ - API service functions
• types/ - TypeScript type definitions
• lib/ - Utility functions

Available Scripts

• npm run dev - Start development server
• npm run build - Build for production
• npm run start - Start production server
• npm run lint - Run ESLint

Backend Connection

The frontend connects to the SimplePOS24 Backend API. Make sure the backend is running on the configured URL before starting the frontend application.

Default backend URL: http://localhost:8081