Sử dụng gem Breakfast để tích hợp Frontend Framework vào dự án Rails

Rails + Brunch.io = ❤️

Breakfast là gem dùng để kết hợp công cụ Javascript hiện đại vào dự án Rails của bạn. Được cung cấp bởi Brunch.io. Nhận hỗ trợ cho cú pháp & mô-đun ES6, live reload cho CSS, JS, và HTML và hỗ trợ Yarn. Với Breakfast, chỉ mất một vài phút là đã tích hợp được một frontend framework mới vào dự án rồi.

Brunch.IO

Brunch (breakfast-lunch) là sự kết hợp đầy ngẫu hứng của một bữa ăn trễ hơn bữa sáng, nhưng cũng chưa đến giờ ăn trưa. Nói cách khác, đó là bữa tiệc dành cho những người yêu thích cuộc sống phóng khoáng tận hưởng “một ngày trễ” theo cách tự do tự tại. À, hình như mình nhầm. Brunch cũng giống như Gulp hoặc Grunt, đều giúp ta chạy các tác vụ một cách tự động. Nhưng có điểm khác đó là có tốc độ nhanh hơn nhưng config đơn giản hơn nhiều. Và với Brunch, bạn chỉ cần 3 câu lệnh đơn giản:

Cú pháp ES6

Nhận hỗ trợ cho tất cả các cú pháp ES6 mới. Imports, exports, arrows, classes đều làm việc được với Breakfast.

import HelloWorld from "./hello"

let App = {
  init() {
    HelloWorld.sayHello();
  }
};

module.exports = App;

Tích hợp Yarn

Yarn là công cụ quản lý thư viện javascript mã nguồn mở tốc độ cao, tin cậy và bảo mật nhằm thay thế NPM (Node Package Management). Được hình thành bởi các kỹ sư Facebook, Google, Exponent và Tilde, và đã được sử dụng thực tế mức Production tại các công ty trên. Và tin tốt là nó được hỗ trợ ở đây. Bạn sẽ có thể quản lí các dependencies của dự án với Yarn, và không cần phải copy hoặc download các các scripts mà không thể quản lí được version của nó vào thư mục vendor nữa.

Live Reloading

Browser sẽ tự động reload CSS, JS, HTML mỗi lần bạn save. Và việc build lại code sẽ được Brunch xử lí một cách nhanh gọn. Không còn cảnh chuyển sang trình duyệt rồi phải Reload trang nữa