HTML to Haml Converter

แปลง HTML/ERB เป็น Haml ได้อย่างง่ายดาย ออกแบบมาเพื่อ Rails developers ที่ให้ความสำคัญกับโค้ดที่สะอาดและมีโครงสร้างชัดเจน

แท็กต่างๆ: erb haml html rails ตัวแปลงเทมเพลต แปลงโค้ด

ตัวอย่าง

🚀 358,911 การแปลงทั้งหมด (33 ในเดือนนี้)

🚀 พัฒนาทักษะของคุณด้วยคอร์สเหล่านี้

เครื่องมือนี้คืออะไร?

ตัวแปลงออนไลน์ฟรีนี้ช่วยให้คุณแปลง HTML และ ERB (Embedded Ruby) เป็นโค้ด Haml ที่สะอาดและอ่านง่ายได้ทันที เหมาะสำหรับนักพัฒนา Ruby on Rails ที่ต้องการทำให้มุมมองของพวกเขาง่ายขึ้นและทันสมัยขึ้น

วิธีการใช้งาน

วางหรือพิมพ์โค้ด HTML+ERB ของคุณลงในตัวแก้ไข
คลิก Convert เพื่อสร้าง Haml
ดาวน์โหลด คัดลอก หรือแชร์ผลลัพธ์ Haml ได้ทันที

คุณยังสามารถ ลงชื่อเข้าใช้ด้วย Google หรือ GitHub เพื่อบันทึกประวัติการแปลงและดาวน์โหลดไฟล์ในภายหลัง

ทำไมต้อง Haml?

Haml (HTML Abstraction Markup Language) เป็นเครื่องมือสร้างเทมเพลตที่ไวต่อช่องว่างสำหรับ Ruby ซึ่งใช้กันทั่วไปใน Rails มันแทนที่ HTML แบบอินไลน์ด้วยไวยากรณ์ที่สะอาดและมีการเยื้องที่อ่านและดูแลรักษาได้ง่ายขึ้น

ข้อดีของ Haml ได้แก่:

ไวยากรณ์ที่สะอาดและสั้นกว่าเมื่อเทียบกับ ERB
การอ่านและการดูแลรักษาที่ดีขึ้น
การสร้างเทมเพลตส่วนหน้าที่เร็วขึ้นสำหรับนักพัฒนา Rails

Haml ถูกใช้โดยร้านค้าและนักพัฒนา Ruby หลายแห่งสำหรับการพัฒนา Rails อย่างรวดเร็ว รวมถึง Unspace Interactive.

เรียนรู้เพิ่มเติมได้ที่ เว็บไซต์ Haml อย่างเป็นทางการ.

ตัวอย่างไวยากรณ์ Haml


%section.container
  %h1= post.title
  %h2= post.subtitle
  .content
    = post.content

ตัวอย่าง HTML+ERB vs Haml

HTML+ERB


<!doctype html>
<html>
  <head>
    <meta charset="utf-8"/>
  </head>
  <body>
    <h1>Blogg</h1>
    <p>Time: <%%= Time.now %%></p>
    <%% Post.all.each do |post| %%>
      <article>
        <h2><%%= post.title %%></h2>
        <div><%%= post.body %%></div>
      </article>
    <%% end %%>
  </body>
</html>

Haml


!!!
%html
  %head
    %meta{ content: "text/html; charset=UTF-8", "http-equiv": "Content-Type" }/
    %meta{ charset: "utf-8" }/
  %body
    %h1 Blogg
    %p
      Time:
      \#{Time.now}
    - Post.all.each do |post|
      %article
        %h2= post.title
        %div= post.body