# Tutorial

In this series of guides we teach you how to create a rails app from the ground up with matestack and encounter how matestack makes your life easier and takes away the frontend hustle. We build a demo CRUD application which you can take a look at [here](https://demo.matestack.io) or checkout the below screenshot to get an idea of what we build. The source code of the complete application can be found on [github](https://github.com/matestack/matestack-demo-application).

Get started by reading the [introduction](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/00_introduction.md).

## Table of contents

1. [Introduction](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/00_introduction.md)
2. [Setup](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/01_setup.md)
3. [Active Record](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/02_active_record.md)
4. [Index, Show, Transition](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/03_index_show_transition.md)
5. [Forms, CRUD](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/04_forms_edit_new_create_update_delete.md)
6. [Toggle Component](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/05_toggle_component.md)
7. [Async Component](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/06_async_component.md)
8. [Partials and Custom Components](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/07_partials_and_custom_components.md)
9. [Collection Component](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/08_collection_async.md)
10. [Custom Vue.js Components](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/09_custom_vue_js_components.md)
11. [Styling and Notifications](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/10_styling_notifications.md)
12. [Authentication with Devise](/matestack-ui-core/1.5.0/spa-like-apps/tutorial/11_authentication_devise.md)
13. [Wrap Up](https://github.com/matestack/matestack-ui-core/tree/829eb2f5a7483ef4b78450a5429589ec8f8123e8/docs/reactive_apps/1000-tutorial/12_wrap_up.md)
14. [Heroku Deployment](https://github.com/matestack/matestack-ui-core/tree/829eb2f5a7483ef4b78450a5429589ec8f8123e8/docs/reactive_apps/1000-tutorial/13_heroku_deployment.md)

![Demo Application](/files/Y4K6YNm2DH3ualgJqYOZ) Above screenshot shows the startpage of our application which we will create together in this tutorial.


---

# 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/matestack-ui-core/1.5.0/spa-like-apps/tutorial.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.