Vue.js - How to use Vuetify - Install and configure

Vuetify is a great UI KIT library for Vue.js framework. You can save time and effort with using a kit library provides a lot of pre-built UI elements like lists, tables, spinners or even a grid.
Vuetify has great documentation to help you learn everything from installation to components or customizing themes.

Vuetify only supports Vue 2 at the moment. The Vue 3 (Vuetify Titan release - v3.0) support is expected to be released in the summer of 2021.

This video is about installing and setup Vuetify in a standard Vue application from scratch.

Vuetify official documentation: https://vuetifyjs.com/en/

Source code from the video: https://github.com/davidcsejtei/vue-with-vuetify

0:00 - Start
0:23 - Create a Vue.js project
0:43 - Install development dependencies
1:18 - Install production dependencies
1:45 - Open project in VS Code
2:08 - Set up Vuetify as a plugin
3:15 - Add vuetify instance to the Vue instance
3:53 - Replace root element with v-app and remove parts
4:30 - Add router
5:13 - Create first page component
5:44 - Finish router settings
6:41 - Add router to the Vue instance
6:54 - Start application in development mode
7:07 - Open application in a browser
7:23 - Visit Vuetify official website
7:40 - Copy a basic Grid component from Vuetify docs
7:50 - Basic grid result
8:25 - Copy a list component from Vuetify
9:15 - List component result

Udemy profile: https://www.udemy.com/user/david-csejtei/
LinkedIn profile: https://www.linkedin.com/in/davidcsejtei/
Medium profile: https://codinglikedavid.medium.com/

🚀 Join my slack group to get help: https://join.slack.com/t/codinglikedavid/shared_invite/zt-wowi9q4g-0N_ngfSx0dcOUMaRftdylQ

Видео Vue.js - How to use Vuetify - Install and configure канала CodingLikeDavid