Version 2.0.0 was released on the 12th of April and proudly presented at RailsConf. Click here for more [details](migrate-from-1.x-to-2.0.md)

* Changed to MIT License

* 5 to 12 times better rendering performance \(depending on the context\)

* Removed Trailblazer dependency

* Improved core code readability/maintainability

{% endhint %}

Matestack enables Rails developers to craft maintainable web UIs in pure Ruby, skipping ERB and HTML. UI code becomes a native and fun part of your Rails app. Thanks to reactive core components built on top of Vue.js, reactivity can be optionally added without writing JavaScript, just using a simple Ruby DSL.

If necessary, extend with pure JavaScript. **No Opal involved.**

{% hint style="success" %}

**Share feedback, get support and get involved!** Join our growing [community](community/discord.md), get to know the [core team](about/team.md) and learn how to [contribute ](community/contribute.md)in order to make Matestack better every day!

Matestack presented and explained at RailsConf 2021:

{% embed url="https://www.youtube.com/watch?v=bwsVgCb97v0" %}

Matestack was created because modern web app development became more and more complex due to the rise of JavaScript frontend frameworks and the SPA frontend/REST API/JSON backend architecture. This sophisticated approach might be suitable for big teams and applications but is way to complex for most of small to medium sized teams and application scopes.

In contrast, Matestack helps Rails developers creating modern, reactive web apps while focusing on **simplicity**, **developer happiness** and **productivity**:

* [x] Use Ruby’s amazing language features while creating your UI

* [x] Skip using templating engine syntax and write pure Ruby instead

* [x] Reduce the amount of required JavaScript in order to build reactive web UIs

* [x] Create a single application, managing the full stack from database to a reactive UI in pure Ruby

* [x] **Drastically reduce the complexity of building reactive web applications**

[Hotwire](https://hotwire.dev) and [Stimulus Reflex](https://docs.stimulusreflex.com) are awesome gems. They reduce the amount of required JavaScript when implementing reactive web UIs. They allow us to use more Rails and less JavaScript. **Great!**

Matestack, developed since 2018, goes even one step further: **Use more Ruby and less of everything else** \(JavaScript, ERB/HAML/SLIM, CSS\).

{% hint style="info" %}

**Why?** Because Ruby is just beautiful! More Ruby = More developer happiness = Higher productivity

{% endhint %}

Additionally, most of Matestack does not require Action Cable or Redis, but can optionally use the power of these tools.

Matestack currently offers two open source Ruby gems**:**

* `matestack-ui-core` ships all you need to build reactive UIs in pure Ruby. You have to take care of styling and additional UI components yourself.

* `matestack-ui-bootstrap`ships all you need to build beautiful, reactive UIs in pure Ruby and smart CRUD components based on Bootstrap v5. Don't think about styling anymore and just create admin or application UIs faster than ever before! **-->** [https://docs.matestack.io/matestack-ui-bootstrap/](https://docs.matestack.io/matestack-ui-bootstrap/)

Based on `matestack-ui-core` and `matestack-ui-bootstrap` this reactive dummy app was created in pure Ruby without writing any JavaScript, ERB/HAML/SLIM and CSS: \([check it out](https://dummy.matestack.io) \| [source code](https://github.com/matestack/matestack-ui-bootstrap/tree/main/spec/dummy)\)

`matestack-ui-core` and `matestack-ui-bootstrap` are automatically tested against:

`matestack-ui-core` requires Vue.js and Vuex for its reactivity features. Following version ranges are supported:

* Vue.js ^2.6.0

* Vuex ^3.6.0

{% hint style="info" %}

Vue 3 / Vuex 4 update is planned for Q2 2021.

{% endhint %}

`matestack-ui-core` is designed to be installed via Npm or Yarn and bundled via something like Webpacker together with all your other dependencies.

{% hint style="warning" %}

Since 2.0.0 we're not shipping a pre-bundled JavaScript assets for Rails assets pipeline \(Sprockets\) users anymore.

{% endhint %}

After that, it might be a good idea to boost your knowledge with our quick start guide:

{% page-ref page="getting-started/quick-start.md" %}

Do you want to know what we're currently working on and what's planned for the next releases? Check out our GitHub Project board: [https://github.com/orgs/matestack/projects/1](https://github.com/orgs/matestack/projects/1)

* [Migrating from 1.x to 2.0](migrate-from-1.x-to-2.0.md)

* [Tutorial](getting-started/quick-start.md)

* [Support & Feedback \[WIP\]](getting-started/support-and-feedback.md)

* [Common Issues \[WIP\]](getting-started/common-issues.md)

* [Overview](built-in-reactivity/overview.md)

* [Emit Client Side Events](built-in-reactivity/emit-client-side-events/README.md)

* [Onclick Component API](built-in-reactivity/emit-client-side-events/onclick-component-api.md)

* [Toggle UI States](built-in-reactivity/toggle-ui-states/README.md)

* [Toggle Component API](built-in-reactivity/toggle-ui-states/toggle-component-api.md)

* [Call Server Side Actions](built-in-reactivity/call-server-side-actions/README.md)

* [Overview](built-in-reactivity/call-server-side-actions/overview.md)

* [Action Component API](built-in-reactivity/call-server-side-actions/action-component-api.md)

* [Reactive Forms](built-in-reactivity/reactive-forms/README.md)

* [Overview](built-in-reactivity/reactive-forms/overview.md)

* [Form Component API](built-in-reactivity/reactive-forms/form-component-api.md)

* [Input Component API](built-in-reactivity/reactive-forms/form-input-component-api.md)

* [Textarea Component API](built-in-reactivity/reactive-forms/form-textarea-component-api.md)

* [Checkbox Component API](built-in-reactivity/reactive-forms/form-checkbox-component-api.md)

* [Select Component API](built-in-reactivity/reactive-forms/form-select-component-api.md)

* [Radio Component API](built-in-reactivity/reactive-forms/form-radio-component-api.md)

* [Nested Forms](built-in-reactivity/reactive-forms/nested-forms.md)

* [Partial UI Updates](built-in-reactivity/partial-ui-updates/README.md)

* [Overview](built-in-reactivity/partial-ui-updates/overview.md)

* [Async Component API](built-in-reactivity/partial-ui-updates/async-component-api.md)

* [Cable Component API](built-in-reactivity/partial-ui-updates/cable-component-api.md)

* [Isolated Component API](built-in-reactivity/partial-ui-updates/isolated-component-api.md)

* [Page Transitions](built-in-reactivity/page-transitions/README.md)

* [Overview](built-in-reactivity/page-transitions/overview.md)

* [Transition Component API](built-in-reactivity/page-transitions/transition-component-api.md)

* [Reactive Collections](built-in-reactivity/reactive-collections/README.md)

* [Overview](built-in-reactivity/reactive-collections/overview.md)

* [Collection Component API \[WIP\]](built-in-reactivity/reactive-collections/collection-component-api.md)

* [Custom Vue.js Components](custom-reactivity/custom-vue-js-components.md)

* [Third party Vue.js components \[WIP\]](custom-reactivity/third-party-vue.js-components-wip.md)

* [Matestack's Vue.js APIs \[WIP\]](custom-reactivity/matestacks-vue.js-apis-wip.md)

* [Matestack's Vuex API \[WIP\]](custom-reactivity/matestacks-vuex-api-wip.md)

* [Action Cable](integrations/action-cable.md)

* [Devise](integrations/devise.md)

* [Authorization \[WIP\]](integrations/authorization.md)

* [CSS Frameworks \[WIP\]](integrations/css-frameworks.md)

* [Third Party JavaScript \[WIP\]](integrations/third-party-javascript.md)

* [Third Party Ruby Gems \[WIP\]](integrations/third-party-ruby-gems.md)

* [Create your own Addon \[WIP\]](matestack-addons/create-your-own-addon-wip.md)

* [Capybara & Rspec](testing/capybara-and-rspec.md)

* [Discord](community/discord.md)

* [Contribute \[WIP\]](community/contribute.md)

* [Core Team](about/team.md)

* [Sponsoring \[WIP\]](about/sponsoring-wip.md)

* [Legal Details \[WIP\]](about/legal-details-wip.md)