Laravel 12+ & Vue 3: Build a Real-Time Parking App

Set up a Laravel app with MySQL, create and migrate sectors, places, reservations, and Skype sessions, seed default sectors, define relationships, and run migrations to support real-time parking.

Learn to define model relationships in a Laravel 12 app by linking sectors, places, reservations, and users. Prepare a place controller to display data on the front end.

Create a place controller and place resource in the API v1, wiring sector and reservation relationships, returning JSON resources. Install API, migrate, and define routes for places, reservations, and users.

Set up a routes folder with index.js to define a router using history, add a home route with a lazy-loaded component, and wire it into main.js and app view.

Implement a Laravel 12 reservation API with ReservationController@store for a real-time parking app; validate existing reservations and parked status, reserve a place transactionally, and return a JSON place resource.

Reserve a place by posting via Axios with place_id, update status from available to reserved without refreshing the page, and refresh the places in real time with event-driven UI.

Implement start parking in a real-time parking app with Laravel 12 and Vue 3, updating reservations to parked, setting start time with Carbon, and handling routes.

End parking completes the reservation flow by updating status to finished, setting end time, freeing the place, calculating hours and amount per hour, and returning a JSON response.

Optimize the backend by refactoring tests into private functions that verify reservation ownership and return standardized json responses. Streamline the workflow toward frontend optimization with reusable patterns and consistent messaging.

Optimize the front end of the parking app by refactoring to a centralized api layer, handling place reservations, cancellations, and parking actions with robust error handling and toast feedback.

Learn how to implement a Laravel 12 user API with registration, login, and logout, including request validation, authentication tokens, and user resource responses for a real-time parking app.

Learn to render per-field validation errors for registration and login with a reusable render form validation errors component and handle 422 errors using a loading overlay during API calls.

Transform registration into login flow with email and password validation, spinner, and login api; capture access token and user, and store credentials in a global pioneer store.

Display the currently logged-in user in the navbar and add a logout link using a Vue 3 and Laravel 12 setup, with store-driven user data, token handling, and persistence.

Learn to log out users, protect routes, and manage authenticated access in a Laravel 12 & Vue 3 parking app by guarding routes, updating the store, and handling token-based logout.

Create a logged-in user profile in a Laravel 12 and Vue 3 real-time parking app. Display user details and reservations, with login-protected routes and upcoming Stripe payments.