Coding

Updating the Project to Vuetify 0.14 and Vue 2.4 | Vue.js + Vuetify + Firebase FULL PROJECT

  • 00:00:01 welcome to this video about our view
  • 00:00:03 verified firebase project that's a super
  • 00:00:06 short video and it might not matter to
  • 00:00:08 you if you already created your project
  • 00:00:11 with a later version we'll all unify but
  • 00:00:14 I use two version 0.13 and as I
  • 00:00:17 announced that earlier video from time
  • 00:00:19 to time things are going to change now
  • 00:00:21 if you don't upgrade the version you
  • 00:00:23 don't need to change anything but since
  • 00:00:25 view chase version 2.4 was also released
  • 00:00:28 we can upgrade here so what I'll do is
  • 00:00:31 I'll actually upgrade this to version 2
  • 00:00:35 4.1 for view and 0.14 for a beautiful
  • 00:00:41 now these versions generally don't break
  • 00:00:44 a lot or not nothing at all almost but
  • 00:00:47 for do defi there are two changes we
  • 00:00:49 need to implement now first of all once
  • 00:00:52 you change two versions here in the
  • 00:00:53 package to Jason that alone doesn't do
  • 00:00:56 anything so you actually need to ensure
  • 00:00:58 that you also install these new versions
  • 00:01:01 by rerunning NPM install feel free to
  • 00:01:04 delete the node modules folder before
  • 00:01:06 you run this command in case you're
  • 00:01:08 running into any errors with that
  • 00:01:10 command with that it's now updated to
  • 00:01:13 the latest version so both view and
  • 00:01:15 beautify and now we need to change
  • 00:01:17 something in our source code otherwise
  • 00:01:19 it will not work if I would run NPM run
  • 00:01:23 Def write this without updating its wait
  • 00:01:27 for the development server to start here
  • 00:01:29 now if we're looking at our application
  • 00:01:32 you see well it still does work here
  • 00:01:36 also if they decrease that but actually
  • 00:01:40 there were some changes with the latest
  • 00:01:43 version of beautify which you can read
  • 00:01:44 about in their release notes that
  • 00:01:48 require us to implement queue changes
  • 00:01:51 which will otherwise break our code in
  • 00:01:53 the future the first one were actually
  • 00:01:55 both are in the app dot view file here
  • 00:01:58 with one can now remove the native
  • 00:02:00 modifier because due to some changes
  • 00:02:02 introduced by with butyl you a 2.4 we
  • 00:02:06 now don't need it anymore
  • 00:02:07 so that is now handled differently
  • 00:02:09 behind the scenes we cannot listen to
  • 00:02:11 the click event without that and
  • 00:02:13 additionally
  • 00:02:15 we may now remove the router property
  • 00:02:17 here having the tooling here is all we
  • 00:02:20 need and behind the scenes you beautify
  • 00:02:22 will figure out that we want to use the
  • 00:02:24 router so that router link is neither
  • 00:02:26 anymore
  • 00:02:27 neither on the list style nor on the
  • 00:02:29 button ear now with that if we save that
  • 00:02:32 and let it recompile you will see that
  • 00:02:35 our application we reload it still works
  • 00:02:38 just as it did before so that's all
  • 00:02:41 working and if we expand this empty the
  • 00:02:44 developer tools you see we don't get an
  • 00:02:45 error the drawer is also still working
  • 00:02:48 that's the tiny update just wanted to
  • 00:02:50 bring this to your attention the source
  • 00:02:52 code attached to these videos or shown
  • 00:02:55 in the github repository actually is
  • 00:02:58 updated from now on to that version I
  • 00:03:00 just want to highlight that you are
  • 00:03:03 aware of this now with that let's go
  • 00:03:04 back to a real video where we build
  • 00:03:07 something new instead of just updating
  • 00:03:09 something