8 Building a Web UI with Streamlit
This chapter covers
- What Streamlit is and how it transforms Python scripts into web applications
- Building your first Streamlit app with a Hello World example
- Using core components: text display, user input, buttons, sidebars, and layouts
- Running Streamlit apps and understanding the development workflow
You have been building toward a voice-powered AI chat application that runs entirely on your own machine. You have the LLM backend (Ollama), the Python API layer, and soon you will add speech recognition. But you still need a way for users to interact with all of this -- a web interface. That is what Streamlit provides.
Traditional web development requires learning HTML, CSS, and JavaScript -- three separate languages that work together to create the structure, styling, and interactivity of a web page. For beginners, this means months of learning before producing anything meaningful. Streamlit eliminates that barrier entirely. You write Python -- just Python -- and Streamlit converts your code into a fully interactive web application.
8.1 What Is Streamlit?
Streamlit is a Python framework that converts Python scripts into interactive web applications. Instead, you call Python functions like st.title() and st.text_input(), and Streamlit automatically generates the web page for you.
Figure 8.1 shows what happens behind the scenes when you run a Streamlit app: