Vue-CRUD Application

A Complete Single Page Application (SPA) or Product CRUD Application using Vue 3, Vue Router, Vue-Pagination, Searching, Sweet Alert, Vuex and all....

Vue-3 CRUD Project Demo

Let's check the whole demo of the application of Vue-3 Complete CRUD with Vuex:

View Demo From Youtube -

Vue-3 CRUD Project Todo List

Setup Part

• [x] Vue JS Page Setup
• [x] Vue Router Setup
• [x] Vue-Bootstrap Setup
• [x] Vuex Setup for Central Storage Management

CRUD Part

• [x] Page Design
  • [x] Product List Page Design
  • [x] Product Create/Edit Page Design
  • [x] Product View Page Design
  • [x] Product Delete Modal
• [x] Product List
  • [x] Product List API Integration
  • [x] Product Pagination
  • [x] Product Searching
• [x] Product Create
  • [x] Form Validation throw Vue-validate
• [x] Product Edit
  • [x] Product Details Loading and Edit
• [x] Product Delete
  • [x] Sweet Alert or other alert system

Project setup

git clone https://github.com/ManiruzzamanAkash/Vue-3-Advance-CRUD.git
cd Vue-3-Advance-CRUD

Copy .env.example to .env and run

npm install

API Project Setup (Laravel API)

https://github.com/ManiruzzamanAkash/Laravel-Basic-CRUD-API

Note: It could be your api if you want. Just follow the process. It's super simple by using Laravel with PHP

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint