> ## Documentation Index
> Fetch the complete documentation index at: https://docs.monad.xyz/llms.txt
> Use this file to discover all available pages before exploring further.

# How to publish a Farcaster Mini App

Publishing the Mini App makes it discoverable in the Farcaster app. However, the Mini App has to be hosted on a domain before it can be published.

Since Farcaster is a decentralized network with multiple clients, a standard has been adopted wherein the Farcaster clients look for the `farcaster.json` file on the Mini App hosted domain for information about the Mini App.

## Hosting the `farcaster.json` file

The `farcaster.json` has to be placed in `/.well-known/farcaster.json` endpoint.

If you are using the [Monad Mini App template](https://github.com/monad-developers/monad-miniapp-template/tree/main) you can edit the [farcaster.json](https://github.com/monad-developers/monad-miniapp-template/blob/main/app/.well-known/farcaster.json/route.ts) file with your app details before publishing the app!

If you are not using the template then you have to make sure you have a `farcaster.json` file hosted on your domain at `[domain]/.well-known/farcaster.json` endpoint.

```ts lines title="app/.well-known/farcaster.json/route.ts" theme={null}
...

const appUrl = process.env.NEXT_PUBLIC_URL;
const farcasterConfig = {
    // accountAssociation details are required to associate the published app with it's author
    // instructions on how to get these values are provided later in this guide.
    accountAssociation: {
        "header": "",
        "payload": "",
        "signature": ""
    },
    frame: {
        version: "1",
        name: "Monad Farcaster Mini App Template", // Name of your Mini App
        iconUrl: `${appUrl}/images/icon.png`, // Icon of the app in the app store
        homeUrl: `${appUrl}`, // Default launch URL
        imageUrl: `${appUrl}/images/feed.png`, // Default image to show if shared in a feed.
        screenshotUrls: [], // Visual previews of the app
        tags: ["monad", "farcaster", "miniapp", "template"], // Descriptive tags for search
        primaryCategory: "developer-tools",
        buttonTitle: "Launch Template",
        splashImageUrl: `${appUrl}/images/splash.png`, // URL of image to show on loading screen.	
        splashBackgroundColor: "#ffffff", // Hex color code to use on loading screen.
        webhookUrl: `${appUrl}/api/webhook` // Webhook url for notifications
    }
};

...
```

The above example is a partial representation of the `farcaster.json` file. The full reference for the [farcaster.json](https://github.com/monad-developers/monad-miniapp-template/blob/main/app/.well-known/farcaster.json/route.ts) file can be found [here](https://miniapps.farcaster.xyz/docs/guides/publishing#define-your-application-configuration).

## Generating `accountAssociation` using the Farcaster Mobile App.

The `accountAssociation` object in the [farcaster.json](https://github.com/monad-developers/monad-miniapp-template/blob/main/app/.well-known/farcaster.json/route.ts) file is used to associate the Mini App with the publisher's Farcaster account.

To generate the `accountAssociation` object you can use the Farcaster Mobile App.

Go to `Settings (under Developer) > Domains`, enter the domain where the Mini App is hosted and click `Generate Domain Manifest`.

<Accordion title="Can't see Developer options?">
  For the `Developer` options to be visible you will need to have `Developer mode` enabled in Farcaster.

  You can enable it by going to `Settings (under Profile and Account) > Advanced > scroll down and enable Developer mode`.

  <iframe style={{ aspectRatio: "16 / 9" }} src="https://www.youtube.com/embed/BcXOjl88ft8?si=T3eicQi_kkeSuJ1e" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen />
</Accordion>

The `accountAssociation` object will be generated it will be available in your clipboard you can then paste the values in the [farcaster.json](https://github.com/monad-developers/monad-miniapp-template/blob/main/app/.well-known/farcaster.json/route.ts) file.

```ts lines title="app/.well-known/farcaster.json/route.ts" theme={null}
...

const appUrl = process.env.NEXT_PUBLIC_URL;
const farcasterConfig = {
    accountAssociation: {
        header: "eyJmaWQiOjE3OTc5LCJ0eXBlIjoiY3VzdG9keSIsImtleSI6IjB4MGMxNWE5QkVmRTg3RjY0N0IwMDNhMjI0MTY4NDYwMzYyODQ0M2Y4YiJ9",
        payload: "eyJkb21haW4iOiJtb25hZC1taW5pYXBwLXRlbXBsYXRlLXNldmVuLnZlcmNlbC5hcHAifQ",
        signature: "MHgwYzY2NDdjZDhjOWJiY2JmYzg2NGIzZjVjYWVjY2ExMTdlOTY4ZGQwMWIzMmM0NGViMjU5ZDhlOGQyMzdhZTZiMDU1MmNmNWRiMDU1MDMwNTZmNTNhZmEwZDZlZTBlZmIyMmJmNDNmMDQ4NTdhMzk2NmY0YmMzODk2N2NlZDI5ZjFi"
    },
    ...
};

...
```

<iframe style={{ aspectRatio: "16 / 9" }} src="https://www.youtube.com/embed/zDCms51Hxcw?si=IlaAmxvBjoJMTB2k" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen />

You can find the `farcaster.json` file for Monad Mini App Template app [here](https://github.com/monad-developers/monad-miniapp-template/blob/main/app/.well-known/farcaster.json/route.ts).

Once the `farcaster.json` file is hosted, your Mini App is now discoverable in the Farcaster app, you can test it by searching for the Mini App in the Farcaster app!