• Vue CRUD allows to create both a mechanism for managing a single table, as well as a CMS or extended CRM with a login system and modules
• Application built with Vue CRUD is SPA (Single Page Application) so it works much faster than apps based on Wordpress, Joomla, etc.
• Vue CRUD uses the vue along with its ecosystem (Vuex, Vuetify, etc). Enjoy the benefits of the most popular JS framework in the world.
• The application architecture is adapted to work with REST API

To check out docs, visit :

Credentials with limited privileges (readonly):
Login: [email protected]
Pass: ajSGenC0
To get full user account, contact me on my company site.

Vue CRUD provides a set of utitlities, from which you can compose your own application. Features included in the system can communicate with each other thanks to the use of the Vuex library. Vue CRUD includes the following elements:

• CRUD,
• Authentication system:
  • login form (built-in communitation with API, validation),
  • optional locale selection,
  • redirecting to the app,
• App layuout components:
  • Toolbar (with optional elements):
    • title,
    • logo,
    • user profile,
    • locale selection,
    • logout,
    • slots for developer
  • Sidebar:
    • List of routes,
    • Slot for title or user avatar,
    • Slot for developer,
    • Customizable sidebar behaviour
  • Alerts system,
  • Footer,
  • ... and others

The CRUD is a mechanism for managing the database tables. Included CRUD system allows the following operations:

• Store,
• Update,
• Suspend/Restore,
• Delete,
• Multiple update,
• Multiple Suspend/Restore,
• Multiple Delete

The record creation / editing form supports the following types of fields:

• Input,
• Number,
• Decimal
• Textarea,
• Rich Text Box,
• Select (list from related table),
• Datepicker,
• Timepicker,
• Checkbox,
• Files

Datatable is available in 2 versions:

• Client side (small tables < 2000 records)
• Server side (> 2000 records)

Each version has its own filtering system:

• Show active/inactive records,
• Search phrase in whole table,
• Search phrase in selected column (exact, like and list mode)

Another functions and features:

• datatable mechanism allows selection of the number of records per page, page transition and sorting,
• management of a child table from the parent table module,
• language versions,
• simple configuration of themes,

Do you want to test the application quickly, and you do not have a ready API? No problem, you can use the ready-made example in the examples folder. The API for this example is available on the internet, so you can connect to it by entering its address in the configuration file.

• Select template from examples folder you want to use, e.g. examples/simple-crud. Then:
• Copy examples/simple-crud/public folder to the root directory,
• Copy the rest of files and folders (config, locales, routes, main.js, router.js) from examples/simple-crud folder to the src directory,
• If you have your own API prepared, modify src/config/api.js file,
• Type following commands:

yarn
:: or
npm install

and then:

yarn serve
:: or
npm run serve

... and your app is already running (probably at https://localhost:8080).

The application requires a connection with the appropriate API. API can be created in any technology - the condition is its compliance with the Vue CRUD communication specification. If you need to create your API and do not know how to get started, and you don't mind PHP and Laravel, download or clone the Vue CRUD Laravel API project.

If you have an idea about improving Vue CRUD, do not hesitate.

Developers interested in contributing should read the Code of Conduct.

MIT

Copyright (c) 2018-present, Szczepan Masny