1 00:00:00,450 --> 00:00:02,110 All the ingredients are in place. 2 00:00:02,110 --> 00:00:04,780 We have the page title from the URL parameter and 3 00:00:04,780 --> 00:00:08,530 we're able to use the title to load in the page contents, and 4 00:00:08,530 --> 00:00:11,970 we just learned how to embed data in an ERB template. 5 00:00:11,970 --> 00:00:13,390 Now we just have to get the title and 6 00:00:13,390 --> 00:00:17,010 content from the Sinatra route into the ERB template. 7 00:00:17,010 --> 00:00:20,590 The most common way to do that is by using instance variables. 8 00:00:20,590 --> 00:00:23,520 In earlier Ruby courses we talked about instance variables, 9 00:00:23,520 --> 00:00:26,960 which can be accessed by any instance method in a class. 10 00:00:26,960 --> 00:00:30,816 Well with Sinatra Route it shares the context with the Ruby code inside ERB 11 00:00:30,816 --> 00:00:32,140 templates. 12 00:00:32,140 --> 00:00:34,900 One major benefit is that code in a ERB template 13 00:00:34,900 --> 00:00:38,790 can access instance variables that you set in the Sinatra route. 14 00:00:38,790 --> 00:00:41,810 The quickest way to explain this is just to show you. 15 00:00:41,810 --> 00:00:44,830 Let's create instance variables to hold our page title and content, 16 00:00:44,830 --> 00:00:49,370 and then create an ERB template that accesses those values. 17 00:00:49,370 --> 00:00:54,170 So here within our get title route, we're gonna take the title 18 00:00:54,170 --> 00:00:58,800 parameter and assign it to a new instance variable called title. 19 00:01:00,570 --> 00:01:05,760 We're gonna assign the result of params[:title], 20 00:01:05,760 --> 00:01:10,540 and then because we're setting that title to params[:title] up here, we can just use 21 00:01:10,540 --> 00:01:15,350 the value of the title instance variable down here in place of params[:title]. 22 00:01:15,350 --> 00:01:18,560 Now we're going to want an instance variable with that page content, so 23 00:01:18,560 --> 00:01:22,930 we'll create a new instance variable named content and 24 00:01:22,930 --> 00:01:25,320 assign that to the results of the page content call. 25 00:01:26,920 --> 00:01:31,180 Lastly, we're gonna render an ERB template, so we'll call the ERB method and 26 00:01:31,180 --> 00:01:36,470 we'll render a template named show.erb from within the Views folder. 27 00:01:36,470 --> 00:01:39,050 We do that by passing ERB the symbol show. 28 00:01:40,880 --> 00:01:43,176 Now we're going to need to actually create that template. 29 00:01:43,176 --> 00:01:48,959 So we'll go here into the Views folder and create a new file, we'll call it show.erb. 30 00:01:55,597 --> 00:02:00,060 Let's go back here and save this real quick, we wouldn't wanna miss saving that. 31 00:02:00,060 --> 00:02:03,500 And here within the template we're gonna access the instance variables that we set 32 00:02:03,500 --> 00:02:05,050 up within the route. 33 00:02:05,050 --> 00:02:08,430 So I'm going out and put the title within a level one heading. 34 00:02:08,430 --> 00:02:10,726 So that it looks nice and big on the page. 35 00:02:12,322 --> 00:02:14,231 I use an output embedding tag and 36 00:02:14,231 --> 00:02:17,425 all access the value of the title instance variable. 37 00:02:19,310 --> 00:02:22,687 Then I'm going to output in the HTML paragraph 38 00:02:22,687 --> 00:02:26,333 with the value of the content instance variable. 39 00:02:30,730 --> 00:02:34,864 So we'll have the page title as a heading, followed by the page content. 40 00:02:34,864 --> 00:02:38,566 And we made some changes to our Ruby code, so we need to restart the server. 41 00:02:42,790 --> 00:02:47,102 And now if we go back and visit the Nick Pettit path and reload the page. 42 00:02:48,760 --> 00:02:53,272 We'll see a heading with the page title and a paragraph with the page content. 43 00:02:53,272 --> 00:02:54,980 Let's try it with another page, 44 00:02:54,980 --> 00:02:58,530 let's create a new page within the pages directory here, New File. 45 00:03:00,710 --> 00:03:06,705 And we'll name this one Crazy Marvin.txt. 46 00:03:06,705 --> 00:03:11,726 And we're gonna give Crazy Marvin a bio of former treehouse teacher. 47 00:03:17,130 --> 00:03:19,599 Okay, that should be all the set up we need. 48 00:03:19,599 --> 00:03:23,820 Let's go here into our preview address bar, 49 00:03:23,820 --> 00:03:28,496 change the path from Nick Pettit to Crazy Marvin. 50 00:03:28,496 --> 00:03:32,508 I'm gonna type a space here but it'll convert it to %20 for 51 00:03:32,508 --> 00:03:34,690 me when it encodes the URL. 52 00:03:34,690 --> 00:03:37,851 Hit Enter, and there's our new page. 53 00:03:37,851 --> 00:03:41,790 Title is Crazy Marvin, retrieve that from the URL. 54 00:03:41,790 --> 00:03:46,721 And here's the content that it loaded in from Crazy Marvin.txt in the pages 55 00:03:46,721 --> 00:03:47,577 directory. 56 00:03:47,577 --> 00:03:51,657 So using instance variables we've successfully embedded data from 57 00:03:51,657 --> 00:03:54,126 the Sinatra route into our ERB template. 58 00:03:54,126 --> 00:03:54,866 Great work, 59 00:03:54,866 --> 00:03:59,960 we've used the URL parameter to retrieve a page title from the browsers request. 60 00:03:59,960 --> 00:04:04,250 Then we've used that title to load page content from a text file. 61 00:04:04,250 --> 00:04:07,530 We've put all this info and the instance variables and 62 00:04:07,530 --> 00:04:11,450 then we've embedded those variable values in an ERB template. 63 00:04:11,450 --> 00:04:12,140 Right now though, 64 00:04:12,140 --> 00:04:16,060 users can only view pages that we've manually created behind the scenes. 65 00:04:16,060 --> 00:04:20,110 Up next, we're going to set up a form that lets users create their own pages. 66 00:04:20,110 --> 00:04:21,250 We'll see you in the next stage.