In this episode we show you how to create a record in the database using the UI. We leverage what we learned about MVC to create features in the interface that will allow us to create records in our database. We show you how the routes generated in the rails app map to the controller actions, we also show you how to setup and install a debugging tool that will allow you to put break points into your rails app for debug purposes.

We will start off creating some basic styling.

// app/assets/stylesheets/posts.sass
div.post
  border-bottom: 1px solid #eee

We now need to import the posts.sass into the application.sass file.

// app/assets/stylesheets/application.sass
@import "posts"

To get an understanding of how we can create the post using the controller lets take a brief look at the routes

#                posts GET    /posts(.:format)                            posts#index
                       POST   /posts(.:format)                            posts#create
#             new_post GET    /posts/new(.:format)                        posts#new
#            edit_post GET    /posts/:id/edit(.:format)                   posts#edit
#                 post GET    /posts/:id(.:format)                        posts#show
#                      PATCH  /posts/:id(.:format)                        posts#update
#                      PUT    /posts/:id(.:format)                        posts#update
#                      DELETE /posts/:id(.:format)                        posts#destroy

If we focus on the HTTP POST we can see that it maps to the posts#create action. However before we can implement the create action in the posts_controller.rb we must have some kind of form that will make the post request. So let's start by implementing the form which will be generated by the new action in the posts controller

# app/controllers/posts_controller.rb
class PostsController < ApplicationController 
  def index
    @posts = Post.all
  end
  
  def new
    @post = Post.new
  end
end

Once our new action is in place the next thing we need to do will be to create the view.

<!-- app/views/posts/new.html.erb -->
<%= form_for @post do |f| %>
  <div class='form-group'>
    <%= f.label :title %>
    <%= f.text_field :title, class: 'form-control' %>
  </div>
  <div class='form-group'>
    <%= f.label :body %>
    <%= f.text_area :body, class: 'form-control' %>
  </div>
  <div class='form-group'>
    <%= f.submit "Save", class: 'btn btn-block btn-success' %>
  </div>
<% end %>

Once our form is ready to go we can implement the create action. We need to use strong parameters to ensure that our controller is secure. So we will also need to implement the strong parameter.

# app/controllers/posts_controller.rb  
# ...
  def create
    @post = Post.new(post_params)
  end

private
  
  def post_params
    params.require(:post).permit(:title, :body)
  end
# ...

Debugging Tools

To get a better understanding and have the ability to debug our application better we will add a tool to our app.

# Gemfile

group :development, :test do 
  # ...
  gem 'pry-rails'
end

The pry-rails gem will allow us to add break points to our app and dig into the life cycle of a request. Which can be very handy when we're learning how the whole MVC idea works together.

Adding Break Points

To add breakpoints to the app we just do the following

#  def create
#    @post = Post.new(post_params)
    binding.pry
#  end

Completing our Create Action

Once we have an understanding of how the request is passed and processed in the controller action we can save our post. Let's go ahead and complete our create action.

  def create
    @post = Post.new(post_params)
    if @post.save
      redirect_to posts_path
    else
      # render the form again
    end
  end