Build a Streamlit App

Streamlit is a great tool for building micro front-ends. You can use it to build user interfaces, internal dashboards or tools for internal use.

The streamlit-app template provides codebase with Streamlit & PostgreSQL, a stack we love for its simplicity. Its simple but not to be underestimated.

​

Setup

python3 -m venv ~/.venvs/aienv
source ~/.venvs/aienv/bin/activate

pip install -U "phidata[aws]"

​

Create your codebase

Create your codebase using the streamlit-app template

phi ws create -t streamlit-app -n streamlit-app

This will create a folder streamlit-app with the following structure:

streamlit-app                 # root directory for your streamlit-app
├── ai                      # directory for AI components
    ├── assistants          # AI assistants
    ├── knowledge_base.py   # assistant knowledge base
    └── storage.py          # assistant storage
├── app                     # directory for Streamlit apps
├── db                      # directory for database components
├── Dockerfile              # Dockerfile for the application
├── pyproject.toml          # python project definition
├── requirements.txt        # python dependencies generated by pyproject.toml
├── scripts                 # directory for helper scripts
├── tests                   # directory for unit tests
├── utils                   # directory for shared utilities
└── workspace               # phidata workspace directory
    ├── dev_resources.py    # dev resources running locally
    ├── prd_resources.py    # production resources running on AWS
    ├── secrets             # directory for storing secrets
    └── settings.py         # phidata workspace settings

​

Set OpenAI Key

Set your OPENAI_API_KEY as an environment variable. You can get one from OpenAI.

export OPENAI_API_KEY=sk-***

​

Local Streamlit App

Streamlit allows us to build micro front-ends and is an extremely useful tool for building basic applications in pure python. Start your workspace using:

phi ws up

Press Enter to confirm and give a few minutes for the image to download (only the first time). Verify container status and view logs on the docker dashboard.

...
ws_settings = WorkspaceSettings(
    ...
    dev_db_enabled=False,
    prd_db_enabled=False,
    ...

return Assistant(
    ...
    # storage=pdf_assistant_storage,
    # knowledge_base=pdf_knowledge_base,
    ...
)

​

PDF Assistant

• Open localhost:8501 to view your AI Apps.
• Click on PDF Assistant in the sidebar
• Enter a username and wait for the knowledge base to load.
• Ask "How do I make pad thai?"
• Choose the RAG or Autonomous Assistant type.
• Clear the knowledge base, upload your own PDF and ask questions

​

Image Assistant

• Click on Image Assistant in the sidebar and upload an image of your choice.
• Click on "Generate Caption" or "Describe Image" to explore multimodal capabilities.

​

Website Assistant

• Click on Website Assistant in the sidebar and add a domain you'd like to chat with. For example: https://docs.phidata.com/introduction

• Ask questions like what is phidata?

​

Add your data

The PDF Assistant uses the pdf_knowledge_base defined in the ai/knowledge_base.py file. To add your own PDFs:

Checkout the ai/knowledge_base.py file for more information.

​

How this App works

The streamlit apps are defined in the app folder and the Assistants powering these apps are defined in the ai/assistants folder. Checkout the files in the ai/assistants folder for more information.

​

Delete local resources

Play around and stop the workspace using:

phi ws down

​

Next

Congratulations on running your Streamlit App locally. Next Steps:

• Run your Streamlit App on AWS
• Read how to update workspace settings
• Read how to create a git repository for your workspace
• Read how to manage the development application
• Read how to format and validate your code
• Read how to add python libraries
• Chat with us on discord