Embedding Page Data with ERB4:22 with Jay McGavren
All 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
You need to sign up for Treehouse in order to download course files.Sign up