This episode is for members only

Sign up to access "Build a Pay Once For Access App" right now.

Get started
Already a member? Sign in to continue
Playing
02. Setting up Laravel and Breeze

Transcript

00:00
Just in case you're new, let's go ahead and start with a fresh Laravel project and we'll be pulling in Laravel Breeze, which is a starter kit for Laravel. So I'm going to go ahead and use the official Laravel installer here to create a new app called Pay for Access.
00:15
Let's just go ahead and run that and wait for that to finish. And now that's done, let's go ahead and open this up in our editor. OK, so that's open and we're within this directory. The first thing that we'll do is just head over to the EMV file
00:26
and just update some things in here. So we'll update our database here because I'm using Postgres. Of course, you can leave that as MySQL. Let's take a note of the database name, which we'll need to create.
00:36
And let's go ahead and fill in our username and password if we have one. Now, I've already gone ahead and created out the database just here. So all we really need to do here is run php artisan migrate just to run the default migration.
00:47
So that will create our users table. And we're, of course, going to need to authenticate when we are accessing this app. OK, so let's go ahead and install Laravel Breeze. So we'll come down to the installation instructions here.
00:58
We just need to do a composer require on this and then publish all of the assets. So let's go ahead and run that and come ahead and go php artisan breeze install. That will create a load of controllers for us. So if we just head over to app and HTTP and controllers,
01:13
we've got all of these controllers under here, which we don't really need to look at the moment unless we need to extend these. The last thing that we need to do is just run npm run install or npm install and npm run dev.
01:26
And that will go ahead and install all of our dependencies for our client side. And it will also go ahead and just bundle everything for us. OK, so those are our dependencies and our build taken care of. The main reason that we did this is, of course,
01:40
we're going to need the CSS in there, which is driven by Tailwind. But also, if we just head over to our resources section under JS and app.js, you can see that we're actually importing Alpine JS here. Now we're going to be using Alpine for our checkout.
01:54
This is just going to make it a little bit nicer to use rather than doing this in pure JavaScript as per the Stripe documentation. So if you're new to Alpine, we do have a course on that. But I'll be guiding you through everything that we're doing here as well.
02:07
OK, so we're going to go ahead and just run PHP artisan serve for the purpose of this. It's going to start up a local development server. And we can now come over here and just give this a refresh. You'll notice that we now have login and register at the top.
02:20
So a good start would be to go ahead and just register an account. So let's fill in all of these details and go ahead and hit register. And there we are. We're over in our dashboard.
02:30
So now we're at this point. Let's head over to the next episode and let's create out this members area, which, of course, does not exist at the moment. And we're going to be protecting this with some middleware.

Episode summary

In this episode, we start things off by setting up a brand new Laravel project, which we’ll use as the foundation for our app. We use the official Laravel installer, so you get to see exactly how a fresh Laravel app gets created (in this case, it’s called "Pay for Access").

We jump right into configuring our environment – changing up the .env file to point to our database (Postgres in my case, but you can stick to MySQL if you prefer). Don’t forget to create the actual database!

With our environment ready, we run a quick php artisan migrate to get our default tables set up, including the users table.

Next, we pull in Laravel Breeze, which gives us a clean starting point for authentication (think: login, register). You’ll see how simple it is to add with Composer, and we take a peek at the generated controllers (you usually won’t need to touch these until you want to customize auth).

After installing Breeze, we handle the front end: running npm install and npm run dev to pull down and bundle all required assets. This includes Tailwind CSS for styling and Alpine.js for snappy interactivity — we highlight Alpine since we’ll use it to power our checkout in future episodes.

To wrap up, we fire up the local dev server and confirm everything’s working by registering a test user and landing on the dashboard. Things are looking good!

In the next part, we’ll tackle creating the members area and protecting it so only logged-in users can access it.

Episode discussion

No comments, yet. Be the first!