# Welcome to Matestack

{% hint style="info" %}
Version 3 of all Matestack Gems were released in February 2022

**Most important changes:**

* Split `matestack-ui-core` into `matestack-ui-core` and `matestack-ui-vuejs`
* Rails 7 support
* Vue 3 support in `matestack-ui-vuejs`
  {% endhint %}

### **What is Matestack?**

Matestack - a UI framework for Rails - enables Rails developers to craft maintainable, component based web UIs in **pure Ruby.** UI code becomes a native and fun part of your Rails app.

**--> Use more Ruby and less of everything else** (ERB/HAML/SLIM, JavaScript, CSS).

{% hint style="info" %}
**Why?** Because Ruby is just beautiful! More Ruby = More developer happiness = Higher productivity
{% endhint %}

Matestack currently offers three open source Ruby gems:

* `matestack-ui-core` ships all you need to to craft maintainable, **component based** web UIs in **pure Ruby.** 
  * Compatible with any styling and reactivity system, including Hotwire and StimulusReflex for example
  * *You have to take care of reactivity and styling yourself*
  * **-->** [Learn more](https://docs.matestack.io/about/ecosystem/matestack-ui-core#feature-walk-through)
* `matestack-ui-vuejs` ships all you need to build **reactive** UIs in **pure Ruby** orchestrating prebuilt Vue.js components with a simple Ruby DSL
  * requires `matestack-ui-core`
  * prebuilt reactive components covering typical features of a reactive web UI, such as async form submission, dynamic page transitions or async partial UI updates
  * highly extensible via pure Vue.js if required
  * *You have to take care of styling yourself*
  * **-->** [Learn more](https://docs.matestack.io/about/ecosystem/matestack-ui-vuejs#feature-walk-through)
* `matestack-ui-bootstrap`ships all you need to build **beautiful, reactive** UIs in **pure Ruby** and smart CRUD components based on Bootstrap v5. 
  * requires `matestack-ui-core` and `matestack-ui-vuejs`
  * *Don't think about reactivity and styling anymore, just create admin or application UIs faster than ever before!* 
  * **-->** [Learn more](https://docs.matestack.io/about/ecosystem/matestack-ui-bootstrap#feature-walk-through)

{% hint style="success" %}
**Share feedback, get support and get involved!** Join our growing community, get to know the core team and learn how to contribute in order to make Matestack better every day!
{% endhint %}

### Live Demo

Based on `matestack-ui-core` , `matestack-ui-vuejs` 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))

![](https://2602413197-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1pQc419ggALTWII3noPS%2Fuploads%2FgtVJ3SyUA2c9mo1hVeGM%2Fimage.png?alt=media\&token=2cc4c410-7e0e-43c7-8bb6-1e70c886f389)

### Getting Started

Read more about the Ecosystem and jump into the install guides of the separate Gems from there! 


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.matestack.io/about/welcome-to-matestack.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.