- The Root Path 2:39
- Root Path 2 objectives
- Getting HTML from a Template 2:19
- Loading ERB Templates 1 objective
- Loading Text Files 2:43
- URL Parameters 4:19
- URL Parameters 1 objective
- ERB Tags 7:15
- ERB Tags 1 objective
- Embedding Page Data with ERB 4:22
- Embedding Instance Variables 3 objectives
- ERB 5 questions
Preview
Video Player
00:00
00:00
Embedding Page Data with ERB
4:22All the ingredients are in place. We have the page title from the URL parameter, and we're able to use the title to load the page contents. And we just learned how to embed data in an ERB template. Now we just have to get the title and content from the Sinatra route into the ERB template. The most common way to do that is by using instance variables. A Sinatra route shares a context with the Ruby code inside ERB templates. One major benefit is that code in an ERB template can access instance variables that you set in the Sinatra route.
All the ingredients are in place.
0:00
We have the page title
from the URL parameter and
0:02
we're able to use the title to
load in the page contents, and
0:04
we just learned how to embed
data in an ERB template.
0:08
Now we just have to get the title and
0:11
content from the Sinatra
route into the ERB template.
0:13
The most common way to do that
is by using instance variables.
0:17
In earlier Ruby courses we
talked about instance variables,
0:20
which can be accessed by any
instance method in a class.
0:23
Well with Sinatra Route it shares
the context with the Ruby code inside ERB
0:26
templates.
0:30
One major benefit is that
code in a ERB template
0:32
can access instance variables that
you set in the Sinatra route.
0:34
The quickest way to explain
this is just to show you.
0:38
Let's create instance variables to
hold our page title and content,
0:41
and then create an ERB template
that accesses those values.
0:44
So here within our get title route,
we're gonna take the title
0:49
parameter and assign it to a new
instance variable called title.
0:54
We're gonna assign the result
of params[:title],
1:00
and then because we're setting that title
to params[:title] up here, we can just use
1:05
the value of the title instance variable
down here in place of params[:title].
1:10
Now we're going to want an instance
variable with that page content, so
1:15
we'll create a new instance
variable named content and
1:18
assign that to the results
of the page content call.
1:22
Lastly, we're gonna render an ERB
template, so we'll call the ERB method and
1:26
we'll render a template named show.erb
from within the Views folder.
1:31
We do that by passing ERB the symbol show.
1:36
Now we're going to need to
actually create that template.
1:40
So we'll go here into the Views folder and
create a new file, we'll call it show.erb.
1:43
Let's go back here and save this real
quick, we wouldn't wanna miss saving that.
1:55
And here within the template we're gonna
access the instance variables that we set
2:00
up within the route.
2:03
So I'm going out and
put the title within a level one heading.
2:05
So that it looks nice and big on the page.
2:08
I use an output embedding tag and
2:12
all access the value of
the title instance variable.
2:14
Then I'm going to output
in the HTML paragraph
2:19
with the value of the content
instance variable.
2:22
So we'll have the page title as a heading,
followed by the page content.
2:30
And we made some changes to our Ruby code,
so we need to restart the server.
2:34
And now if we go back and visit
the Nick Pettit path and reload the page.
2:42
We'll see a heading with the page title
and a paragraph with the page content.
2:48
Let's try it with another page,
2:53
let's create a new page within
the pages directory here, New File.
2:54
And we'll name this one Crazy Marvin.txt.
3:00
And we're gonna give Crazy Marvin
a bio of former treehouse teacher.
3:06
Okay, that should be
all the set up we need.
3:17
Let's go here into our
preview address bar,
3:19
change the path from
Nick Pettit to Crazy Marvin.
3:23
I'm gonna type a space here but
it'll convert it to %20 for
3:28
me when it encodes the URL.
3:32
Hit Enter, and there's our new page.
3:34
Title is Crazy Marvin,
retrieve that from the URL.
3:37
And here's the content that it loaded
in from Crazy Marvin.txt in the pages
3:41
directory.
3:46
So using instance variables we've
successfully embedded data from
3:47
the Sinatra route into our ERB template.
3:51
Great work,
3:54
we've used the URL parameter to retrieve
a page title from the browsers request.
3:54
Then we've used that title to load
page content from a text file.
3:59
We've put all this info and
the instance variables and
4:04
then we've embedded those variable
values in an ERB template.
4:07
Right now though,
4:11
users can only view pages that we've
manually created behind the scenes.
4:12
Up next, we're going to set up a form
that lets users create their own pages.
4:16
We'll see you in the next stage.
4:20