> For the complete documentation index, see [llms.txt](https://docs.digit.org/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.digit.org/platform/guides/developer-guide/flutter-mobile-app-ui-developer-guide/build-deploy-and-publish/build-and-deploy-flutter-web-application.md).

# Build & Deploy Flutter Web Application

## Overview

This page runs you through the steps to build the web application and deploy in respective environment.

## Steps

Follow the instructions [here](/platform/guides/developer-guide/backend-developer-guide/section-7-build-and-deploy-instructions.md) to set up the job pipeline. Ignore the steps not applicable to the front end.

{% hint style="info" %}
Instructions here are provided assuming CD/CI has been set up using the DIGIT ci-as-code module.
{% endhint %}

Before setting up the job pipeline, make sure each project has a docker folder in the root folder of the project. The cirrusci flutter docker tag must be mentioned for building the application through Jenkins. Check the image below for reference.

![](/files/uQ3UKUCKlObxrpnkPAVD)

The global assets inside the .env file should be loaded from the environment assets.

{% hint style="info" %}
**Note:** The global assets file needs to be in JSON format for Flutter
{% endhint %}

Follow the sample config added in yaml files of the respective environment to load the global assets of works\_shg\_app.

dev yaml file : [works-dev.yaml](https://github.com/egovernments/DIGIT-DevOps/blob/digit-works/deploy-as-code/helm/environments/works-dev.yaml)

```
works-shg-app:
  custom-js-injection: |
    sub_filter.conf: "
      sub_filter  '<head>' '<head>
      <script src=https://works-dev.digit.org/works-dev-asset/worksGlobalConfig.json type=text/javascript></script>';"
```

Congrats!!! We are now ready to build and deploy the application on the web.

<details>

<summary>Build</summary>

Go to the Jenkins [build](https://builds.digit.org/job/builds/) page. Click on your project to build under the folder path mentioned below.

For reference, if works\_shg\_app need to be build, Go to path\
[digit-works/job/frontend/job/works-shg-app/](https://builds.digit.org/job/builds/job/digit-works/job/frontend/job/works-shg-app/)

<img src="/files/tt6W5Lcy4P5ievvm3zn3" alt="" data-size="original">

Click on `Build with parameter`. Select the feature branch name by searching for it in the search box on the right side of the screen. Click on Build.

<img src="/files/yorwgkJy20he3NMCUqmf" alt="" data-size="original">

Once the build is successful, open the console output and find the docker image that has been built. Copy the docker image ID.

<img src="/files/41N2D56cnHTOFwEcMbXp" alt="" data-size="original">

</details>

<details>

<summary>Deploy</summary>

Go to the Jenkins [deployments](https://builds.digit.org/job/deployments/) page. Click on the desired environment you want to deploy the build

For reference, Let's deploy the works-shg-app build that was created to works-dev env.

Path ref: <https://builds.digit.org/job/deployments/job/deploy-to-works-dev/>

<img src="/files/esQcyVBjKOsK4ozV3NzJ" alt="" data-size="original">

Copy the docker image IDs from the previous step and paste in the above box. Click on "Build". Once the image is deployed, you will see a message as shown below:

<img src="/files/ajoLwRH9IOdJJPYtLqXz" alt="" data-size="original">

</details>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.digit.org/platform/guides/developer-guide/flutter-mobile-app-ui-developer-guide/build-deploy-and-publish/build-and-deploy-flutter-web-application.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
