Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed Introduction to Ruby on Rails 7!
You have completed Introduction to Ruby on Rails 7!
Preview
Make your URLs more user-friendly and memorable by implementing the FriendlyID gem. Swap out numeric IDs for human-readable slugs, improving both SEO and user experience.
This video doesn't have any notes.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
[MUSIC]
0:00
All right, so when we create a tree or a
Linktree, let's enter my name, then click
0:04
Next, then add my Instagram and then click
this style, we're gonna say Dark Mode.
0:09
As you can see in the URL, it gives
us the number that we just created,
0:14
it gives us a number.
0:17
Now, this is really bad for many reasons.
0:18
First of all, anybody can see what
number of trees we have in our database.
0:21
That can be bad for security reasons.
0:26
Second of all, because anybody can see
how many we have, that's just bad.
0:28
Say they know that there's is the tenth
tree, that's not good for the application.
0:32
So, we want to change the URL
to the name of the Linktree.
0:36
It's also better because whoever wants to
share their Linktree to their friends or
0:39
whatever, or whoever wants to see it,
they need to have their name in the URL.
0:44
So, let's do that now.
0:48
So, we're gonna go to Ruby Gems or
rubygems.org not Ruby Installer,
0:49
rubygems.org, and there's a gem that we're
going to use and it's called Friendly_id.
0:54
And we're gonna go into friendly_id and
we're gonna go to the Homepage,
1:01
and then it's gonna tell
us how to install the gem.
1:06
And so, let's have a see.
1:10
So, add this line to your
application's gem file.
1:11
Now, we know what the gem file is,
it's just a file with lots of packages.
1:14
Get rid of that.
1:19
And then add this line
under my custom gems, and
1:20
then we just have to run
the command bundle install and
1:23
then it will update the the gem
file with everything installed.
1:26
So, let's stop the server and
then let's run bundle install and
1:32
then it will install this friendly_id gem.
1:36
I believe there should be something
else that we have to do after,
1:39
a command that we have to run.
1:43
But let's just run this
bundle install command, okay.
1:45
And as you can see up here, if we look for
it, as you can see, it's right here,
1:49
friendly_id 5.4.2, perfect.
1:54
Now, what we have to do is go back
to the documentation as usual, and
1:56
this is the migration that we have to run.
2:00
Now, what is a migration?
2:02
Well, a migration is a file
that can change the schema.rb.
2:03
The schema.rb is a representation
of the database, but
2:07
that's showing the actual data.
2:10
So, as you can see, it has all of
the tables, users, and trees currently.
2:12
Now, we need to run this migration.
2:16
So, let's copy this command, and then
we're just gonna change it a little bit
2:21
because we don't want to add the slug to
the users, we want to add it to trees.
2:25
Now, what is the slug?
2:29
Well, in this case, the slug is kind of
the attribute that's gonna make it so
2:31
that we can use the URL as the name.
2:36
And then the slug is unique, so
no two URLs can be the same,
2:39
because you can't have one URL that's
exactly the same as the other,
2:43
leading to two different places.
2:47
So, let's Enter.
2:49
Okay, and as you can see,
a migration was created.
2:50
And after you run a migration, there's
one more command that you have to run,
2:53
which is Rails DB migrate,
excuse me for that.
2:57
So, let's run Rails DB migrate.
2:59
This is going to put that
file into the schema.rb.
3:02
The schema.rb is a representation
of the database, and
3:05
that way we can actually
work with the slug,
3:08
which is an attribute that has
been created onto the trees table.
3:11
So, let's do this, Rails DB Migrate, and
3:15
we can actually look at
the schema in real time.
3:18
So, go to DB schema.rb.
3:21
And as you can see,
the migration just migrated.
3:23
And here's the string, slug, and
3:26
here's the thing that makes it unique,
sorry for the voice crack, okay.
3:29
Now, we can start the rail server,
and as you can see,
3:34
it gives us some more instructions.
3:38
It says, edit the app models
user.rb file as the following.
3:40
Let's do that.
3:44
So, what we're gonna do
is go to app models, but
3:45
we don't wanna actually do the user.rb
because we're doing this on the tree.
3:49
So, let's go into tree model and
then make sure to add extend FriendlyId.
3:56
This basically tells Rails that you
want to use the friendly_id gem in here.
4:00
Basically gets the lines of code that you
need in order to be able to use this.
4:04
So, we want to friendly_id the name and
use, slugged, that's perfect.
4:09
Then what we want to do, is go to
the show method of our trees controller.
4:14
So, let's do that and add this line.
4:20
So, go to the controllers folder, then go
to trees controller, then go to set tree.
4:22
Now, the reason that we have to do this is
because, and replace that line with this
4:28
line, the reason that we have to do this
is because we need to use friendly.find so
4:33
that we can actually
find it using the string.
4:37
And instead of user, we need to add tree
because remember we're doing this with
4:40
trees, so, that sounds funny, but
yeah, we're doing it with trees.
4:44
And then we're just gonna
add tree to both of these.
4:48
Save the file, save the model file.
4:51
And I believe friend_id should be
added and the URLs should be better.
4:54
So, let's do that.
4:59
Let's see.
5:01
So, what I'm gonna do is delete my
tree and I got a little error, but
5:03
it's nothing I can't handle.
5:07
All I have to do is go to app,
views trees index and then all we need to
5:09
do is just get rid of this line because
we have not added that feature yet.
5:14
So, let's just comment out all of these.
5:21
You comment out embedded Ruby using
a hashtag and we'll refresh and
5:23
we should be able to add a new tree.
5:27
Okay, get another error
because I did something wrong.
5:29
Comment this line out as well.
5:34
Okay, so
the tree was successfully destroyed.
5:37
Then we're gonna create your own Linktree.
5:39
Takes us to this page, let's create it.
5:41
So, I'm gonna add Instagram, then Next.
5:44
And then we're gonna make it Rainbow Mode,
because why not?
5:46
And so, we're gonna click Next.
5:49
And as you can see in the top here,
the URL has been successfully changed
5:51
to Malachi Asgharian,
the name of the Linktree.
5:55
That's exactly what we want.
5:57
If another person makes the same name,
which I doubt they will, it's
5:58
a pretty unique name, then it will just
add some characters onto the end of it.
6:02
So, it's no big deal,
handles that for you.
6:06
Now, in the next video,
I want to add the feature so
6:08
that the tree actually
belongs to the user.
6:11
Currently, it doesn't.
6:13
So, we're gonna do that in the next video,
let's go.
6:15
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up