Playing
02. Fresh Laravel and Vite projects

Transcript

00:00
So, as the first step, let's go ahead and get two projects set up, our Laravel API and our client.
00:07
Okay, let's go ahead and start by making a directory and we're going to call this Laravel Sanctum View. This will house both of our projects. So, let's cd into that directory and we'll start things out by creating out our Laravel project. We're not going to need to do too much to this just yet, we just want to make sure that it's installed, the migrations are run
00:28
and we can get it open in the browser. Okay, let's go ahead and use the Laravel installer to create this and we're going to create this as Laravel Sanctum View API. Let's go ahead and run this. We're not going to use the starter kit because we're going to be pulling in Laravel Fortify which will provide us all of our authentication functionality a little bit
00:47
later. So, let's choose no starter kit and we'll choose whichever testing framework we want and just wait for everything to install. Okay, now that's done, let's choose a database provider. We're going to use MySQL here and we'll go ahead and choose to run the default migrations and also create this database as well. Okay, now that's done, we should have a fresh database created
01:08
and we'll just go ahead and open this up in the browser just so we can see that this is working. And yeah, sure enough we have a fresh project up and running. Like I said, we're not going to be doing too much for this yet, we'll get to what we need to install a little bit later. Okay, so now that we've got our API, we're going to go ahead and create out a new VEET project with npm create
01:29
and we're going to use Vue of course and latest. Let's go ahead and run through the options that we want for this. The first thing is to give this a name. So, I'm going to give it exactly the same name here, Laravel Sanctum Vue, but I'm going to call this client. Next, we are not going to add TypeScript, although you can. No JSX support and we do want to use Vue Router because when we build
01:51
the system later, if you want to go ahead and follow that, we are going to need routing. We don't need state management and we are going to ignore the end-to-end and unit tests for now and also ESLint. Okay, we can say no to this last one and we are done. So, let's go into the Laravel Sanctum Vue client directory and let's just follow the steps here to install this
02:14
and then npm run dev. Okay, great. So now that's done, we should be able to open this in the browser and you should see something like this and we now have a fresh project up and running. So, that is both of our projects up and running. Let's go ahead and get these open in our editor and we can get started. So, let's go into the Laravel Sanctum Vue API project and we'll go ahead and
02:38
open this up with phpStorm. Once that's open, we'll go ahead and do exactly the same thing with the client. So, let's go into the client directory and open this with phpStorm and then what I'm going to do is just go ahead and combine these project windows just so we have them side by side and we can work with them more easily. Okay, so both of our projects set up and we can move on.
21 episodes1 hr 35 mins

Overview

Learn how to authenticate with a Laravel API from Vue using the Composition API.

We'll start by setting up a fresh Laravel project with Sanctum and Fortify, configure everything step-by-step, and then implement the ability to authenticate from Vue with a simple auth module — thanks to the flexibility of the Composition API.

In the second half of the course, we’ll create our own beautiful starter kit with more features, including registration and middleware to protect routes.

Alex Garrett-Smith
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!

Episode discussion

No comments, yet. Be the first!