- Read Tutorial
- Watch Guide Video
It's great that we have moved our navigation links to the main application file, and in this lesson, I'm going to show you how to make it even better.
To do that, I'm going to create a partial by adding this code to my master application file:
<%= render "shared/nav" %>
If I run now, my application will throw an error because I don't have a nav file in a shared folder yet. So, that's what we'll do next. Go to the view folder, right-click, select New Folder option and call it shared
. Inside this folder, create a file using the right-click action of your mouse. Save this file as _nav.html.erb
. Pay particular attention to this naming convention as the _
symbol denotes a partial.
Now, take all the links code from your application file and put it inside _nav.html.erb
. This is what it should look like:
If you go to the browser and check the links, you'll notice nothing has changed and this is exactly what we want.
The application workflow is much smoother now as the user gets to see only the render
function, but internally, this function is calling the code from shared/nav
file. This flow also makes it easier to handle changes because every time there is a navigation change, you can simply go to _nav.html.erb
file and update it. Since the html file is smaller than the application file, it will help the overall application to run a little bit faster too. Additionally, debugging may be easier as your application file tends to get bigger when you add css and javascript files in the future. For these reasons, it's considered good programming practice to move these links to a new partial.
Going forward, you can use the same idea for any object that can get bigger or need to be called from multiple files. For example, if you want multiple pages to access your view page where you display all the projects, then it makes sense to move it to a new partial for the same reasons mentioned above.
To implement this example, I'm going to the shared folder and creating a new file called _projects.html.erb
I'm going to take the code out of my home page because that is where we have the view code, and put it in the projects file.
In the home page, I'm simply going to call my partial with the code
<%= render "shared/projects" %>
This is how my home page is going to look now:
And my _projects.html.erb
will look like this:
I can go to my home page on the browser, and nothing would have changed.
You may wonder why you want to do something like this, and there is good reason for it. Suppose you want to use the project
variable across different pages and each time you want to have the same look and feel. With this code, all that you have to do is just call this partial instead of putting the actual code in each of these places. Also, if you have to make a change, you can make it in this one file and it will get reflected everywhere, instead of going to each file and making the change. It also follows the DRY (Do not Repeat Yourself) principle of programming, and makes debugging easier too.