I have started using Rails 6 even though it is not fully out, the integration of webpack, Action Cable, ActionText, ActionView and lot of other background task have improved Rails and make it faster. The one I am particularly happy about is Action Text.
Design an Application for Blogs have never been made easy before we'd integrate other external libraries and configure the application. Now, with the integration of Action Text which uses Trix which was design by Basecamp developers, just some lines of code, we should be able to design a fully functional blog.
In this article, we will be building an application where users can create a blog using Action text as their textarea in Rails 6.
Before we begin, make sure you have ruby version ≥ 2.2 and rails version ≥ 6 installed on your local machine.
If your ruby version is not up-to-date, you can update with a ruby version manager such as rvm or rbenv
Rails 6 is not fully out but we can install the pre version rails-6.0.0.rc1.
$ rvm install "ruby-2.4.6"
$ rbenv install 2.4.6## You can install rails by running
$ gem install rails --pre
That’s all you need, we are good to start.
$ rails new action-text-tutorial --database=postgresql
$ cd action-text-tutorial
Since we will be using PostgreSQL, lets added our database credentials. open config/database.yml and fill this with your data.
That's all we need for the setup lets create the migrations and models needed for this application. we will just build a basic application so we need a blogs model that contains title and body field. You can add a user model if you want to move it forward.
Create the models needed using
$ rails generate model Blog title:string body:text
After that run your migration using
$ rails db:migrate
Action Text Install
Run this line to install actiontext dependencies
This will install the various files needed and also add Trix styling to the application. You can checkout trix.scss file to update the styles.
Run migration to install the migrations added by action-text
$ rails db:migrate
Add this line to your model/blogs.rb to ensure body field uses action text
class Blog < ApplicationRecord
That's all for the models, let's create a blog resource
rails g controller Blogs index new create show
Add this to blogs_controller
class BlogsController < ApplicationController
@blogs = Blog.all
@blog = Blog.find(params[:id])
@blog = Blog.new
@blog = Blog.new(blogs_params)
Add this to blogs/new.html.erb to create the form. Instead of using textarea for the body field, we used rich_text_area, a helper from action-text.
<p>Find me in app/views/blog/new.html.erb</p>
<%= form_for @blog do |f| %>
<%= f.label :title %>
<%= f.text_field :title %>
<%= f.label :body %>
<%= f.rich_text_area :body %>
<%= f.submit %>
<% end %>
Run your server and head over to http://localhost:3000/blogs/new , You should see the action text view in its beauty. Write a little blog and submit, you will be redirected to the index page.
Let's add this to the index page to display all blogs
<h1>Blog#index</h1><p>Find me in app/views/blog/index.html.erb</p>
<% @blogs.each do |blog| %>
<li><%= link_to blog.title, blog_path(blog) %></li>
<% end %>