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
Time for action. Build your first dynamic webpage in Rails by creating a controller, defining an action, and rendering a basic view. See how fast you can get content from server to screen
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
Okay, so in this video, we're going to
make our first page in Ruby on Rails.
0:05
This is gonna be one of the most
exciting parts of this course.
0:09
But first of all,
let's start the Rails server.
0:13
So go into command prompt,
into the linktreeclone folder,
0:15
and we're gonna say rails s.
0:20
This s stands for server.
0:23
And this is how you start the Rails server
so you can actually view your web page.
0:25
Then you open your browser, I'm using
Brave, and we're gonna see our web page.
0:29
And because it's the first time
we're starting the server,
0:34
it might take a little bit of time.
0:36
And as you can see, it says here,
0:38
listening on http://127.0.0.1 port 3000.
0:41
And so all we have to do is enter that
into the URL and then it's gonna work.
0:47
So, what we're gonna do is copy and
then paste into the URL and
0:51
let's see what we get.
0:55
Okay, so as you can see,
everything is working.
0:57
We get the Rails logo, the Rails version,
the Ruby version, everything is working.
1:00
You should be very happy because this
means that we installed Ruby on Rails very
1:04
well and our application is up and
running.
1:08
Now, in this video,
we're going to create our first page.
1:10
So what we actually have
to do is stop the server,
1:14
cuz I just showed you how to do it.
1:16
And to stop it,
all you have to do is press Ctrl+C.
1:18
So to stop the server,
press Ctrl+C at the same time,
1:21
you're gonna have to press it twice.
1:24
Then what we're gonna do is do another
command, and this command is going
1:26
to be called rails g controller home,
and that's the name of the controller.
1:31
So we're saying create
a controller called home, and
1:37
then we're gonna give it
a method called index.
1:40
So hit Enter on that command and
then we'll see what we're given.
1:43
And as you can see,
it created a bunch of things.
1:46
What did it create?
1:48
Well, it created one controller
called home_controller.
1:49
Okay, we already knew that.
1:51
It created a root, more on that later.
1:53
It created a view, another view,
and a test_unit, and
1:55
then another test_unit, a helper,
a helper, and another test_unit.
2:00
And so now what we're gonna do
is start the Rails server and
2:06
then we're gonna refresh the page and
see if anything happened.
2:08
Refresh the page, and
as you can see, nothing happened.
2:12
In fact, I'm gonna reload
again because it doesn't work.
2:15
See, I refresh the page and
nothing happens.
2:18
So what we need to do is go
into VS Code and change that.
2:20
So first of all,
we're gonna go into config > routes.ib.
2:24
I said more on that later, this is now.
2:27
So this is the file where
we define the routes.
2:29
Essentially what a route is,
it's like a road between two places.
2:33
In this case, we're using the view and
the controller,
2:37
that's the road between the two of them.
2:41
So we need to create a road between
the view and the controller.
2:44
What view and
controller am I talking about?
2:47
Well, the ones we just
created with that command.
2:49
So let's go to app > views > home.
2:51
This is a new folder that we just created.
2:55
It created a new folder with that command,
and inside we have an index page.
2:57
This is the new page that we just created.
3:02
Then we go to controllers and
we have a home_controller.
3:04
Inside there's an index method.
3:07
This is all because we ran that rails
g controller home index command.
3:09
Now what we're gonna do is go
to config and then routes.rb.
3:14
So go to config > roots.rb and what we
have to do is define a route for the page.
3:21
So as you can see here,
it says define the root path route.
3:26
And what we need to do is say root.
3:29
And in our case, our controller is called
home so we have to say home#index.
3:32
If we save this file and
then refresh the browser, it's gonna work.
3:38
Let's see what happens.
3:42
Moment of truth.
3:43
Okay, you got permission denied.
3:44
If you get this permission denied error,
3:46
all you have to do is
refresh the page again.
3:48
I believe this happens because we're not
running the server with administrator, but
3:50
all you have to do is refresh the page and
it works.
3:54
And as you can see,
we get this page and let's go.
3:57
Okay, so this is working.
4:00
It says home#index.
4:02
Find me in app/views/home/index.html.erb.
4:03
So, let's go to that file so
views > home > index.
4:07
And this is the file that we just created.
4:11
So that's your first page.
4:13
Let's go, we can add anything we like.
4:15
We can say Oogie Boogie and
save and refresh.
4:17
And you can see it will work, very nice.
4:21
That's your first web page
with Ruby on Rails, perfect.
4:25
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