How to Follow Along in this Course — Transcript

Transcript of the free Vue.js lesson How to Follow Along in this Coursewatch the video lesson.

Let's talk for just a minute about how to best follow along with this course. I've created a code base that has a page for each lesson within the course with code already typed out for you to follow along with in each lesson. Those of you who are familiar with Nuxt probably recognize this folder structure. So yes, the code base is written in Nuxt, but if you're not a fan of Nuxt, Don't worry about it.

Everything I teach about Pina Colada will transfer one-to-one to a Vanilla View application. The only real difference is that in Vanilla View, the install will be a little bit different, so I recommend you read the docs for that bit. I don't want to bore you with it. And in Nuxt, the functions exposed from Pina Colada are auto-imported.

You'll just have to import those manually if you're using straight view. I chose to work in Nuxt just to save myself a little bit of time and most importantly so that I could bootstrap a backend and a database that accepted updates to that database as opposed to some off-the-shelf dummy JSON API. This was really necessary to best show you how mutations work. That said, one thing you will need to do to make sure the database is up and running for your project is first of all just run the dev server with npm run dev or pmpm dev and all the database migrations will automatically be applied.

There's also no need to install some external database like Postgres or MySQL because we are using an SQLite database that gets automatically created for us when you start up that dev server. The only thing you will have to do is run a seed to get data in the database. You can do that by visiting the DevTools at the bottom of the page. Inside of the little ellipsis menu, you can choose the database, and there you can see the tables that have already been migrated for you.

But yeah, they're currently empty. So in order to seed them, come to this Server Tasks tab, which looks like a play button, and then run this task right here. Let me zoom out some, here it is, called Seed. Run that.

If you go back to the database tab then and refresh the products table, you'll see the seeded data. If at any point during the course we arrive at a lesson that you don't see a page for, that's probably because we're progressively releasing the course and you may just have to pull from the GitHub repo one more time to get the latest pages to follow along with. So use the link in the description below. to download the code base now, and we'll start learning Pina Colada in the next lesson.