Laravel API Development & Vue JS SPA [COURSE]

welcome to level API development with view Jas single page application from scratch the following episode is going to be an

excerpt from the full course now available on udemy if you are interested in developing robust laravel api's with a front-end built on view and tailed when CSS then this is

the course for you we go into great detail talking about things like authentication testing tailwind CSS view j/s levo PHP unit and so much more so I hope you'll join me for the full course

go ahead and click on the link in the description to get sent to the udemy page where you can purchase the full course I hope you enjoy this episode let's get right to it so our project

name is jot so we're gonna run level new dot now of course this is gonna craft a brand new layer of application and it's gonna set up everything that we need so let's go ahead and let it install and

we'll be right back okay it's ready to go let's go ahead and CD right into that directory and then we'll open it up in phpstorm ok so as with every single brand new

layer of our application there's gonna be some setup involved with this so the first thing is I know that I'm going to need some sort of authorization and authentication so why don't we run the

make off command right now if you are not familiar with it you can run PHP artisan help make off so this command will basically scaffold everything that we need for a basic login and

registration this is what our application is going to use now of course we're going to use this in a slightly different way because we are building an API and we are not building

a true 100% level application it's going to have that mixture of view and it's going to be powered by an API that level is going to power for us so let's go ahead and run PHP artisan make off and

this again will scaffold everything that we need so if we jump back to PHP storm we can take a look at some of the files that are added for example if we're going to our web dot PHP file this file

now contains all of our authentication routes so that's pretty cool that laravel does that for us automatically we're actually not going to need a lot of this stuff

here so I will erase it eventually so next in our setup how about view of course we know we're going to use view but by default level actually ships with bootstrap and view

so let's take a look at that let's go to our package JSON file right in the root of our project and take a look at this we have bootstrap we have jQuery so there's a couple of things here that we

don't need so to get rid of these of course we could go in through the code and do it manually but better than that we can use another PHP artisan which is PHP artisan presets

and if we run PHP artisan help preset of course we're gonna get a help for the same thing so what are the types of arguments that we can put well we could say none bootstrapped view or react so

why don't we run none first this will clear everything out and then we'll just simply run view so let's say PHP artisan preset none and now if we go back here we see that all of it kind of

disappeared now it does leave some stuff behind like low - and Axios which we are going to need so it's pretty cool that it leaves those in for us now if we take a look at the entry point for our

application and that's going to be inside resources J s FJ s we are requiring a file called bootstrap now don't get confused with bootstrap as in Twitter bootstrap but bootstrap is just

simply a bootstrapping file which actually bootstraps our JavaScript front-end so don't get those two confused so right into our window we are requiring low - and Axios so that's

pretty cool the other thing it's doing is it's setting our common headers so that way Axios knows what to do on top of that we're also going to be setting our CSRF token and all of this comes out

of the box so that's fantastic but nowhere in here do we see view we need to bring in view along with a couple of other things so why don't we run PHP artisan presets view and let's

see what that does for us so let's go back here and sure enough now we have view available to us and it is required and if we move back to the package.json file we do have view now

now there's going to be two more dependencies that we're going to need so why don't we require those now so to bring in a new package we can say npm install and what I'm looking for is view

- router and tailwind CSS and then we're going to save those in our dependencies for development now there are two sections for this we want them inside the dev dependencies a little bit of

this has to do with the way that we're going to deploy our projects so we're going to compile all of our JavaScript files so there's no need for us to actually have any of these NPM packages

installed in a production server so let's go ahead and run that command now and with this we've installed a couple of dependencies that we're going to need for our project mainly tailwind CSS view

and view router and we've also cleared out of any unnecessary bootstrap stuff that comes with laravel alright so we're just about ready but of course our routing needs to be different now

typically in a PHP application with levo we're gonna use the web browser but of course in a single page application we need to pull in view router so in the next lesson let's go ahead and get

started with view router