Build a File Marketplace with Laravel

Sign in Get started

This episode is for members only

Sign up to access "Build a File Marketplace with Laravel" right now.

Already a member? Sign in to continue

Playing

20. Adding a user subdomain on registration

Episodes

0%

Your progress

Total: 3h 32m
Played: 0m
Remaining: 3h 32m

Join or sign in to track your progress

01. Introduction and setting up

01. Introduction and demo

02. A fresh project with Laravel Breeze

02. Onboarding with Stripe

03. The onboarding screen

04. Registering the Stripe PHP library

05. Automatically creating Stripe accounts for your users

06. Forwarding users to Stripe Connect

07. Verifying if payouts are enabled

03. Creating products

08. Setting up and listing products

09. Installing Livewire

10. Building the product creation form

11. Automatically generating the slug from the product title

12. Validating and creating a product

13. Handling product file uploads

14. Attaching files to a product

04. Editing products

15. Creating the product edit form

16. Reviving product state

17. Showing and modifying existing files

18. Pulling together the product update process

19. Flashing an update message

05. User subdomains

20. Adding a user subdomain on registration

21. Subdomain routing basics

22. Adding a string macro to properly display the user's name

23. Listing the user's live products

06. Product checkout

24. Showing the product page

25. Creating the checkout success page

26. Starting the checkout flow

07. Storing sales

27. Handling Stripe webhooks

28. Storing product sales

29. Sending a confirmation email to customers

30. Securing Stripe webhooks

08. Accessing purchased files

31. Creating and validating the product download page

32. Displaying and downloading files

09. Sales dashboard

33. Calculating and displaying download stats

34. Listing through sales

Transcript

00:00

Let's now start working on user subdomains.

00:02

We know that each user is going to have their own subdomain where anyone can browse their products, but we need to bake this into the registration flow and also update this within the profile information here. So a user can change this if they need to. Now, the first thing that we're going to do is clear everything out of here.

00:21

So I'm going to go ahead and log out. I'm going to head over to the database and I'm going to delete this user. So we need to go through the entire flow here. Notice that's also deleted the products and all the files as well.

00:33

So we're going to head over to the register page and add in a new field here for the user to choose their own subdomain. We can do this under the register.blade.php view. Let's come all the way down here to under the password confirmation. And we want a kind of field that looks like the email address.

00:52

So let's just copy that and go ahead and paste it just down here in there. So if we head over, we've got a new field in there which we can now change around. So this is going to be for the subdomain. So let's go ahead and change this over to subdomain and then just change this over to subdomain and the type here over to text.

01:16

OK, so let's get rid of autocomplete and we'll leave in required because we are going to have it as a required field. Now, I'm going to change the design of this over very, very slightly. So what we're going to do is just underneath the input label, go ahead and wrap these two things inside of another div. And what we're going to do is create out a flex with an item center to this and a space X of two.

01:43

What that's going to do is it's going to allow us to add in the dot and then whatever domain name we're working on here. So what we can do is head back over and I'm actually going to pull this input error out of here as well. I'm going to say .cocourse.com just as an example. And if we come over, you can see sure enough that is in there and looking pretty much how we want it to look.

02:05

Now, we can go ahead and update this by putting this in a span and that's actually going to work a little bit better. And there we go. So that looks a little bit better. We've got a little bit of spacing and of course, you can tweak this if you want to. Now, we don't want this to say .cocourse.com.

02:21

We want this to be the name of our app or the domain of our app more likely. So what we can do is actually pull this from our app config and URL. So if we pull this over, notice that it doesn't quite look right at the moment. We've got HTTP colon forward slash forward slash in front of this, which we don't want.

02:40

So we can do a very quick string replace on this. So let's go ahead and wrap this in string replace. And of course, what do we want to replace out? Well, we want to replace HTTP colon forward slash forward slash or HTTPS with an empty string.

02:55

So if we come over now and give that a refresh, sure enough, that looks a lot better. And we can just very easily go ahead and add a dot in there just to show that that's going to be a subdomain. Now, at the moment, this looks a little bit squashed. So what we can do is on this span, go ahead and add a flex class of shrink zero so it doesn't shrink.

03:16

And what we should end up with is something like this. So now I can choose my subdomain, kind of see what it looks like, and I can hit register knowing that that subdomain is going to be stored. So now that we've got the design ready for this, we can go ahead and actually focus on the registration flow.

03:34

So because we pulled in Laravel Breeze, this already contains all the registration functionality for us. So where does that live? Well, if we head over to HTTP and controllers under auth, we've got this registered user controller. Let's have a look in here and see what we get.

03:49

So this is the view which we've just modified and store is, of course, where we validate and actually create the user. So we need to go ahead and update the validation rules. We need to update how this user is created and we should be done. The only problem at the moment is we don't have a column over in our database to actually store the subdomain.

04:10

Now, we can add that in very, very easily with a quick migration. So let's go ahead and call this add subdomain to users table. And if we open that up, add subdomain to users table, we can just add this in here really, really quickly. So this is going to be a string.

04:30

We'll go ahead and say subdomain. And really importantly, we need this to be unique because, of course, the same user can't have a subdomain the same as someone else. Let's just fill in the down migration really quickly by dropping that column subdomain. And we should be good.

04:47

So let's go ahead and run the migrations on this. And there we go. We now have a new column. So the first thing to do is head over to the user model.

04:54

Make sure we add this to our fillable field just in here, subdomain. And now we can update the validation rules and the creation of the user. So for the validation rules, this is going to be very similar to email. So let's just copy that one down.

05:09

Let's go ahead and add in subdomain. This is required. It needs to be a string. It doesn't need to be an email address, of course.

05:16

We can set a max of 255 on there. And it also needs to be unique to the user's model as well. Now, we need to be careful here because string can mean pretty much anything. So we're actually going to change this over to alpha so it can only contain alpha characters.

05:31

We don't want any numbers in there at the moment. We just want this to be super plain. So now we've got the validation rules in there. Let's go ahead and just try this out.

05:40

Hit register. And yeah, of course, because we've got some front-end validation in here, this, of course, isn't going to work properly. But we can validate that by removing them required fields over in register if we want to.

05:52

Okay, so to store the subdomain, let's go ahead and add this in here. And that just comes from the request and its subdomain. That's pretty much all we need to do. Okay, so I'm going to go ahead and register a new account here.

06:04

So let's fill in all my details again. The unfortunate part about testing this manually is that we're going to have to go through the entire Stripe flow again. So I'm going to choose a subdomain and hit register. We should see that user registered successfully in the database.

06:18

Let's check this out. We've got our subdomain in there. But now we're going to have to go through the connect with Stripe flow again. So I'm going to do that really quickly.

06:27

And I'll be back with you in a second so we can carry on with the rest of our subdomain stuff. Okay, so I am back from the Stripe flow again. And we've got our subdomain, but we need to be able to edit this under profile information. So we're going to go through pretty much the same thing as we did with the register page.

06:45

But this is now under the update profile information form blade component just over here. And if we just come down here, we looked at this earlier to steal the header. We're going to go all the way down to the bottom here and put this underneath this section just here. So once again, what we could do is just grab one of these and just go down and paste it directly underneath here.

07:08

Let's just take a look. And there we go. This is now going to become our subdomain. So again, let's switch this over to sub domain.

07:17

We'll change over the value of this to subdomain and the type here is text. Subdomain there needs to be name. And we should be good with all that. Let's get rid of autofocus and we'll also get rid of autocomplete as well.

07:31

And we should be good. OK, so our subdomain is being pulled in automatically because all of this data comes from the currently authenticated user. We just want to make this look a little bit nicer. So we're going to do the same thing.

07:42

We'll wrap the text input within a div here. We'll go ahead and set a flex and items center on this and we'll set a margin. What do we do? Let's go over to our register page.

07:57

We set space X to two. Like so. And we can go ahead and copy this span out here, which is going to be exactly the same thing. Let's pull that in a bit.

08:07

And there we go. So that looks OK. OK, so now when we save this, nothing's actually going to be updated. So let's change this name and you can see nothing happens.

08:17

So again, what we're going to do is come over to the controllers that come with Laravel Breeze. And we want to go over to the profile controller just down here. So let's take a look at this. Edit is the form that we've just looked at.

08:31

Update is where we update this. So if we have a look here, we've got validated data that we're now pulling in. This will contain anything within validation rules that has been validated. And that's going ahead and filling it and saving the user.

08:46

So where do these rules come from? Well, the registration page is a little bit different to the profile controller. We have this profile update request. So if we open that up, you can see that that lives within requests and it's just in there.

09:01

And this will contain the validation rules. So once again, what we want to do is pull these over from our registered user controller. Pretty much the same rule. So let's go ahead and pull this in here.

09:13

Now, like we had before, we had an issue where if I save this, it already exists. So the subdomain has already been taken. So what we want to do with this unique rule is slightly change this over. So it excludes the current subdomain for our user.

09:29

Now, there are a few different ways that we can output this unique rule. We've already seen that we can say something like users and subdomain. In this case, what we've done, or which is the default within Breeze, it uses the class name itself, the fully qualified class name itself, which extracts out the table name and then puts it in there for you.

09:51

But we can get rid of this altogether and we can actually use the rule class within Laravel. What this will allow us to do is use any of the validation rules that this supports and we can enter the user model in there. So that has exactly the same effect as what we've already seen. And we can demo that by just saving this out.

10:13

But with this, it's a little bit more elegant in which we can use the ignore method and chain this on. So we want to ignore this user ID. And the reason this works is because this form request extends the current request, which means that we have access to the user. So this is now ignoring the current user.

10:36

When we save this, you can see it works. But now I can change this over because remember over in the profile controller, this uses any validated data which we now have inside of here. So let's go over and change this to Alexander and you can see that has now been updated.

Episode summary

In this episode, we tackle adding custom subdomains for users during the registration process of our app. We start off with a quick cleanup by deleting the previous user and their related data to ensure we're starting from scratch.

Next, we jump into modifying the registration form by adding a new field that lets users pick their desired subdomain. We walk through the tweaks needed in the Blade template to make the input look nice, complete with the primary domain shown alongside the subdomain for clarity. There’s also a bit of string manipulation to ensure the URL looks clean and professional.

With the UI changes in place, we move to the backend. We update the registration logic to validate and store the new subdomain, including adding a migration to give the users table a subdomain column (with uniqueness enforced). We also set up all the right validation rules to make sure subdomains are alphanumeric and unique, and adjust the user model to accommodate the new field.

Once registration is working, we don’t stop there. We then update the profile page to allow users to edit their subdomain after registration. This covers updating the form and tweaking the relevant controllers and request validation logic, including using more advanced Laravel validation rules to let users keep their current subdomain without running into uniqueness errors.

By the end of the episode, users can pick and update their subdomain seamlessly, with proper validation and database support behind the scenes.

Episode discussion

No comments, yet. Be the first!