# Conan State Demos

## Docs

* [Conan State](/data/conan-state.md)
* [Dependency Injection](/dependency-injection.md)

## Hello World

### Highlights

* Simplest possible example we could think to showcase Conan State

{% content-ref url="/pages/-M9U259\_XPDDFTkNz0BF" %}
[Hello World](/tutorials/conan-state-demos/hello-wow.md)
{% endcontent-ref %}

## Todos App

### Todos

#### Highlights

* Simple application, no async operations
* Uses dependency injection to scope the state.
* Connects data using React components.

{% content-ref url="/pages/-M9U3VdgOI63wzcbKcEL" %}
[Todos - Basic](/tutorials/conan-state-demos/todos/todos-sync.md)
{% endcontent-ref %}

### Todos - Async

#### Highlights

* Simplest async demo.
* Uses dependency Injection to scope the state and a service
* Uses auto-bind to connect the service to the state.
* Builds up from the code used in the Todos demo

{% content-ref url="/pages/-M9U3Z3tCbIdWDOhZPx7" %}
[Todos - Async](/tutorials/conan-state-demos/todos/todos-async.md)
{% endcontent-ref %}

### Todos - Optimistic

#### Highlights

* Advanced async demo, it showcases the potential of ConanJs to let you perform optimistic async operations
* Builds up from the code used in the Todos  - Async demo

{% content-ref url="/pages/-M9U3cip1z33a-FiHCQu" %}
[Todos - Optimistic](/tutorials/conan-state-demos/todos/todos-optimistic.md)
{% endcontent-ref %}

## Github Issues Viewer

Highlights

* Uses real endpoints to fetch data.
* Uses react hooks to observe the data

{% content-ref url="/pages/-M9U3fePsN6qiI6QJAUJ" %}
[Github issues viewer](/tutorials/conan-state-demos/github-issues-viewer.md)
{% endcontent-ref %}


---

# 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.conanjs.io/tutorials/conan-state-demos.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.
