# Frontend UI tutorial

This tutorial will guide you through the process of implementing the frontend for your contracts. It relies on the following libraries:

* React: A library for building user interfaces.
* React-query: Used for making RPC queries and caching data.
* Recoil.js: A state management library for managing application state.
* Chakra UI: A UI kit that provides pre-styled components for building user interfaces.

The reason for choosing these libraries is that they work seamlessly with Cosmos-related libraries such as ts-codegen, which generates types and queries from contracts, and CosmosKit, which facilitates integration with wallets.

The code used in this tutorial is available on GitHub at the following repository: <https://github.com/topmonks/juno-dapp-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://topmonks.gitbook.io/junodocs/developer-guides/miscellaneous/frontend-ui-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.
