CRUD operations and form validations using Vue and Bootstrap-Vue. Table sorting, filter, search and Pagination are implemented with localStorage. I’ve prepared this simple application to summarize the majority of ways we can think about managing state (i.e. data) in a Vue application.
Vue Bootstrap application with CRUD operations, multiple filters, rest api calls and pagination
Project setup
npm install
Compiles and hot-reloads for development
npm run serve
Features available in the applilcation:
- Perfect Folder Structure
- Vue Bootstrap style implemented
- Router
- Vuex
- Common Loader added
- REST API implemented
- CRUD Operations (Create, Read, Update, Delete)
- Vuelidate (Form Validation)
- Multiple filters and Sorting added
- Pagination added
- Custom Utils functions (localstorage, … etc)
- Modal Popup implemented
Screenshots
List with multiple filters and pagination
Edit List Item
Bootstrap Table and Bootstrap pagination with REST API call