Matestack Ui Core
AboutMatestack Ui CoreMatestack Ui VueJsMatestack Ui Bootstrap
3.0
3.0
  • Welcome
  • Migrating from 2.x to 3.0
  • Getting started
    • Installation & Update
    • Hello World
  • HTML Rendering
    • Basic Rendering Mechanism
    • Integrating Action View Helpers
    • Integrating Rails Views or Partials
  • Components
    • API
    • Usage on Rails Views
    • Usage on Matestack Pages
    • Usage on Matestack Layouts
    • Usage in Isolation
    • Registry
  • Pages
    • API
    • Rails Controller Integration
  • Layouts
    • API
    • Rails Controller Integration
Powered by GitBook
On this page

Was this helpful?

Edit on GitHub
  1. Components

Usage on Rails Views

If you already have plenty of Rails views (ERB, Haml or Slim) and want to start creating small UI components in pure Ruby, you are able to use components on these existing views.

app/matestack/components/products/teaser.rb
class Components::Products::Teaser < Matestack::Ui::Component

  requires :product

  def response
    a path: product_path(context.product), class: 'product-teaser' do
      div do
        h2 context.product.name
        paragraph conext.product.description
        b context.product.price
      end
    end
  end

end

The class is then called on your Rails view, in this case an ERB view:

<%= @products.each do |product| %>
  <%= Components::Products::Teaser.(product: product) %>
<% end %>

This approach is suitable for existing apps and a good idea to migrate to Matestack step by step. If you start with a blank Rails app, we recommend to go full Matestack right away**!**

PreviousAPINextUsage on Matestack Pages

Last updated 3 years ago

Was this helpful?