Preface
A warehouse needed a streamlined way to track employee hours and tasks. They wanted to allow employees to scan badges or barcodes to log start and end times for specific tasks. I created an interface tailored to their workflow, including a filtering system that syncs with the URL for easy reporting and sharing.
Technical Decisions
Architecture I chose a decoupled architecture: a Vue.js SPA frontend communicating with a Laravel API backend.
Backend Laravel 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.