Patient Prism Calculator

A full-stack calculator application built with Laravel 12, Vue 3, and Inertia.js. Features a responsive calculator UI with expression chaining, calculation history with a ticker-tape display, and keyboard input support.

Tech Stack

• Backend: Laravel 12, PHP 8.5
• Frontend: Vue 3 (Composition API), Inertia.js, Tailwind CSS
• Math Engine: mossadal/math-parser
• Testing: Pest PHP
• Dev Environment: Laravel Sail (Docker)

Features

• Basic arithmetic: +, -, *, /
• Exponentiation (^) and square root (sqrt)
• Nested parentheses
• Expression chaining from previous results
• Persistent calculation history with delete and clear all
• Keyboard input support
• Optimistic UI updates

Getting Started

Prerequisites

• Docker and Docker Compose

Setup with Laravel Sail (Docker)

# Clone the repo
git clone <repo-url> && cd fullstack-calc

# Copy environment file
cp .env.example .env

# Install PHP dependencies
docker run --rm \
    -u "$(id -u):$(id -g)" \
    -v "$(pwd):/var/www/html" \
    -w /var/www/html \
    laravelsail/php85-composer:latest \
    composer install --ignore-platform-reqs

# Start the containers
./vendor/bin/sail up -d

# Generate app key
./vendor/bin/sail artisan key:generate

# Run database migrations
./vendor/bin/sail artisan migrate

# Install frontend dependencies and build
./vendor/bin/sail npm install
./vendor/bin/sail npm run build

The app will be available at http://localhost.

For development with hot-reload:

./vendor/bin/sail npm run dev

Local Setup (without Docker)

Requires PHP 8.5, Composer, Node 22+, and SQLite.

composer install
cp .env.example .env
php artisan key:generate

Update .env for SQLite:

DB_CONNECTION=sqlite

touch database/database.sqlite
php artisan migrate
npm install
npm run dev
php artisan serve

The app will be available at http://localhost:8000.

Running Tests

# With Sail
./vendor/bin/sail artisan test

# Without Sail (uses SQLite in-memory via phpunit.xml)
php artisan test

Keyboard Shortcuts

Key	Action
0-9, .	Input digits
+, -, *, /, ^	Operators
(, )	Parentheses
Enter or =	Evaluate
Backspace	Delete last character
Escape or C	Clear

Project Structure

app/
  Actions/              # Business logic (EvaluateExpression, GetCalculationHistory, etc.)
  Http/Controllers/     # CalculatorController (thin, delegates to Actions)
  Models/               # Calculation model
resources/js/
  Components/Calculator/  # CalculatorShell, Display, Keypad, Button, TickerTape
  Composables/            # useCalculator, useHistory
  Pages/Calculator/       # Index.vue (main page)
tests/
  Unit/                 # Action tests (14 tests)
  Feature/              # Controller endpoint tests (7 tests)

License

MIT