ActionText 건드린건

Rails6.0부터 ActionText되는 것이 들어있는 것 같다고 DHH라는 Youtuber에서 정보를 얻었으므로 만져 보았다.

이런 느낌의 리치 텍스트를 슛으로 할 수 버린다.

실제로 만져 보았다.

DHH의 모방을 하면서 넣어 본다.

Rails6.0.0 설치

# railsリポジトリの最新
$ ./rails/rails/railties/exe/rails new action_text_app --edge

webpack, actiontext 및 image_processing이 필요하므로 넣습니다.

gem 'webpacker', github: "rails/webpacker"
gem 'actiontext', github: 'rails/actiontext', require: 'action_text'
gem 'image_processing', '~> 1.2'

webpack 설치

$ bundle exec rails webpacker:install 

actiontext 설치

$ ./bin/rails action_text:install
$ ./bin/rails db:migrate

실제로 투고 화면을 만들어 간다.

$ ./bin/rails g scaffold post title:string
$ ./bin/rails db:migrate

화면을 확인해보기

$ ./bin/rails s

scaffold하고 있기 때문에,/posts에 액세스하면 이런 느낌으로 post주위가 엉망이다.

여기부터가 actiontext다.

app/models/post.rb

class Post < ApplicationRecord
  has_rich_text :content
end

app/views/posts/_form.html.erb

# 追加
<div class="field">
  <%= form.label :content %>
  <%= form.rich_text_area :content %>
</div>

app/views/posts/show.html.erb

# 追加
<%= @post.content %>

데타

요약

image_processing 는 처음에 넣어 두지 않으면 app/javascript/packs/application.js에 append되지 않기 때문에 올바르게 움직이지 않는다.
거기서만 조심하면 쉽게 설치할 수 있다.

이것의 preview 기능이라든지 빨리 나오면 사용하기 편리해 보인다!