Sekilas tentang Teks Tindakan untuk Rails 6.0

Rails 6.0 hampir tiba. Versi stabil akan dirilis pada 30 April. Rails 6.0 beta1 dirilis pada 15 Januari. Sebagaimana rilis Rails selalu, Rails 6.0 juga penuh aksi. Ada dua kerangka kerja utama yang baru diperkenalkan, Kotak Surat Tindakan dan Teks Tindakan. Dalam posting ini, mari kita lihat Teks Tindakan dengan menggunakannya di aplikasi kecil.

Teks Tindakan

Action Text memungkinkan kita menghadirkan konten teks yang kaya dan pengeditan ke Rails. Ini berarti kita dapat melakukan operasi seperti memformat teks, menyematkan gambar, memformat tautan, menambahkan daftar, dan fitur mirip editor lainnya ke bidang teks.

Ini dilakukan dengan memasukkan editor Trix ke dalam kerangka. Konten RichText yang dihasilkan oleh editor Trix disimpan dalam model RichText-nya sendiri yang terkait dengan model Rekaman Aktif yang ada dalam aplikasi. Semua gambar yang disematkan atau lampiran lainnya secara otomatis disimpan menggunakan Penyimpanan Aktif.

Mari kita mulai membangun aplikasi Rails kita yang akan menjadi aplikasi blogger. Aplikasi dibuat di Rails 6.0, jadi versi ruby ​​harus> 2.5.

Di tipe terminal

rails new blog --edge

Bendera - tepi mengambil versi rel terbaru atau versi tepi dari rel.

Action Text mengharapkan pengemas web dan ActiveStorage untuk diinstal. Penyimpanan aktif sudah ada di aplikasi Rails. Jadi kita butuh

gem “image_processing”, “~> 1.2” #uncomment from Gemfilegem ‘webpacker’

di file gem.

Sekarang lari

bundle install.

Selanjutnya, kita perlu membuat config / webpacker.yml:

bundle exec rails webpacker:install

Sekarang mari kita mulai Server Rails kita.

Bagus, ayo segera buat aplikasi kita. Aplikasi ini hanya akan memiliki satu model Article.

Mari kita buat pengontrol untuk artikel:

rails g controller Articles index new create show edit update destroy — no-helper — no-test-frameworks

Dan kemudian konfigurasikan rute kami:

Rails.application.routes.draw do resources :articlesend

Selanjutnya, kita perlu membuat model kita. Model Artikel kita akan memiliki dua bidang: judul dan teks . teks harus bidang yang menerima Format Teks Kaya. Jadi dalam migrasi, kita hanya perlu menambahkan bidang judul. Bidang teks akan ditangani oleh ActionText.

Mari buat modelnya

rails g model Articles title:string — no-test-framework

dan jalankan migrasi:

rails db:migrate

Sekarang mari kita tambahkan bagian ActionText. Untuk lari pertama itu

rails action_text:install

Ini akan menambahkan semua dependensi yang dibutuhkan oleh Action Text. Terutama, ini akan menambahkan file baru javascript / packs / application.js dan dua migrasi penyimpanan-tindakan.

Jalankan migrasi lagi menggunakan

rails db:migrate

Sekarang kita dapat menambahkan bagian teks model kita. Buka app / models / article.rb dan tambahkan baris berikut

has_rich_text :text

teks adalah nama bidang yang kami sediakan. Bisa apa saja seperti tubuh atau konten, dll.

Sekarang model kita menjadi

class Article < ApplicationRecord has_rich_text :textend

Sebelum kita membangun formulir kita, mari buat logika pengontrol kita untuk pembuatan artikel:

class ArticlesController < ApplicationController def create @article = Article.new(article_params) @article.save redirect_to @article end
 private def article_params params.require(:article).permit(:title, :text) end
end

Kami sekarang dapat membuat formulir untuk blog. Di app / views / articles / new.rb tambahkan kode formulir berikut:

Perhatikan bahwa untuk bidang teks kami menggunakan form.rich_text_area whichdisediakan oleh Teks Tindakan.

Mari kita render halaman kita:

Luar biasa !!

Kami sekarang memiliki editor teks yang luar biasa untuk membuat artikel kami.

Sebelum kita mulai bermain dengan editor, mari kita cepat melaksanakan acara fungsi dari blog, sehingga kita bisa melihat artikel yang telah kita buat.

Di app / controllers / Articles_controller.rb tambahkan fungsi berikut:

 def show @article = Article.find(params[:id]) end

Juga, kita perlu membuat tampilan untuk ini.

Buat file app / views / articles / show.html.erb dan tambahkan kode berikut:

Article Title:

Article Text:

Itu dia. Aplikasi kita selesai. Sekarang mari kita periksa berbagai fitur yang tersedia di editor teks yang disediakan oleh ActionText.

Kita dapat melihat bahwa ActionText menyediakan hampir semua fungsi editor teks kaya normal seperti memformat teks menjadi tebal, miring, menambahkan coretan, kutipan, tautan, menyeret dan menjatuhkan gambar, dll.

Setelah menyimpan ini, kita dapat melihat posting yang disimpan dari halaman pertunjukan.

Bagus!

Ini adalah contoh yang sangat kecil yang menampilkan potensi ActionText. Semoga bermanfaat. Cobalah.

Sebagian besar aplikasi web menangani konten yang kaya dengan cara tertentu. Jadi saya yakin fitur baru Rails ini dapat membuat hidup banyak pengembang lebih mudah.

Kudos to DHH dan semua orang hebat di balik ini.

//github.com/amkurian/Rails-6.0_action_text_demo

Beberapa Tautan Berguna:

Ringkasan Teks Tindakan - Panduan Ruby on Rails

Ikhtisar Teks Tindakan Panduan ini memberi Anda semua yang Anda butuhkan untuk memulai menangani konten teks kaya. Setelah edgeguides.rubyonrails.org