Vuetify: Make a VueJS app look good, even if you're bad at design (Building a VueJS app Part 3)
In this tutorial we're going to take a functional but ugly app and turn it into a beautiful app -- or, at the very least, one that's less ugly -- using Vuetify, a Material Design library for VueJS.
0:00 Start
1:00 Why Vuetify?
4:36 Installing Vuetify
11:00 Fixing the Video List
34:10 Fixing the Video Watch page
Specifically, we're going to cover creating a navbar, improving button style and interaction (such as @mousedown events), using the inbuilt style classes (including color), using a bootstrap-style rows/columns layout, and using a cards layout.
Previous video in series: • Vuex: Loading data using axios, deser...
Next video in series: • VueX + LocalStorage to track video wa...
Playlist: • Building a VueJS screencasting app fr...
** Github links **
* Installing Vuetify: https://github.com/jeffreybiles/vue-s...
* Making nice buttons and header: https://github.com/jeffreybiles/vue-s...
* Turning videos into cards: https://github.com/jeffreybiles/vue-s...
* Vuetifying the video watch page: https://github.com/jeffreybiles/vue-s...
I hope you enjoy, and please continue to like/comment/subscribe! Your comments so far have been both helpful and encouraging!
** Find me online! **
Twitter: / vuescreencasts
Website coming soon.
#Vuetify #VueJS #Tutorial #UIFrameworks #Vue #2019 #Javascript