# Tracking Warehouse Inventory with Laravel, Vue.js, and Barcode Scanning

> A vinyl fencing company needed a warehouse inventory system. I built a Vue.js SPA with barcode scanning and shareable filters, backed by a Laravel API.

- Author: Brian Kimball
- Published: 2022-01-08
- Tags: development, vuejs, laravel
- Canonical: https://brian-kimball.com/blog/inventory-tracker/
- Markdown: https://brian-kimball.com/blog/inventory-tracker/index.md

[Github Repo](https://github.com/bskimball/inventory-tracker)

## Preface

A vinyl fencing company needed a simple system to track warehouse inventory. Requirements included scanning vendor barcodes to receive items, looking up inventory, filtering with shareable URL-synced links, and a pre-programmed interface for different item types.

## Technical Decisions

**Architecture**

I chose a decoupled architecture: a Vue.js SPA frontend communicating with a Laravel API backend.

**Backend**

[Laravel](https://laravel.com/) provides a complete, robust framework. Inspired by Rails but built on PHP, it enables a single developer to build full-stack applications efficiently.

**Frontend**

The frontend uses Vue.js and Vite.

- **Vite:** Faster and easier to configure than Laravel Mix or Webpack.
- **Vue.js:** Excellent performance and reactive state management.
- **UI:** Bootstrap 5, which integrates well with Vite + Vue and offers utility and component classes.

**Deployment**

I use Docker to deploy both frontend and backend containers to an Ubuntu server. A Traefik proxy manages access, with NGINX behind it to serve both applications from the same domain. While Traefik can handle this, the NGINX container improves portability.
