Build a URL Shortener with Volt and Folio
This episode is for members only

Sign up to access "Build a URL Shortener with Volt and Folio" right now.

Get started
Already a member? Sign in to continue
Playing
06. Generating a Hashid

Episodes

0%
Your progress
  • Total: 53m
  • Played: 0m
  • Remaining: 53m
Join or sign in to track your progress

Transcript

00:00
So it's time to actually generate out a hash ID. Now, to do this, we're going to go ahead and use the hash IDs PHP package.
00:08
Essentially, this allows us to generate out hash IDs based on, say, the ID of the record that we have in our database. And this is just a kind of YouTube-like ID,
00:18
so much like you'd find in a URL shortener. So we're going to go ahead and pull this in. Let's pull this into our project. And then we're going to go ahead and just
00:27
take a real quick look at how we use this. So obviously, pull in the namespace, new it up, and encode it based on the ID that we have. OK, I think we can pretty much figure this out.
00:38
So to do this, what we want to do is keep this super neat and tidy. There's a couple of approaches that we can take when we are doing this.
00:45
The first approach would be over in the model, create out a static function in here called booted, which is when this model is booted. And then we could say something like static creating
00:57
or created in this case, because then we'll have access to the ID. And then we can go ahead and assign the ID to the URL in here.
01:07
So we could say URL hash ID, and then we could generate the hash ID here. Now, we could take this approach, but it would be good to create a additional class
01:17
in our application, which we can inject directly into here. Remember, this is kind of like a Livewire component. We can inject stuff in, like a dependency that we need to use.
01:28
So even though we're just working in a single file and this feels weird, it kind of makes sense, because I would do this directly within the Livewire component. So it's not really much different.
01:38
So we're going to go ahead and create out a class in here. Let's just create out a utility folder. And in here, we'll create out a hash ID generator class. So let's go ahead and fill this in.
01:54
The namespace is app and utility. And we'll go ahead and create that hash ID generator class. Now, what this is going to do is accept into the constructor a hash IDs instance that we've just pulled in.
02:07
So that is hash ID. So let's go ahead and just index our workspace here. And we'll go ahead and call this hash IDs. And we don't need the block here.
02:20
So let's just go ahead and pull that up. And then we'll go ahead and implement a generate method, which will generate this and return it to us. So let's just kind of mock this out.
02:30
Let's say ABC, like we've been doing. And then we'll go ahead and use this directly within here. So I'm going to call this hash ID generator. And then, of course, we can use this to just generate this
02:43
directly from here. So hash ID generator and generate. OK, let's see if this works. We'll go ahead and get rid of this,
02:50
because remember, this is unique. And let's go over and try this out. So let's say google.com, hit this, and hash ID generator. Yeah, so we just need to make sure we pull that in.
03:02
App, utility, hash ID generator. OK, let's just try that again. And enter google.com, and there we go. Your short link is ready.
03:17
And of course, ABC has been inserted. Now, of course, what we want to do, let's just delete that before we start. We want to go over to our hash ID generator
03:27
and actually add the implementation. So from here, what we want to do is grab the last inserted ID from any URL that we have created. So we're going to directly reference the URL model
03:37
in here. We're going to grab the latest record. Then we're going to go ahead and select just the ID from this and then grab the first.
03:46
So basically, we've now got an instance of the latest URL that we've created. And we're just plucking the ID out, because we don't really need anything here.
03:55
Now, if one hasn't been created, that's going to be a problem. So we're going to optionally grab the ID here. And if that isn't available, we'll just set this to 0. So let's just die dump on this ID.
04:06
We should see a 0, because we haven't created anything. So let's go ahead and enter this. And yeah, we get 0. Great.
04:15
So from that, what we can now do is go ahead and store this and actually make use of the hash IDs package. So to do this, we will go ahead and assign to hash ID, new hash IDs, like so.
04:30
And then we'll go ahead and encode this, as we saw from the documentation. And we'll go ahead and pass the ID in. And we can go ahead and return that hash ID.
04:39
Now, most of the time, this will be fine. Let's go ahead and just run this and just see what happens. So let's click on that. And yeah, we get 5.
04:47
Let's refresh this. Try again, and we get 6. If we head over to the database, yeah, sure enough, the hash ID is correctly being generated.
04:55
That's what's going to be on the end of our URL. But there is a chance that we could get a conflict. So what we want to do is be really careful about this, because we know that each of these need to be unique.
05:07
So what we're going to do is we're going to add in a do-while loop in here. So we're going to put this inside the do-while loop. And what we're going to do is increment the ID.
05:18
So we're going to say I++ or ID++ for this block. So this is going to end up being 1, which kind of makes more sense. And the while condition is going to be
05:31
while the hash ID doesn't already exist in the database. So we're going to go ahead and, again, reference the URL model. And we're going to say where hash ID doesn't equal the hash ID that's being generated in this loop.
05:45
And we have a handy exists method within Eloquent. So basically, this is saying generate a hash ID while the hash ID doesn't already exist in the database. And if it does exist, we're going to go back around,
05:59
start this loop again, increment the ID until we get to a hash ID that we can insert into the database. So not much difference in the way that this is going to work. If we just enter google.com again,
06:13
it still works in exactly the same way. And we get this generated. But if we do have a conflict, if we have some sort of ID conflict for any reason,
06:21
then this is going to take care of that. OK, great. So now that we've got this, it is inserting that hash ID nicely into the database for us.
06:29
And the next job is to obviously grab the hash ID, construct a URL for this that the user can then go through to, and obviously be redirected to the URL stored here.
10 episodes• 53 mins

Overview

Volt is a functional API for Livewire that allows you to build Livewire components in a single file, alongside Blade templates. Pairing this with automatic route creation using Laravel Folio gives us a serious productivity boost.

So, let’s build a URL shortener while learning how Volt and Folio work!

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

Comments

No comments, yet. Be the first to leave a comment.