# Union's Web App

[app.union.build](https://app.union.build) is built to be user friendly, extremely reliable, and blazing fast. It achieves this through a stack of optimized tools that do most processing at compile time (before you even use the app), and by connecting to our optimized [hubble](../hubble) indexer.

## Quickstart

Run the following to start a development server, once it's running edit the files in `app/` and you'll see your changes reflected immediately in the browser.

```
nix run .#app-dev-server
```

To fetch the latest [GraphQL] schema, run

```
nix run .#app-fetch-schema
```

## Architecture

It's a [SvelteKit] app that compiles to a static site such that it can later be distributed using decentralized providers like [IPFS].
Data is fetched from [graphql.union.build]. The [GraphQL] queries are defined in `./src/lib/graphql/documents`, and types for it are generated by [gql.tada]. We use [TanStack Query] to periodically fetch new data (both for [GraphQL] and REST).

For interacting with EVM chains, we use [Wagmi & Viem](https://wagmi.sh/core/getting-started). For interacting with Cosmos chains, we use [CosmJS].

The basis for our components are generated by [shadcn-svelte](https://www.shadcn-svelte.com), and then modified to adhere to our brand guidelines. Styling is done using [Tailwind].

[cosmjs]: https://github.com/cosmos/cosmjs
[gql.tada]: https://github.com/0no-co/gql.tada
[graphql]: https://graphql.org
[graphql.union.build]: https://graphql.union.build
[ipfs]: https://ipfs.tech
[sveltekit]: https://kit.svelte.dev/
[tailwind]: https://tailwindcss.com
[tanstack query]: https://tanstack.com/query/latest/docs/framework/svelte/overview