# Dash Example Web App

[View full source code on GitHub](https://github.com/dnanexus/dnanexus-example-applets/tree/master/Tutorials/python/dash-web-app)

## Creating the web application

After configuring an `app` with Dash, start the server on port 443.

```python
app.run_server(host='0.0.0.0', port=443)
```

Inside the `dxapp.json`, you would add `"httpsApp": {"ports":[443], "shared_access": "VIEW"}` to tell the worker to expose this port.

For all web apps, if everything is running without errors (the ideal case), the line of code that starts the server keeps it running forever. The applet stops only when it is terminated. This also means that any lines of code after the server starts are not executed.

The rest of these instructions apply to building any applet with dependencies stored in an asset.

## Creating an applet on DNAnexus

Install the [DNAnexus SDK](/downloads.md#dnanexus-platform-sdk) and [log in](/user/login-and-logout.md#using-a-token-to-log-in), then run `dx-app-wizard` with default options.

### Creating the asset

`dash-asset` specifies all the packages and versions needed. These come from the [Dash installation guide](https://dash.plotly.com/installation).

```shell
pip install dash==0.39.0  # The core dash backend
pip install dash-html-components==0.14.0  # HTML components
pip install dash-core-components==0.44.0  # Supercharged components
pip install dash-table==3.6.0  # Interactive DataTable component
pip install dash-daq==0.1.0  # DAQ components
```

Add these to `dash-asset/dxasset.json`:

```json
{
  ...
  "execDepends": [
    {"name": "dash", "version":"0.39.0", "package_manager": "pip"},
        {"name": "dash-html-components", "version":"0.14.0", "package_manager": "pip"},
        {"name": "dash-core-components", "version":"0.44.0", "package_manager": "pip"},
        {"name": "dash-table", "version":"3.6.0", "package_manager": "pip"},
        {"name": "dash-daq", "version":"0.1.0", "package_manager": "pip"}
  ],
  ...
}
```

Build the asset:

```shell
dx build_asset dash-asset
```

## Use the asset from the applet

Add this asset to the applet's `dxapp.json`:

```json
"runSpec": {
    ...
    "assetDepends": [
    {
      "id": "record-xxxx"
    }
  ]
    ...
}
```

## Build the applet

Build and run the applet itself:

```shell
dx build -f dash-web-app
dx run dash-web-app
```

You can always use `dx ssh job-xxxx` to ssh into the worker and inspect what's going on or experiment with quick changes. Then go to that job's special URL `https://job-xxxx.dnanexus.cloud/` and see the result!

## Optional local testing

The main code is in `dash-web-app/resources/home/dnanexus/my_app.py` with a local launcher script called `local_test.py` in the same folder. This allows you to launch the same core code in the applet locally to iterate. This is optional because you can also do all testing on the platform itself.

Install locally the same libraries listed above.

To launch the web app locally:

```shell
cd dash-web-app/resources/home/dnanexus/
python3 local_test.py
```

Once it starts locally, open `http://127.0.0.1:8050/` in your browser to see the result.


---

# 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://documentation.dnanexus.com/getting-started/developer-tutorials/python/dash-example-web-app.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.