Paykit

A production-ready retail POS template with web and desktop interfaces, built with Next.js and Electron. Bring your own database — wire it up in lib/db.ts and ship.

Buying this as a template? Read TEMPLATE.md first — it covers the rename/rebrand checklist, lib/db.ts implementation, and the in-memory demo adapter for a quick first-run.

Features

• Dashboard Overview: Visual representation of price trends and summaries
• Price Management: Add and track product prices over time
• Daily & Monthly Reports: Analyze price changes on daily and monthly basis
• Checklist Management: Organize tasks and shopping lists with checklist functionality
• Data Export: Export price data to PDF and other formats
• Cross-Platform: Available as a web application or desktop application (Windows, macOS, Linux)

Tech Stack

• Frontend: Next.js, React, TailwindCSS, Radix UI components
• Charts: Chart.js, Recharts for data visualization
• PDF Export: React-PDF, jsPDF for document generation
• Database: Bring-your-own — implement the adapter in lib/db.ts
• Desktop App: Electron
• Form Handling: React Hook Form with Zod validation

Getting Started

Prerequisites

• Node.js (v16 or later)
• Bun package manager
• Git

Installation

1. Clone the repository:

   git clone https://github.com/yourusername/paykit.git
   cd paykit

2. Install dependencies:

   bun install

3. Wire up a database: This template ships without a bundled database. Open lib/db.ts and implement each exported function against your chosen backend (Postgres, MySQL, SQLite, Supabase, Firebase, a REST API, etc.). Until these are implemented, every API route will throw a clear "not implemented" error.

   To try Paykit before picking a backend, swap in the in-memory demo adapter:

   cp lib/db.ts lib/db.backup.ts
   cp lib/db.example.ts lib/db.ts

   Data in the demo adapter is ephemeral — fine for exploration, not production.

4. Set up environment variables: Copy .env.example to .env and fill in any values your lib/db.ts implementation needs.

5. Run the development server:

   bun run dev

6. Open http://localhost:3000 in your browser to see the application.

Running the Desktop App

1. Start the development server:

   bun run dev

2. In a new terminal, run the Electron app:

   bun run electron

Building for Production

Web Application

bun run build
bun run start

Desktop Application

bun run build
bun run electron-build

After building, you can find the packaged desktop application in the dist directory.

Project Structure

app/                  # Next.js app directory with pages and API routes
  api/                # API routes for data operations
  checklist/          # Checklist feature pages
components/           # Reusable React components
  ui/                 # UI component library
electron/             # Electron-specific code for desktop app
hooks/                # Custom React hooks
lib/                  # Utility functions and database logic
  migrations/         # Database migrations
public/               # Static assets
types/                # TypeScript type definitions

API Routes

The application provides the following API endpoints:

• /api/prices - Manage product prices
• /api/checklist - Manage checklist items and sheets
• /api/summary - Get summarized data for dashboards

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

• Next.js
• Electron
• TailwindCSS
• Radix UI
• Chart.js