Laravel Vue.js CRUD with Image Upload

This repository contains the complete source code for the tutorial:
👉 Laravel Vue.js CRUD with Image Upload – Full Guide
Read the full tutorial here:
https://laravelcenter.com/laravel-vue-js-crud-with-image-upload/

This project demonstrates how to build a Vue 3 + Laravel CRUD application with image upload, using Axios, Bootstrap 5, and Vue components.

---

🚀 Features

• Full CRUD operations (Create, Read, Update, Delete)
• Image upload with preview & validation
• Vue 3 Composition API
• Axios for API requests
• Bootstrap 5 UI
• Laravel API with clean controller structure
• SPA-style interaction (no full page reload)

---

🛠 Installation

# Clone this repository
git clone https://github.com/YourUsername/laravel-vue-crud-image-upload.git
cd laravel-vue-crud-image-upload

# Install backend dependencies
composer install

# Install frontend dependencies
npm install

# Build frontend assets
npm run dev

# Configure environment
cp .env.example .env
php artisan key:generate

# Run database migrations
php artisan migrate

# Create storage link for uploaded images
php artisan storage:link

# Start the development server
php artisan serve

📦 Tech Stack

• Laravel 12
• Vue.js 3
• Axios
• Bootstrap 5
• MySQL
• PHP 8+

🔗 Tutorial

Follow the full step-by-step tutorial here: https://laravelcenter.com/laravel-vue-js-crud-with-image-upload/

📌 Topics / Tags

laravel | vue | vue3 | axios | crud | image-upload | bootstrap | spa | laravel-vue | web-development | tutorial

⭐ Support

If this tutorial helps you, please star this repository and follow me on GitHub. Your support motivates me to create more high-quality, free tutorials.