Action Text — ช่องเนื้อหาแบบ rich text ที่มากับ Rails

Action Text คืออะไร — และบทนี้จะทำ 6 ขั้น

Action Text คือชิ้นส่วนที่มากับ Rails ให้ช่องเนื้อหามีปุ่มจัดรูปแบบ (ตัวหนา ลิงก์ หัวข้อ รายการ) แล้วเก็บผลเป็น HTML ให้ · ตอนโชว์มัน sanitize ให้เองทุกครั้ง แบบที่บท 136 สอน · เราจึงไม่ต้องประกอบเองอีก

ช่องพิมพ์ที่มีปุ่มนั้นเรียกว่า editor · ตัวที่มากับ Action Text ชื่อ Trix (โปรแกรม JavaScript ที่วาดแถบปุ่มและช่องพิมพ์ในเบราว์เซอร์) · (ถ้าได้ยินชื่อ Lexxy — เป็น editor ตัวใหม่ที่เป็น gem แยก ไม่ได้ติดมากับ Rails 8.1.4 · บทนี้ใช้ Trix)

เทียบกับของที่รู้: ฝั่ง Next.js (บท 69–78) ไม่มี editor แบบนี้ติดมา ต้องเลือก library มาเองแล้วต่อกับ backend เอง · Rails ให้มาครบทั้ง editor · ตารางเก็บข้อมูล · การ sanitize ตอนโชว์ — ติดตั้งด้วยคำสั่งเดียว

ขั้น 1 · ติดตั้ง — bin/rails action_text:install

รันในหน้าต่างที่สอง (โฟลเดอร์โปรเจกต์) — ผลจริง:

$ bin/rails action_text:install
Installing JavaScript dependencies
      append  app/javascript/application.js
      append  config/importmap.rb
      create  app/assets/stylesheets/actiontext.css
      create  app/views/active_storage/blobs/_blob.html.erb
      create  app/views/layouts/action_text/contents/_content.html.erb
       rails  railties:install:migrations FROM=active_storage,action_text
Copied migration 20261110034320_create_active_storage_tables.active_storage.rb from active_storage
Copied migration 20261110034321_create_action_text_tables.action_text.rb from action_text
      invoke  test_unit
      create    test/fixtures/action_text/rich_texts.yml

ทีละบรรทัด (append = ต่อท้ายไฟล์เดิม · create = สร้างไฟล์ใหม่):

• Installing JavaScript dependencies — แค่หัวข้อ ไม่ได้ดาวน์โหลดอะไร · installer จะเรียก yarn/bun (ตัวติดตั้ง package ของ JavaScript แบบเดียวกับ npm) เฉพาะโปรเจกต์ที่มี package.json · โปรเจกต์เราใช้ importmap (บท 127) ไม่มีไฟล์นี้ จึงข้ามไป
• application.js + importmap.rb — เพิ่มบรรทัดโหลด Trix กับตัวเชื่อม Trix ↔ Rails · ทั้งคู่ชี้ไฟล์ที่อยู่ใน gem ของ Rails ไม่ใช่ CDN (ดูข้างล่าง)
• actiontext.css — หน้าตาของแถบปุ่มและเนื้อหา (440 บรรทัด) · เดี๋ยวขั้น 5 ต้องย้ายที่ ไม่งั้นชนกับ Tailwind
• _blob.html.erb — แม่พิมพ์ของรูป/ไฟล์ที่แนบในเนื้อหา (เรื่องไฟล์เริ่มบท 138) · _content.html.erb — กรอบ <div class="trix-content"> ที่ห่อเนื้อหาทุกครั้งที่โชว์
• railties:install:migrations — คำสั่งที่ installer เรียกต่อเอง: ก็อปไฟล์ migration ที่มากับ gem มาใส่ db/migrate/ ของเรา (ยังไม่สร้างตาราง) · ได้มา 2 ไฟล์ · ไฟล์แรกเป็นของ Active Storage (ระบบเก็บไฟล์ของ Rails — บท 138) เพราะรูปที่แนบในเนื้อหาต้องเก็บด้วยระบบนั้น
• rich_texts.yml — ไฟล์ข้อมูลตัวอย่างสำหรับ test (มีแต่ comment ไม่มีผลอะไร · เรื่อง test อยู่ Part 2)

สองไฟล์ที่ถูก append — ดูด้วย git diff (ผลจริง ตัดหัว diff ออก):

# app/javascript/application.js
 import "@hotwired/turbo-rails"
 import "controllers"
+
+import "trix"
+import "@rails/actiontext"

# config/importmap.rb
 pin_all_from "app/javascript/controllers", under: "controllers"
+pin "trix"
+pin "@rails/actiontext", to: "actiontext.esm.js"

• + หน้าบรรทัด = บรรทัดที่เพิ่ม · import "trix" = โหลดโปรแกรม editor · import "@rails/actiontext" = ตัวเชื่อมที่ทำให้ลากรูปใส่เนื้อหาแล้วอัปโหลดได้ (บท 139)
• pin "trix" — บอก importmap ว่าชื่อ trix หมายถึงไฟล์ trix.js ที่อยู่ใน gem action_text-trix (ติดมากับ Rails แล้ว) · ไม่มีการโหลดจากเว็บอื่น

แล้วสร้างตาราง — ผลจริง:

$ bin/rails db:migrate
== 20261110034320 CreateActiveStorageTables: migrating ========================
-- create_table(:active_storage_blobs, {id: :primary_key})
   -> 0.0033s
-- create_table(:active_storage_attachments, {id: :primary_key})
   -> 0.0029s
-- create_table(:active_storage_variant_records, {id: :primary_key})
   -> 0.0018s
== 20261110034320 CreateActiveStorageTables: migrated (0.0095s) ===============

== 20261110034321 CreateActionTextTables: migrating ===========================
-- create_table(:action_text_rich_texts, {id: :primary_key})
   -> 0.0021s
== 20261110034321 CreateActionTextTables: migrated (0.0033s) ==================

• สามตารางแรก (active_storage_…) — ของ Active Storage · ยังไม่ได้ใช้ในบทนี้ · จำไว้ว่า "มีแล้ว" เพราะบท 138 จะไม่ต้องสร้างซ้ำ
• action_text_rich_texts — ตารางที่เก็บเนื้อหา rich text · หัวข้อถัดไปดูข้างใน

หลังติดตั้งแล้ว ปิด bin/dev (Ctrl+C) แล้วเปิดใหม่ หนึ่งรอบ ให้แน่ใจว่าเว็บรู้จักไฟล์ JavaScript ที่เพิ่งเพิ่ม

ขั้น 2 · เนื้อหาไม่ได้อยู่ในตาราง posts

เปิด db/schema.rb (ไฟล์ที่สรุปโครงทุกตาราง — บท 108) หาตารางใหม่:

  create_table "action_text_rich_texts", force: :cascade do |t|
    t.string "name", null: false
    t.text "body"
    t.string "record_type", null: false
    t.bigint "record_id", null: false
    t.datetime "created_at", null: false
    t.datetime "updated_at", null: false
    t.index ["record_type", "record_id", "name"], name: "index_action_text_rich_texts_uniqueness", unique: true
  end

• body — ตัว HTML ของเนื้อหา (ชื่อคอลัมน์บังเอิญตรงกับชื่อช่องที่เราจะตั้ง แต่คนละที่กัน)
• name — ชื่อช่อง เช่น "body" · เผื่อ model หนึ่งมี rich text หลายช่อง (เช่น เนื้อหา + บทสรุป)
• record_type + record_id — เนื้อหานี้เป็นของแถวไหน ในตารางไหน เช่น "Post" + 5 = บทความเลข 5
• index … unique: true — กันไม่ให้แถวเดียวกันมีช่องชื่อเดียวกันซ้ำสองอัน (index ไม่ซ้ำ — บท 111)

ต่างจากที่เคยเห็นตรงไหน? ตาราง comments ของเรามีคอลัมน์ post_id (บท 115) — รู้อยู่แล้วว่าชี้ไปตาราง posts · ตารางนี้ชี้ได้ทุกตาราง จึงต้องเก็บสองช่อง: ชื่อ model (record_type) กับเลขแถว (record_id) · การชี้แบบนี้เรียกว่า polymorphic (แปลตรง ๆ ว่า "รับได้หลายแบบ")

คำว่า polymorphic เคยผ่านตาในชื่อ polymorphic_path (บท 117) แต่การเก็บแบบสองช่องนี้เพิ่งเจอครั้งแรก · บท 138 จะเจออีกที่ตาราง active_storage_attachments ซึ่งมี record_type + record_id แบบเดียวกัน

บอก model ว่าบทความมีช่อง rich text ชื่อ body — เปิด app/models/post.rb เติม 2 บรรทัดใต้ has_many :comments (ส่วนอื่นยังไม่แตะ):

class Post < ApplicationRecord
  belongs_to :category
  has_many :comments, dependent: :destroy
  # เนื้อหาแบบ rich text เก็บในตาราง action_text_rich_texts (ไม่ได้อยู่ในตาราง posts)
  has_rich_text :body
  …

• has_rich_text :body — "บทความมีช่อง rich text ชื่อ body เก็บในลิ้นชักกลาง" · ได้ post.body มาใช้เหมือนคอลัมน์ธรรมดา · เบื้องหลังมันคือ has_one (บท 115) ชื่อ rich_text_body ที่ตั้ง dependent: :destroy ไว้ให้ = ลบบทความแล้วเนื้อหาหายตาม
• ไม่ต้องเขียน migration เพิ่มคอลัมน์ body ในตาราง posts — ตารางกลางมีอยู่แล้ว

wongnok-blog-all-in-one(dev):001> post = Post.first
wongnok-blog-all-in-one(dev):002> post.body
wongnok-blog-all-in-one(dev):003> post.body.to_s

wongnok-blog-all-in-one(dev):002> post.body
  ActionText::RichText Load (0.5ms)  SELECT "action_text_rich_texts".* FROM "action_text_rich_texts" WHERE "action_text_rich_texts"."record_id" = 1 AND "action_text_rich_texts"."record_type" = 'Post' AND "action_text_rich_texts"."name" = 'body' LIMIT 1 /*application='WongnokBlogAllInOne'*/
=>
#<ActionText::RichText:0x0000000129e2aa20
 id: nil,
 name: "body",
 body: nil,
 record_type: "Post",
 record_id: 1,
 created_at: nil,
 updated_at: nil>
wongnok-blog-all-in-one(dev):003> post.body.to_s
=> ""
wongnok-blog-all-in-one(dev):004> ActionText::RichText.count
  ActionText::RichText Count (2.4ms)  SELECT COUNT(*) FROM "action_text_rich_texts" /*application='WongnokBlogAllInOne'*/
=> 0

ขั้น 3 · แผนย้ายข้อมูล — expand ก่อน ยังไม่ลบ description

เนื้อหา 30 บทความอยู่ใน description ต้องย้ายไป body · นี่คือการย้ายข้อมูลจริงแบบที่บท 109 สอน · ข้อกำหนดของสไลด์หน้า 14 เขียนชัดว่า รอบนี้ห้ามลบคอลัมน์ description — เพิ่มของใหม่ก่อน ย้ายข้อมูล แล้วปล่อยของเก่าไว้ ค่อยลบรอบหน้า

ของใหม่อีกชิ้นที่ต้องเพิ่มคือคอลัมน์ plain_text (ตัวหนังสือล้วน ไว้ค้นหา — บท 136) · คอลัมน์นี้อยู่ในตาราง posts ตามปกติ:

$ bin/rails generate migration AddPlainTextToPosts plain_text:text
      invoke  active_record
      create    db/migrate/20261110034341_add_plain_text_to_posts.rb
$ bin/rails db:migrate
== 20261110034341 AddPlainTextToPosts: migrating ==============================
-- add_column(:posts, :plain_text, :text)
   -> 0.0009s
== 20261110034341 AddPlainTextToPosts: migrated (0.0023s) =====================

ไฟล์ migration ที่ได้ไม่ต้องแก้ (add_column :posts, :plain_text, :text บรรทัดเดียว — ชื่อแบบ AddXxxToPosts ทำให้ generator เขียนให้เองตามบท 108) · เป็นคอลัมน์ใหม่ที่ว่างได้ ไม่มีค่าเริ่มต้น = ปลอดภัยตามกฎบท 109

แล้วแก้ model ทั้งไฟล์ เป็นแบบนี้ — app/models/post.rb:

class Post < ApplicationRecord
  belongs_to :category
  has_many :comments, dependent: :destroy
  # เนื้อหาแบบ rich text เก็บในตาราง action_text_rich_texts (ไม่ได้อยู่ในตาราง posts)
  has_rich_text :body

  validates :title, presence: true, length: { maximum: 120 }
  validates :body, presence: true

  # ทุกครั้งที่บันทึก: เก็บข้อความล้วนของ body ไว้ใน plain_text (ไว้ค้นหาทีหลัง)
  # และเขียนลง description ด้วย (expand-contract: คอลัมน์เก่ายังอยู่ เขียนทั้งสองช่องไปก่อน)
  before_save :copy_body_to_plain_text

  scope :recent, -> { order(created_at: :desc) }

  private
    def copy_body_to_plain_text
      self.plain_text = body.to_plain_text
      self.description = plain_text
    end
end

• validates :body, presence: true — แทน validates :description เดิม · ตอนนี้ช่องที่ผู้ใช้ต้องกรอกคือ body
• before_save :copy_body_to_plain_text — ก่อนบันทึกทุกครั้ง เรียก method ข้างล่าง (บท 112)
• body.to_plain_text — ถอดแท็กทิ้ง เหลือตัวหนังสือล้วน (แบบ strip_tags ในบท 136 · ขึ้นบรรทัดใหม่ยังเป็น \n) → เก็บลง plain_text
• self.description = plain_text — เขียนลงช่องเก่าด้วย (= "เขียนทั้งสองที่") · เหตุผลที่สองคือคอลัมน์ description ในฐานข้อมูลตั้งไว้ว่าห้ามว่าง (null: false) · ถ้าไม่เติมให้ บทความใหม่จะบันทึกไม่ได้

ขั้น 4 · ย้าย 30 บทความเดิมด้วย rake task

กฎจากบท 109: การย้ายข้อมูลอยู่ในงานแยก ไม่ใช่ในไฟล์ migration · งานแยกแบบหนึ่งคือ rake task = คำสั่งที่เราเขียนเพิ่มเอง แล้วรันด้วย bin/rails ชื่องาน · ให้ generator สร้างโครงให้ (posts = กลุ่มของงาน · backfill_body = ชื่องาน):

$ bin/rails generate task posts backfill_body
      create  lib/tasks/posts.rake

ไฟล์ที่ได้เป็นงานเปล่า ๆ (desc "TODO" + task backfill_body: :environment do … end) · เขียนทับทั้งไฟล์เป็น — lib/tasks/posts.rake:

namespace :posts do
  desc "ย้าย description (ข้อความล้วน) ไปเป็น body (rich text) ให้บทความที่ยังไม่มี body — รันซ้ำได้"
  task backfill_body: :environment do
    # เลือกเฉพาะบทความที่ยังไม่มีแถวใน action_text_rich_texts → รันรอบสองจะไม่ทับของที่ย้ายแล้ว
    Post.where.missing(:rich_text_body).find_each do |post|
      # escape ก่อน: ถ้าใน description มีคำว่า <script> ให้โชว์เป็นตัวอักษร ไม่กลายเป็นแท็ก
      text = ERB::Util.html_escape(post.description)
      # ขึ้นบรรทัดใหม่ → <br> แบบเดียวกับที่ Trix เก็บ
      post.update!(body: "<div>#{text.gsub(/\r?\n/, "<br>")}</div>")
    end

    puts "บทความทั้งหมด #{Post.count} · ยังไม่มี body #{Post.where.missing(:rich_text_body).count}"
  end
end

• namespace :posts + task backfill_body: — ได้ชื่อคำสั่ง posts:backfill_body · desc = คำอธิบายที่โชว์ใน bin/rails -T · :environment = โหลดแอปก่อน (ไม่งั้นใช้ Post ไม่ได้)
• where.missing(:rich_text_body) — "บทความที่ยังไม่มีแผ่นในลิ้นชักกลาง" (rich_text_body คือชื่อ has_one ที่ has_rich_text :body สร้างให้) · ทำให้รันซ้ำได้: รอบสองไม่เหลือใครให้ย้าย
• find_each — วนทีละกองแทนโหลดทั้งตารางเข้าหน่วยความจำ (บท 114)
• ERB::Util.html_escape — ใส่ซองใสแบบเดียวกับ <%= %> · description เดิมเป็นตัวหนังสือล้วน ถ้าในนั้นมีคำว่า <b> ต้องโชว์เป็นตัวอักษร ไม่ใช่กลายเป็นตัวหนาหลังย้าย
• gsub(/\r?\n/, "<br>") — เปลี่ยนการขึ้นบรรทัดใหม่เป็นแท็ก <br> (/…/ = รูปแบบที่จะค้น · \r?\n = ขึ้นบรรทัดใหม่ทั้งแบบ Windows และ Mac)
• update! — บันทึกผ่าน model → before_save ทำงาน → plain_text ถูกเติมไปพร้อมกัน · ! = พังให้เห็นถ้าบันทึกไม่ได้ (บท 107)

เทียบกับของที่รู้: rake task คล้าย "scripts" ใน package.json ฝั่ง Next.js ที่สั่งด้วย npm run ชื่อ — เป็นงานที่ตั้งชื่อไว้ แล้วใครในทีมก็สั่งด้วยชื่อเดียวกันได้ · ต่างกันตรงที่ rake task โหลดแอปทั้งตัว (:environment) จึงใช้ model ได้เลย

ก่อนรัน ดูสถานะใน console — ผลจริง:

wongnok-blog-all-in-one(dev):001> Post.where.missing(:rich_text_body).count
  Post Count (0.8ms)  SELECT COUNT(*) FROM "posts" LEFT OUTER JOIN "action_text_rich_texts" "rich_text_body" ON "rich_text_body"."record_type" = 'Post' AND "rich_text_body"."name" = 'body' AND "rich_text_body"."record_id" = "posts"."id" WHERE "rich_text_body"."id" IS NULL /*application='WongnokBlogAllInOne'*/
=> 30
wongnok-blog-all-in-one(dev):002> Post.where(plain_text: nil).count
  Post Count (0.6ms)  SELECT COUNT(*) FROM "posts" WHERE "posts"."plain_text" IS NULL /*application='WongnokBlogAllInOne'*/
=> 30

• LEFT OUTER JOIN … WHERE "rich_text_body"."id" IS NULL — SQL ของ where.missing: "เอาบทความทุกชิ้นไปจับคู่กับแผ่นในลิ้นชักกลาง แล้วเลือกเฉพาะชิ้นที่หาคู่ไม่เจอ"
• 30 ทั้งสองบรรทัด — ยังไม่มีบทความไหนมี body หรือ plain_text เลย

ออกจาก console (exit) แล้วรันงานสองรอบติดกัน — ผลจริง:

$ bin/rails posts:backfill_body
บทความทั้งหมด 30 · ยังไม่มี body 0
$ bin/rails posts:backfill_body
บทความทั้งหมด 30 · ยังไม่มี body 0

รอบสองได้บรรทัดเดิม ไม่พัง ไม่สร้างซ้ำ · ตรวจใน console อีกที — ผลจริง:

wongnok-blog-all-in-one(dev):001> Post.where.missing(:rich_text_body).count
  …
=> 0
wongnok-blog-all-in-one(dev):002> Post.where(plain_text: nil).count
  …
=> 0
wongnok-blog-all-in-one(dev):003> ActionText::RichText.count
  ActionText::RichText Count (2.7ms)  SELECT COUNT(*) FROM "action_text_rich_texts" /*application='WongnokBlogAllInOne'*/
=> 30
wongnok-blog-all-in-one(dev):004> ActionText::RichText.first
  …
=>
#<ActionText::RichText:0x000000012cc315b8
 id: 1,
 name: "body",
 body: #<ActionText::Content "<div>ต้มยำกุ้งแบบน้ำข้...">,
 record_type: "Post",
 record_id: 1,
 created_at: "2026-11-10 10:43:59.970055000 +0700",
 updated_at: "2026-11-10 10:43:59.970055000 +0700">

• 0 · 0 · 30 — ทุกบทความมี body และ plain_text แล้ว · ลิ้นชักกลางมี 30 แผ่นพอดี (ไม่ซ้ำแม้รันสองรอบ)
• แผ่นแรก: record_type: "Post" + record_id: 1 = เนื้อหาของบทความเลข 1 · body ขึ้นต้นด้วย <div>ต้มยำกุ้ง… ตามที่ task ห่อไว้ · เวลา created_at และเลข 0x… ของคุณจะต่างจากนี้
• description ยังอยู่ครบทุกแถว — ไม่มีคำสั่งไหนในบทนี้ลบมัน

ขั้น 5 · ฟอร์มและหน้าแสดงผล

ตอนนี้ข้อมูลพร้อม แต่หน้าเว็บยังใช้ description อยู่ · แก้ 3 ไฟล์

① ฟอร์ม — app/views/posts/_form.html.erb ก้อนช่องเนื้อหา (ก้อน <div class="my-5"> ที่สอง) เปลี่ยนเป็น:

  <div class="my-5">
    <%= form.label :body, "เนื้อหา", class: "block font-medium" %>
    <%# rich_textarea = ช่องพิมพ์ของ Trix (ตัวหนา ลิงก์ หัวข้อ) ส่งค่าเป็น HTML ไปที่ post[body] %>
    <%= form.rich_textarea :body, class: ["mt-2 min-h-40", {"border-error": post.errors[:body].any?}] %>
  </div>

• เดิม: form.label :description … + form.textarea :description, rows: 4, class: ["textarea w-full mt-2", …] · ใหม่: เปลี่ยนเป็น :body และ rich_textarea
• rich_textarea — ชื่อจริงใน Rails 8.1 (ชื่อเก่า rich_text_area ยังใช้ได้ · ตรวจในโค้ดของ Rails แล้ว) · วาดช่อง Trix แทนกล่องข้อความธรรมดา
• min-h-40 = สูงอย่างน้อย 160px · {"border-error": …} = กรอบแดงเมื่อช่องนี้มี error (แบบเดียวกับช่องอื่นใน Day 3) · ไม่ใส่คลาส textarea ของ daisyUI เพราะ Trix มีกรอบของตัวเอง

② controller — app/controllers/posts_controller.rb บรรทัดท้ายไฟล์ (รายชื่อช่องที่รับ):

      params.expect(post: [ :title, :body, :category_id ])

เปลี่ยน :description เป็น :body · ลืมบรรทัดนี้ = พิมพ์เนื้อหาแล้วยังขึ้น Body can't be blank (ลองแล้ว) เพราะ controller ทิ้งช่อง body ก่อนถึง model

③ แม่พิมพ์บทความ — app/views/posts/_post.html.erb แก้ 2 จุด:

      <%# Action Text ล้าง HTML อันตราย (sanitize) ให้เองตอนแสดง — ห้ามใส่ raw/html_safe %>
      <div class="leading-relaxed"><%= post.body %></div>
  …
      <p class="text-base-content/80"><%= truncate(post.body.to_plain_text, length: 80, separator: " ") %></p>

• จุดแรก (หน้าเต็ม full) — เดิม <p class="leading-relaxed whitespace-pre-line"><%= post.description %></p> · ใหม่เป็น <div> เพราะเนื้อหามี <div> <ul> ข้างใน (ใส่ใน <p> ไม่ได้) · whitespace-pre-line ไม่ต้องแล้ว เพราะขึ้นบรรทัดใหม่เป็น <br>
• <%= post.body %> — ไม่ต้องใส่ sanitize หรือ raw · Action Text sanitize ให้ตอนวาดเอง (หัวข้อถัดไปพิสูจน์)
• จุดที่สอง (การ์ดหน้ารวม) — เดิม truncate(post.description, …) · ใหม่ตัดคำโปรยจาก post.body.to_plain_text (ตัวหนังสือล้วน ไม่มีแท็กปน) · ผลของ to_plain_text ไม่ได้ผ่านการล้าง (เอกสาร Rails เตือนว่าไม่รับประกันว่าปลอดภัยถ้าเอาไปใส่เป็น HTML) แต่ <%= %> ใส่ซองใสให้ จึงปลอดภัย — ห้ามครอบด้วย raw

เปิด localhost:3000/posts/new · ดู HTML ที่เบราว์เซอร์ได้รับ — ผลจริง (บรรทัดเดียวยาว ๆ):

$ curl -s localhost:3000/posts/new | grep -n 'trix-editor'
85:    <input type="hidden" name="post[body]" id="post_body_trix_input_post" /><trix-editor class="mt-2 min-h-40" id="post_body" input="post_body_trix_input_post" data-direct-upload-url="http://localhost:3000/rails/active_storage/direct_uploads" data-blob-url-template="http://localhost:3000/rails/active_storage/blobs/redirect/:signed_id/:filename"></trix-editor>

• curl -s = ขอหน้าเว็บแบบไม่โชว์แถบความคืบหน้า · | grep -n 'trix-editor' = เก็บเฉพาะบรรทัดที่มีคำนี้ พร้อมเลขบรรทัด (85: — หลังย้าย CSS ในหัวข้อถัดไปจะเหลือ 84: เพราะ <link> ของ actiontext.css หายไปหนึ่งบรรทัด)
• <input type="hidden" name="post[body]"> — ช่องที่ถูกส่งไปจริง แต่ซ่อนไว้ · ทุกครั้งที่พิมพ์ Trix เขียน HTML ลงช่องนี้
• <trix-editor … input="post_body_trix_input_post"> — ช่องที่ผู้ใช้เห็นและพิมพ์ · input="…" บอกว่าให้เขียนผลลงช่องซ่อนตัวไหน
• data-direct-upload-url — ที่อยู่สำหรับอัปโหลดไฟล์ที่แนบในเนื้อหา · เรื่องของบท 139

ผมพิมพ์ "ร้านนี้ อร่อยมาก แนะนำ" (กดปุ่ม B ตรงคำกลาง) ใน Chrome จริง · ช่องซ่อนได้ค่า <div>ร้านนี้&nbsp;<strong>อร่อยมาก</strong> แนะนำ</div> · กดบันทึกแล้วหน้าบทความโชว์ตัวหนาจริง · (  = ช่องว่างแบบที่ Trix ใส่บางจุด ไม่ต้องสนใจ)

CSS ของ Trix ต้องย้ายเข้า Tailwind

installer วาง actiontext.css ไว้ที่ app/assets/stylesheets/ · ผมลองปล่อยไว้ที่เดิม แล้ววัดใน Chrome: ช่องพิมพ์สูงแค่ 80px (ไม่สน min-h-40) · และลิงก์ในเนื้อหาสีเดียวกับตัวหนังสือ ไม่มีขีดเส้นใต้ มองไม่ออกว่าเป็นลิงก์

สาเหตุมีสองข้อ · ① ไฟล์นี้ไม่ได้อยู่ใน "ชั้น" ของ Tailwind จึงชนะคลาส Tailwind ทุกตัว · ② Tailwind ล้างหน้าตาของหัวข้อ / รายการ / ลิงก์ทิ้งทั้งเว็บตั้งแต่ต้น (บท 128 ใช้คลาสแทน) — เนื้อหาที่ผู้ใช้จัดมาจึงโชว์แบนหมด

แก้ด้วยการย้ายไฟล์ แล้วสั่งให้ Tailwind โหลดเข้า "ชั้นของ component":

$ mv app/assets/stylesheets/actiontext.css app/assets/tailwind/actiontext.css

app/assets/tailwind/application.css ทั้งไฟล์:

@import "tailwindcss";
/* ไฟล์ CSS ของ Trix ที่ action_text:install สร้าง (ย้ายมาจาก app/assets/stylesheets)
   ใส่ไว้ใน layer components → utility class อย่าง min-h-40 / border-error ยังทับได้ */
@import "./actiontext.css" layer(components);
@source not "./daisyui{,*}.mjs";
@plugin "./daisyui.mjs" {
  themes: light --default, dark --prefersdark;
}

@theme {
  --font-sans: "Noto Sans Thai", ui-sans-serif, system-ui, sans-serif;
}

/* Tailwind ล้าง style ของหัวข้อ / list / ลิงก์ทิ้งทั้งเว็บ → คืนให้เฉพาะในเนื้อหา rich text */
.trix-content h1 { font-weight: 700; }
.trix-content ul { list-style: disc; }
.trix-content ol { list-style: decimal; }
.trix-content a { color: var(--color-primary); text-decoration: underline; }

/* ไอคอนบนแถบเครื่องมือของ Trix เป็นสีดำตายตัว → ให้พื้นขาวเสมอ ธีมมืดจะได้ยังมองเห็น */
trix-toolbar .trix-button-group { background-color: white; }
trix-toolbar .trix-dialog { color: black; }

• บรรทัดที่เพิ่ม: 3 บรรทัดหลัง @import "tailwindcss"; และทุกอย่างหลังก้อน @theme · ที่เหลือเป็นของเดิมจาก Day 3
• @import "./actiontext.css" layer(components); — โหลดไฟล์ของ Trix เข้าชั้นที่คลาส Tailwind ทับได้ · ไม่ต้องแก้เนื้อในไฟล์ 440 บรรทัดนั้นเลย
• .trix-content … — คืนตัวหนาให้หัวข้อ จุดหน้ารายการ และสี+ขีดเส้นใต้ให้ลิงก์ เฉพาะในกรอบเนื้อหา (กรอบที่ _content.html.erb ห่อให้) · ส่วนอื่นของเว็บไม่โดน
• trix-toolbar … — ไอคอนบนแถบปุ่มเป็นรูปสีดำ · ธีมมืดของ Day 3 จะมองไม่เห็น จึงให้พื้นขาวเสมอ

bin/dev สร้าง CSS ใหม่ให้เอง · วัดซ้ำใน Chrome: ช่องพิมพ์ 160px · ลิงก์เป็นสี primary + ขีดเส้นใต้

Action Text ล้างของอันตรายให้ตอนโชว์

wongnok-blog-all-in-one(dev):001> post = Post.create!(title: "ทดลอง rich text", category: Category.first, body: %(<div>ร้านนี้<strong>อร่อยมาก</strong> <a href="/posts" onclick="alert(1)">ดูร้านอื่น</a><script>alert(1)</script></div>))

  ActionText::RichText Create (0.4ms)  INSERT INTO "action_text_rich_texts" ("name", "body", "record_type", "record_id", "created_at", "updated_at") VALUES ('body', '<div>ร้านนี้<strong>อร่อยมาก</strong> <a href="/posts" onclick="alert(1)">ดูร้านอื่น</a><script>alert(1)</script></div>', 'Post', 31, …)
…
wongnok-blog-all-in-one(dev):002> post.id
=> 31
wongnok-blog-all-in-one(dev):003> post.plain_text
=> "ร้านนี้อร่อยมาก ดูร้านอื่น"

$ curl -s localhost:3000/posts/31 | grep -n -A3 'trix-content'
95:--><div class="trix-content">
96-  <!-- BEGIN …/actiontext-8.1.4/app/views/action_text/contents/_content.html.erb
97---><div>ร้านนี้<strong>อร่อยมาก</strong> <a href="/posts">ดูร้านอื่น</a>alert(1)</div>
98-<!-- END …/actiontext-8.1.4/app/views/action_text/contents/_content.html.erb --></div>

นี่คือ "sanitize ตอนโชว์" ของบท 136 ที่ Action Text ทำให้ทุกครั้งที่เขียน <%= post.body %> · ข้อเสียที่ต้องจำ: ของสกปรกยังอยู่ใน DB · ทางไหนที่ไม่ผ่าน <%= post.body %> (JSON · อีเมล) ต้องระวังเอง · แอปเรามีหน้า JSON ที่ scaffold สร้างไว้ (app/views/posts/_post.json.jbuilder — เปิด /posts/1.json ดูได้) ซึ่งส่ง description (ตัวหนังสือล้วน) จึงไม่มี HTML หลุดออกไป

รายการแท็กที่อนุญาตอยู่ที่ไหน? สไลด์หน้า 6 ให้ดูที่ ActionText::ContentHelper.allowed_tags · ลองใน console — ผลจริง:

wongnok-blog-all-in-one(dev):001> ActionText::ContentHelper.allowed_tags
=> nil
wongnok-blog-all-in-one(dev):002> helper.sanitizer_allowed_tags.size
=> 46
wongnok-blog-all-in-one(dev):003> helper.sanitizer_allowed_tags.include?("script")
=> false
wongnok-blog-all-in-one(dev):004> helper.sanitizer_allowed_tags.include?("table")
=> false
wongnok-blog-all-in-one(dev):005> ActionText::ContentHelper.allowed_tags += ["table", "tr", "td"]
(wongnok-blog-all-in-one):5:in '<main>': undefined method '+' for nil (NoMethodError)

• allowed_tags → nil — "ยังไม่มีใครตั้งค่าเอง" · ไม่ได้แปลว่าไม่มีรายการ
• helper. — ใน console ใช้ helper เรียก method ที่ view ใช้ได้ (บท 104) · .size = นับจำนวน · .include?("script") = "ในรายการมีคำนี้ไหม"
• helper.sanitizer_allowed_tags — method ใน Action Text ที่คืนรายการที่ใช้จริง: ถ้า allowed_tags เป็น nil ก็ใช้รายการเริ่มต้นของ sanitize (บท 125) + แท็กสำหรับไฟล์แนบ 3 ตัว · รวม 46 แท็ก · ไม่มี script · ไม่มี table
• บรรทัด 5 — โค้ดของสไลด์ allowed_tags += [...] = "เอาค่าเดิม บวก ของใหม่" แต่ค่าเดิมคือ nil บวกไม่ได้ → พัง

ถ้าวันหนึ่งต้องเพิ่มแท็กจริง ๆ ต้องเอารายการที่ใช้อยู่มาบวก แล้วกำหนดใหม่ทั้งก้อน — ลองใน console (ผลจริง · ตัดรายการยาวออก):

wongnok-blog-all-in-one(dev):006> ActionText::ContentHelper.allowed_tags = helper.sanitizer_allowed_tags + ["table", "tr", "td"]
=>
Set["a",
…
wongnok-blog-all-in-one(dev):007> helper.sanitizer_allowed_tags.size
=> 49
wongnok-blog-all-in-one(dev):008> helper.sanitizer_allowed_tags.include?("table")
=> true

(Set[…] = รายการแบบที่ไม่มีของซ้ำ ใช้แบบ Array ได้) · ค่าที่ตั้งใน console หายเมื่อปิด console · โปรเจกต์เราไม่เพิ่มอะไร (ไม่มีไฟล์ config/initializers/action_text.rb) — ตามบท 136: ขยาย allowlist เท่าที่จำเป็นเท่านั้น

ค้นหาจาก plain_text — ไม่ใช่จาก body

สไลด์หน้า 5 เตือนว่า "ค้นหาด้วย WHERE body LIKE ไม่ได้" · ลองให้เห็นกับตาใน console เดิมต่อจากข้างบน (บทความทดลองเลข 31 ยังอยู่) — ผลจริง (ตัด error ยาว ๆ ด้านล่างออก):

wongnok-blog-all-in-one(dev):009> Post.where("body ILIKE ?", "%อร่อยมาก%").count
  Post Count (0.6ms)  SELECT COUNT(*) FROM "posts" WHERE (body ILIKE '%อร่อยมาก%') /*application='WongnokBlogAllInOne'*/
(wongnok-blog-all-in-one):9:in '<main>': PG::UndefinedColumn: ERROR:  column "body" does not exist (ActiveRecord::StatementInvalid)
…
wongnok-blog-all-in-one(dev):010> Post.where("plain_text ILIKE ?", "%อร่อยมาก%").pluck(:id)
  Post Pluck (0.5ms)  SELECT "posts"."id" FROM "posts" WHERE (plain_text ILIKE '%อร่อยมาก%') /*application='WongnokBlogAllInOne'*/
=> [31]
wongnok-blog-all-in-one(dev):011> Post.where("plain_text ILIKE ?", "%strong%").pluck(:id)
  Post Pluck (0.4ms)  SELECT "posts"."id" FROM "posts" WHERE (plain_text ILIKE '%strong%') /*application='WongnokBlogAllInOne'*/
=> []

• ILIKE = ค้นคำแบบไม่สนตัวพิมพ์เล็ก/ใหญ่ (ของ PostgreSQL — บท 136) · %…% = "มีคำนี้อยู่ตรงไหนก็ได้" · ? = ช่องที่ Rails เอาค่าถัดไปมาใส่ให้อย่างปลอดภัย
• บรรทัด 9 — column "body" does not exist · ตาราง posts ไม่มีคอลัมน์ body (body ของเราอยู่ในลิ้นชักกลาง)
• บรรทัด 10 — ค้นจาก plain_text เจอบทความทดลอง (เลข 31 · ของคุณจะเป็นเลขเดียวกับ post.id ตอนสร้าง)
• บรรทัด 11 — ค้นคำว่า strong ไม่เจอ ทั้งที่ HTML ของบทความนั้นมี <strong> · บท 136 ค้นจาก HTML แล้วเจอเพราะชื่อแท็กปน · plain_text แก้ปัญหานั้นแล้ว

plain_text ถูกอัปเดตทุกครั้งที่บันทึกผ่าน model (callback ในขั้น 3) — ทั้งตอนสร้าง แก้ และตอน backfill · เสร็จแล้วลบบทความทดลอง: Post.find(31).destroy (ใช้เลขของคุณ) · log จะมี ActionText::RichText Destroy ตามด้วย Post Destroy = ลบแผ่นในลิ้นชักกลางให้ด้วย

ขั้น 6 · N+1 ตัวใหม่ — และ bullet ที่เตือนผิด

การ์ดหน้ารวมเรียก post.body.to_plain_text ทุกใบ · post.body แต่ละครั้ง = เดินไปลิ้นชักกลาง 1 รอบ (เห็นแล้วใน predict ขั้น 2) · เปิด localhost:3000/posts แล้วดู log ของใบสั่งนี้ — ผลจริง (ตัดบรรทัด Rendered ออก):

Processing by PostsController#index as HTML
  Post Count (9.0ms)  SELECT COUNT(*) FROM "posts" …
  Post Load (1.1ms)  SELECT "posts".* FROM "posts" ORDER BY "posts"."created_at" DESC LIMIT 10 OFFSET 0 …
  Category Load (0.9ms)  SELECT "categories".* FROM "categories" WHERE "categories"."id" IN (5, 4, 3, 2, 1) …
  ActionText::RichText Load (1.0ms)  SELECT "action_text_rich_texts".* FROM "action_text_rich_texts" WHERE "action_text_rich_texts"."record_id" = 30 AND "action_text_rich_texts"."record_type" = 'Post' AND "action_text_rich_texts"."name" = 'body' LIMIT 1 …
  ↳ app/views/posts/_post.html.erb:24
  ActionText::RichText Load (1.1ms)  SELECT "action_text_rich_texts".* FROM "action_text_rich_texts" WHERE "action_text_rich_texts"."record_id" = 29 AND … LIMIT 1 …
  ↳ app/views/posts/_post.html.erb:24
  …  (record_id = 28 ลงไปถึง 21 อีก 8 ครั้ง)
Completed 200 OK in 96ms (Views: 47.2ms | ActiveRecord: 13.5ms (13 queries, 0 cached) | GC: 9.5ms)
…
USE eager loading detected
  Post => [:rich_text_body]
  Add to your query: .includes([:rich_text_body])

• GC: ท้ายบรรทัด Completed = เวลาที่ Ruby เก็บกวาดหน่วยความจำ ไม่ต้องสนใจ
• ActionText::RichText Load … record_id = 30 · = 29 · … — บรรทัดเดียวกันซ้ำ 10 ครั้ง ต่างแค่เลข = N+1 (บท 114)
• _post.html.erb:24 ลบหนึ่ง = บรรทัด 23 = บรรทัด truncate(post.body.to_plain_text …) ที่เพิ่งแก้ (กฎ "ไฟล์ .erb ลบหนึ่ง" จากบท 113)
• (13 queries) = 3 ตัวปกติ + 10 ตัวของ rich text · bullet (บท 125) จับได้และบอกให้ includes

แก้ที่ controller (ไม่ใช่ view) — Action Text เตรียม scope ไว้ให้แล้วชื่อ with_rich_text_body (= with_rich_text_ + ชื่อช่อง) · app/controllers/posts_controller.rb action index:

  def index
    # with_rich_text_body = ดึง body ของทั้งหน้ามาในคำสั่งเดียว (ไม่งั้น N+1 ทีละบทความ)
    @pagy, @posts = pagy(Post.includes(:category).with_rich_text_body.recent, limit: 10)
  end

รีเฟรช — ผลจริง:

  ActionText::RichText Load (0.7ms)  SELECT "action_text_rich_texts".* FROM "action_text_rich_texts" WHERE "action_text_rich_texts"."record_type" = 'Post' AND "action_text_rich_texts"."name" = 'body' AND "action_text_rich_texts"."record_id" IN (30, 29, 28, 27, 26, 25, 24, 23, 22, 21) …
Completed 200 OK in 22ms (Views: 13.7ms | ActiveRecord: 4.3ms (4 queries, 0 cached) | GC: 0.0ms)
…
AVOID eager loading detected
  Post => ["rich_text_body"]
  Remove from your query: .includes([:rich_text_body])

• record_id IN (30, 29, …, 21) — ไปลิ้นชักกลางรอบเดียว หยิบมาทั้ง 10 แผ่น · 13 → 4 queries
• แต่ bullet กลับตะโกน AVOID eager loading = "หยิบมาล่วงหน้าแล้วไม่ได้ใช้ เอาออกซะ" · คำเตือนนี้ผิด — ตัวเลขใน log บอกชัดว่าใช้จริง (ถ้าเอาออกจะกลับไป 13)

ทำไมเตือนผิด: ในโค้ดของ Action Text scope นี้เขียนชื่อเป็นข้อความ "rich_text_body" · แต่ bullet นับการใช้งานเป็นสัญลักษณ์ :rich_text_body (บท 92) · สองอย่างนี้หน้าตาคล้ายกันแต่ไม่นับเป็นตัวเดียวกัน — สังเกตใน log: ["rich_text_body"] มีเครื่องหมายคำพูด

บอก bullet ให้เงียบเฉพาะเรื่องนี้ — config/environments/development.rb ในก้อน config.after_initialize do ใต้ Bullet.add_footer = true:

    # with_rich_text_body ใช้ชื่อ "rich_text_body" แบบ string แต่ Bullet นับการใช้งานเป็น symbol
    # จึงเตือน AVOID eager loading ทั้งที่ใช้จริง (เตือนผิด) — ห้ามลบ with_rich_text_body ตามคำเตือนนี้
    Bullet.add_safelist type: :unused_eager_loading, class_name: "Post", association: :rich_text_body

• add_safelist — "รายการยกเว้น" ของ bullet · type: :unused_eager_loading = เฉพาะคำเตือนแบบ AVOID · class_name + association = เฉพาะ Post กับ rich_text_body · คำเตือนอื่นยังทำงานครบ
• comment สองบรรทัดสำคัญพอ ๆ กับโค้ด — กันคนหรือ AI รุ่นหลังทำตามคำเตือนแล้วลบ with_rich_text_body ทิ้ง

ปิดงาน — seeds แล้ว commit

เหลือไฟล์สุดท้าย: db/seeds.rb (ข้อมูลตั้งต้นที่ bin/rails db:seed ใส่ให้ — Day 3) ยังสร้างบทความด้วย description · ถ้าเพื่อนสร้าง DB ใหม่จาก seeds จะได้บทความที่ไม่มี body · แก้ในก้อน Post.find_or_create_by! ท้ายไฟล์:

    title, text = POSTS[slug][round]
    Post.find_or_create_by!(title: title) do |post|
      # เนื้อหาอยู่ใน body (Action Text) แล้ว · description กับ plain_text ถูกเติมให้เองตอน save (ดู app/models/post.rb)
      post.body        = text
      post.category    = categories[slug]
      post.created_at  = (30 - position).days.ago
    end

• เดิม: title, description = … และ post.description = description · ใหม่: ตั้งชื่อตัวแปรว่า text แล้วใส่ลง post.body · description/plain_text มาจาก callback เอง
• ใส่ตัวหนังสือล้วนลง body ตรง ๆ ได้เพราะข้อความใน seeds ไม่มี < > & · seeds ไม่แตะบทความที่มีอยู่แล้ว (ค้นด้วย title) → DB เดิมของคุณยังต้องพึ่ง posts:backfill_body ที่รันไปแล้ว

ดูว่าแตะอะไรไปบ้าง แล้ว commit — ผลจริง:

$ git add -A
$ git status --short
A  app/assets/tailwind/actiontext.css
M  app/assets/tailwind/application.css
M  app/controllers/posts_controller.rb
M  app/javascript/application.js
M  app/models/post.rb
A  app/views/active_storage/blobs/_blob.html.erb
A  app/views/layouts/action_text/contents/_content.html.erb
M  app/views/posts/_form.html.erb
M  app/views/posts/_post.html.erb
M  config/environments/development.rb
M  config/importmap.rb
A  db/migrate/20261110034320_create_active_storage_tables.active_storage.rb
A  db/migrate/20261110034321_create_action_text_tables.action_text.rb
A  db/migrate/20261110034341_add_plain_text_to_posts.rb
M  db/schema.rb
M  db/seeds.rb
A  lib/tasks/posts.rake
A  test/fixtures/action_text/rich_texts.yml
$ git commit -m "Action Text: เนื้อหาเป็น rich text (body) + ย้ายข้อมูลจาก description แบบ expand"
[my-day3 381409b] Action Text: เนื้อหาเป็น rich text (body) + ย้ายข้อมูลจาก description แบบ expand
 18 files changed, 651 insertions(+), 10 deletions(-)
 create mode 100644 app/assets/tailwind/actiontext.css
 create mode 100644 app/views/active_storage/blobs/_blob.html.erb
 create mode 100644 app/views/layouts/action_text/contents/_content.html.erb
 create mode 100644 db/migrate/20261110034320_create_active_storage_tables.active_storage.rb
 create mode 100644 db/migrate/20261110034321_create_action_text_tables.action_text.rb
 create mode 100644 db/migrate/20261110034341_add_plain_text_to_posts.rb
 create mode 100644 lib/tasks/posts.rake
 create mode 100644 test/fixtures/action_text/rich_texts.yml

• 18 ไฟล์ — A = ไฟล์ใหม่ · M = แก้ของเดิม · ไม่มี D (ไม่ได้ลบอะไร) · app/assets/stylesheets/actiontext.css ไม่อยู่ในรายการเพราะย้ายไปก่อนเคย commit
• เลขหน้าชื่อ migration · เลข commit (381409b) ของคุณต่างจากนี้ได้ · บรรทัด create mode = รายชื่อไฟล์ใหม่ 8 ไฟล์ (ตรงกับตัว A ข้างบน) · ถ้าจำนวนไฟล์ไม่ใช่ 18 ให้เทียบรายการด้านบนว่าขาดหรือเกินตัวไหน

ให้ AI ช่วย — แต่ตรวจด้วย checklist นี้

งานแบบนี้ (เปลี่ยนช่องข้อความเป็น rich text บน model อื่น เช่นช่อง bio ของผู้ใช้) ให้ AI ทำได้เมื่อคุณทำเองเป็นแล้ว · ตัวอย่าง prompt (บท 141 จะเขียนฉบับเต็มเก็บใน prompts/04-content.md):

อ่าน prompts/00-context.md ก่อน
เปลี่ยน Shop#description (ข้อความล้วน) เป็น rich text ด้วย Action Text (has_rich_text :body)
- ห้ามลบคอลัมน์ description ในรอบนี้ (expand-contract) · ให้ model เขียนลง description ด้วยทุกครั้งที่ save
- เพิ่มคอลัมน์ plain_text ที่เติมจาก body.to_plain_text ตอน before_save
- ย้ายข้อมูลเดิมด้วย rake task ที่รันซ้ำได้ (ห้ามทำใน migration) · escape ข้อความเดิมก่อนห่อเป็น HTML
- หน้ารายการที่อ่าน body ต้องใช้ with_rich_text_body
- ห้ามใช้ raw หรือ html_safe กับ body · ห้ามแก้ allowed_tags
บอกรายการไฟล์ที่จะแก้ก่อนลงมือ

(Shop เป็นชื่อสมมติ — แอปเราไม่มี model นี้ · ใช้เป็นแบบเขียน prompt เท่านั้น) · ตรวจงานที่ AI ส่งกลับมาด้วยข้อพวกนี้:

1. git diff ต้องไม่มี remove_column :…, :description และไม่มี migration ที่เรียก model ข้างใน
2. รัน rake task สองรอบ · รอบสองต้องไม่สร้างแถวซ้ำ (ActionText::RichText.count เท่าเดิม)
3. grep -rn "raw\|html_safe" app/views (-r = ค้นทุกไฟล์ในโฟลเดอร์ · \| = "หรือ") ต้องไม่เจอที่ใช้กับ body
4. เปิดหน้ารายการ ดู (N queries) ใน log · ถ้า AI ลบ with_rich_text_body ตามคำเตือน AVOID ของ bullet → ตัวเลขจะพุ่งกลับ
5. ลองบันทึกเนื้อหาที่มี <script>alert(1)</script> ใน console แล้ว curl หน้า show ต้องไม่เห็นแท็ก script

wongnok-blog-all-in-one(dev):003> ActionText::RichText.last.body.to_html
=> "<div><strong>เมนูเด็ด</strong></div><ul><li>ต้มยำ</li><li>แกงเขียวหวาน</li></ul>"
wongnok-blog-all-in-one(dev):004> post.plain_text
=> "เมนูเด็ด\n• ต้มยำ\n• แกงเขียวหวาน"
wongnok-blog-all-in-one(dev):005> post.destroy
  …
  ActionText::RichText Destroy (0.6ms)  DELETE FROM "action_text_rich_texts" WHERE "action_text_rich_texts"."id" = 33 …
  Post Destroy (0.7ms)  DELETE FROM "posts" WHERE "posts"."id" = 33 …
  …
wongnok-blog-all-in-one(dev):006> ActionText::RichText.count
=> 30

ทดสอบความเข้าใจ

ถ้าเปิดสไลด์ดูประกอบ

อ้างอิง

• Rails Guides — Action Text Overview § Installation — อ่าน Installation ต่อถึง Creating Rich Text Content · ตรงกับขั้น 1–2 และ 5 ของบทนี้ (has_rich_text · rich_textarea · params)
• Rails Guides — Action Text Overview § Rendering Rich Text Content — อ่านหัวข้อนี้หัวข้อเดียว (สั้น): ยืนยันว่า <%= @article.content %> ปลอดภัยเพราะ sanitize แล้ว · และเตือนว่า to_plain_text ไม่ได้ล้าง · หัวข้อถัดไป (5.1) บอกที่มาของกรอบ trix-content
• Rails Guides — Action Text Overview § Avoiding N+1 Queries — หัวข้อสั้น ๆ ท้ายหน้า · with_rich_text_content กับ …_and_embeds
• Rails API — ActionText::Attribute#has_rich_text — อ่านตัวอย่างและ Options · เห็นว่ามันสร้าง has_one + scope with_rich_text_… ให้
• GitHub — rails/rails v8.1.4 · action_text/content_helper.rb — ไฟล์สั้น · ดู method sanitizer_allowed_tags ท้ายไฟล์ ว่าทำไม allowed_tags เป็น nil แต่ยังมีรายการ 46 แท็ก
• Rails Guides — Active Record Associations § Polymorphic Associations — อ่านแค่ย่อหน้าแรกกับตัวอย่าง Picture · เทียบ imageable_type/imageable_id กับ record_type/record_id ของเรา
• Rails Guides — The Rails Command Line § Custom Rake Tasks — ที่มาของ namespace · desc · task …: :environment ใน lib/tasks/posts.rake

ติดตรงไหน หรือผลของคุณต่างจากในบท — ก็อปผลจริงทั้งก้อนไปถาม AI หรือเพื่อนได้เลย โดยบอกว่ามาจากบท 137 ขั้นไหน