Rails 6 e ActionText

anchietajunior / July 2020 (346 Words, 2 Minutes)

Uma das ultimas novidades acrescentadas ao ecossistema do Rails é o framework ActionText, e nesse post vou falar um pouco sobre o meu primeiro contato com essa nova ferramenta que trás uma boa alternativa na edição e criação de textos ricos, além de upload de conteúdo direto para o ActiveStorage no melhor estilo WYSIWYG. Nesse caso utilizando o Trix editor, ferramenta desenvolvida pela Basecamp, empresa do DHH.

Versões

• Ruby 2.7.1
• Rails 6

Novo Projeto Rails 6

rails new texts -T
cd texts
bundle install
rails db:create

Gerando um novo Posts scaffold

rails g scaffold Post title
rails db:migrate

Talvez soe estranho adicionar apenas o título aqui, mas o conteúdo do post virá através do ActionText que terá sua prṍpria estrutura de dados. Também vou definir a index/posts como rota padrão no arquivo routes.rb

Rails.application.routes.draw do
  resources :posts
  root "posts#index"
end

Instalando ActionText

rails action_text:install

Adicionando Rich Text aos posts

Depois de instalado o action_text, agora de volta ao código do projeto, basta adicionar a referência de um novo campo com “texto rico” ao models/post.rb, vou chamar esse campo de body, mas poderia ser content ou qualquer outro nome apropriado.

class Post < ApplicationRecord
  has_rich_text :body
end

Pra conseguir passar os valores do campo body é necessário permitir esse valor no controllers/posts_controller.rb

class PostsController < ApplicationController
  # implementation

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

Consequentemente será necessário acrescentar o novo campo também no formulário dos posts em views/posts/_form.html.erb…

<div class="field">
  <%= form.label :body %>
  <%= form.rich_text_area :body %>
</div>

…e no arquivo views/posts/show.html.erb pra exibir o conteúdo do campo body.

<div class="body">
  <%= @post.body %>
</div>

Migrando

É necessária uma nova migração, já que o model Post agora terá um novo rich_text field.

rails db:migrate

Testando

rails server

Extra

Para fazer uploads de imagem pra dentro do editor, pode ser necessário instalar o Image Magick na sua máquina pra que tudo funcione corretamente.

Além disso, descomente a seguinte linha no seu Gemfile:

gem 'image_processing', '~> 1.2'

e depois instale a biblioteca caso ainda não tenha feito:

bundle install

That’s it!

Pra quem conheceu o Rails com aquela jogada de “Crie um blog em n minutos”, a introdução do ActionText dá a impressão que a ideia agora é criar um blog em segundos, rs.