Welcome to Module 1!

Have you ever tried to show a data analysis or a machine learning model to someone non-technical and run into the complexity of building a frontend? Setting up the backend and frontend separately, dealing with HTML, CSS, JavaScript, and configuring routing can take weeks of work.

This is where Streamlit delivers on its promise: turn your Python script directly into an interactive web app.

In this first module, we’ll cover what Streamlit is, how to install it, and—most importantly—how its execution model (the scripting flow) works under the hood. By the end, you’ll have your first app running locally on your machine.

What is Streamlit and who is it for?

Streamlit is an open-source Python library that lets you build beautiful, interactive web apps tailored for data science and machine learning—all in a matter of minutes.

Who uses it?

  • Data Scientists: To take ML models to production without extra web engineering.
  • Analysts: To turn Pandas and Matplotlib scripts into interactive dashboards.
  • Students: To give final projects a professional interface.
  • Companies: Startups and Fortune 500 companies (like Google, Uber, or Airbnb) use it to build internal tools quickly.

Installation and your first web app

To start with Streamlit, you need Python 3.8+ and pip. We recommend using a virtual environment to keep your project isolated. Once your environment is set up, installation is a single command:

pip install streamlit

You can verify your installation by running streamlit --version.

Let’s get hands-on! Create your first script and write the following:

import streamlit as st

st.title("Hello, Streamlit!")
st.write("My first Python app.")

To launch the app, open your terminal and run:

streamlit run your_script.py

Instantly, your web browser will open at localhost:8501. Congratulations—you’ve just built and deployed your first interactive web app! Every time you save your code, the application updates automatically in your browser.

The “Scripting Flow”: The heart of Streamlit

This is the most important concept in the entire module. Understanding it will save you 80% of the bugs when programming in Streamlit.

How does Streamlit run your code? Top to bottom, always.

  1. The user opens the app and Streamlit runs the entire script, from line 1 to the last.
  2. The user interacts with the app (for example, clicks a button, types in a text box, moves a slider).
  3. Streamlit re-runs the ENTIRE script from scratch.
  4. It compares the result and only updates on screen what changed (DOM diffing).
  5. The screen updates instantly with the new data.

The Golden Rule:

Every user interaction equals a full re-run of the script.

Variables do not persist by default across these reloads, unless you use techniques like session_state (which we’ll cover in Module 3). Remember—the order of your code matters! If you try to print a variable before defining it or requesting it through an input, Python will throw an error.

Text Widgets and Titles

Writing text in your application feels very natural. Here are the tools for formatting:

  • Titles: Equivalent to H1, H2, and H3 in HTML.

    st.title("Main Title")
st.header("Section")
st.subheader("Subsection")

  • The Swiss Army knife command: st.write(): You can pass it text, Markdown, variables, DataFrames, and even Matplotlib charts. It renders almost everything!

    st.write("Normal text")
st.write("**Bold** and *italic*")
st.write({"a": 1, "b": 2}) # Renders as a JSON dictionary

  • Specific formats:

    st.text("Plain text with no formatting.")
st.markdown("**Supports** advanced `Markdown` syntax.")
st.caption("Small gray text, ideal for footnotes.")
st.code("print('Hello, world!')", language="python")
st.divider() # Draws a horizontal separator line

Simple Inputs: Listening to the User

Streamlit widgets collect user interaction and, when assigned to a variable, trigger the scripting flow:

  • st.button(): Returns True only on the run immediately after the click. On the next redraw of the app, it goes back to False.

    if st.button("Click here"):
st.write("Button pressed!")

  • Text inputs and checkbox:

    active = st.checkbox("Enable advanced option")
text = st.text_input("Enter your name", placeholder="Ana")

  • Numeric inputs and sliders:

    age = st.number_input("Age", min_value=0, max_value=120, value=25)
range_val = st.slider("Temperature Range", min_value=0, max_value=100, value=(20, 80))

Visual Feedback and Media

Status messages: Notify your users visually.

st.success("Operation successful")
st.error("Something went wrong")
st.warning("Be careful with this")
st.info("For your information")

Fun moments and waiting:

st.balloons()  # celebration animation
with st.spinner("Processing..."):
 # Heavy code here
 st.write("Done!")

Images and Videos:

st.image("https://myapp.com/image.png", caption="Cool photo")
st.video("demo_video.mp4")

Conclusion and Next Step

In this first module, you’ve learned the fundamentals. You can already build applications with inputs, outputs, and a solid grasp of what the Scripting Flow means.

Your challenge? Try adding a few text fields and buttons to your code and watch how the browser responds in real time.

In Module 2, we’ll take our application a step further by learning to use the Sidebar, load large DataFrames, and set up real multi-page navigation menus. Don’t miss it!