DEV Community

Ayushman Parasar
Ayushman Parasar

Posted on

How to use json-jbuilder in Rails

This post is just a mere attempt to log-in what I have learnt about json-jbuider and is not a tutorial but I know this will help those who have just began to learn Rails.

Okay then lets start!!

First of all Jbuilder is a template for rendering json responses. Rails comes preloaded with jbuilder gem which helps to create JSON structures. Lets see its use-case scenerio:

For example we are making a blog app in which we have a lot of articles and users who create those articles. So we have two models a User model and an Article model. A User model has many articles and an Article model belongs to User.In Article model we have a reference to the user model through user-id(basically author of the article). Now suppose we have a case where we need to show the list of articles with few details of each article including author information. In the articles controller we have the following action.

def index
  @articles = Article.all
Enter fullscreen mode Exit fullscreen mode

Here @articles is an array containing all the articles and each article has the info corresponding to that particular row of the article table. We also need the author information but we have only the author id in the article table. This is the case where jbuider comes into flow.

By default rails looks for a template of the requested format. For rendering response to JSON query we will need a template. We make a template called index.json.jbuilder in the views/api/v1/aricles directory. This file contains the logic for populating the nested attributes of the article model(eg: user). Here we have namespaced the directory because I think its better to have a clear seperation of our APIs.
In the index.json.jbuider add the following lines:

json.articles @articles do |article|
  json.partial "article", obj: article
Enter fullscreen mode Exit fullscreen mode

In the above lines, we are defining a key in json called articles and we are taking the array @articles that we made in the articles controller and we are iterating over each article of the array and rendering a partial with an object "obj" containing the article details. Partial rendering is one of the plus points of using jbuilder.

As of now we dont have a partial so lets make one and name it "_article.json.jbuilder" in the same directory i.e views/api/v1/articles. Now lets add the following lines in the partial:
json.title obj.title do 
Enter fullscreen mode Exit fullscreen mode

What is happening above is that we are structuring a json file where , json.title, are the keys . Here we are able to get user details other than the id.
There is one more way of doing this

json.(obj, :id, :title) 
json.(obj.user, :id, :name) 

Enter fullscreen mode Exit fullscreen mode

But I find the first one more useful.

I hope this article was useful and if there was anything I explained incorrectly or if there was a different apprach or if I missed anything do let me know. Thanks!!!

Top comments (2)

bensandeen profile image

Very clear and simple, thanks!

roxuy profile image

Thanks a lot! very helpful