Add comments to your app
We are going to add the possibility to comment on ideas in your railsgirls application. Comments are short messages that people can leave on websites. In this guide we’ll be relying less on the Rails generators to create scaffolding. We’ll be writing more Ruby code to implement this feature.
Add comment routes
We’ll start by creating a new route for the comments. This will be nested under the ideas routes, so we can derive which idea the comment belongs to from the route.
config/routes.rb file. Change the following line:
to these lines:
Create comment model
Next up, creating a comment model, like we did with the ideas before, but without the controller and a bunch of other things. In this guide we’ll be making more changes ourselves, rather than relying on generated code.
The command below will create a Comment model with a name, message body and with a reference to the ideas table. The latter will make it possible to leave comments on a specific idea, so they won’t show on other idea pages.
A migration file has also been created. It lets your database know about the new comments table. Run the migrations using this command:
Add relations to models
Your app needs to know about the relation between the two objects, ideas and comments, so you can fetch only the comments that belong to a specific idea. One idea can have many comments, but a comment can only belong to one idea.
app/models/idea.rb and below the line:
add this line to tell it there can be many comments attached to the Idea model:
The comment also has to know that it belongs to an idea. Open the
app/models/comment.rb file. You’ll find the following contents:
The comment already knows it “belongs to” an idea because of the line
belongs_to :idea, which references back to the
Idea model. This was automatically added by the migration we made earlier.
Loading comments from the database
app/controllers/ideas_controller.rb find the line that says
def show. This is what we call a Ruby method, and it is responsible for loading things from the database to be used in the views (files with HTML we’ve edited before).
show method so that it looks like this:
This will load the comments that belong a specific idea object from the database. We can then access the comments using the
@comments instance variable in the view later.
Making a comments controller
To store comments in the database, and remove them again later, we’ll need a Rails controller. Like the IdeasController, this controller will perform databases queries, but for comments instead.
Create a file in the
app/controllers/ directory named
Open the file you just created in your Text Editor, it should be empty, and copy-paste in this code:
This controller will listen to requests to create and delete (destroy) comments. When it receives such a request, it will tell the database what to store or remove, and redirect you back to the page you came from. But first, let’s make the pages that will talk to this controller.
Explain how controllers work and interact with HTTP requests, models and views.
Display the comments
We can use the relationship between ideas and comments to fetch them from the database and show them in your app.
app/views/ideas/show.html.erb and at the very bottom add these lines:
This code will show the comments, but first we’ll need a way to create comments. For that the last two lines render a comment submission form, which we’ll create next.
Create the comment form
To submit the form, we need to create a file with the form, so that it can be displayed.
Create a new directory in the
app/views/ directory named
Then, in that new directory, create a new file called
In this new file copy-paste these lines:
When you refresh your browser, the idea detail page should now have a form for adding a comment. Fill in your name and add a message. Then click the “Create comment” button. It should now say “Comment was successfully created.” at the top of the page in green.
Congratulations! Your app now supports comments. We’ve added a new models for comments, named
Comment, which talks to the database to store these comments. A new
CommentsController controller that tells the model what to do, creating or deleting comments. The views are updated to show the comments per idea, create new comments with the form and delete them again with the delete buttons.
If you’re interested, check out the detail page of a different idea. If all goes well, you should not be seeing the same comments on that idea detail page as the other one.
If you’re ever stuck during a guide, please ask your coach for help and also consult this handy cheatsheet for Ruby, Rails, the console, the Text Editor etc.
- Guide 1: Start of the guide
- Guide 2: Get to know the tools
- Guide 3: Guide to install Rails
- Guide 4: Build Your First App
- Guide 5: Style your app using HTML and CSS
- Guide 6: Add a new page to your app
- Guide 7: Add a new homepage to your app
- Guide 8: Add picture uploads
- Guide 9: Push Your App to GitHub
- Guide 10: Put your app online with one of these services:
- Guide 11: Style the idea pages using HTML and CSS
- Guide 12: Add comments to your app (Current page!)
- Guide 13: Create picture thumbnails
- Guide 14: Test your app with RSpec
View all guides