GeekHub Learn
Module
Lesson 6.22 of 7 in this module2 min read Module 6: Building Your First AI Chat App

Hello, chatbot: the 30-line MVP

This is the lesson where you become someone who has built an AI app. After today, you can never go back to "I am learning AI". You are doing AI.

Hanging your first painting on your own wall. The bar is just "exists and works". Polish comes later.

The MVP has:

  • A title and intro line
  • A chat input box
  • A chat history display
  • A function that calls OpenAI and appends the reply
  • Session state to remember history

That is it.

import streamlit as st
from openai import OpenAI
from dotenv import load_dotenv

load_dotenv()
client = OpenAI()

st.title("GeekBot: my first AI chat")

if "messages" not in st.session_state:
    st.session_state.messages = []

for msg in st.session_state.messages:
    with st.chat_message(msg["role"]):
        st.markdown(msg["content"])

if prompt := st.chat_input("Ask me anything"):
    st.session_state.messages.append({"role": "user", "content": prompt})
    with st.chat_message("user"):
        st.markdown(prompt)

    response = client.chat.completions.create(
        model="gpt-4o-mini",
        messages=st.session_state.messages,
    )
    reply = response.choices[0].message.content

    st.session_state.messages.append({"role": "assistant", "content": reply})
    with st.chat_message("assistant"):
        st.markdown(reply)

That is a working chatbot. About 30 lines.

Visualize it

Annotated screenshot: each Streamlit element labeled with the line that creates it.

Try it now

Run it. Have a 5-turn conversation. Notice the memory works because we re-send st.session_state.messages every turn.

Hands-on lab

Build the chatbot exactly as above. Commit to GitHub. Take a screenshot.

Try it now

What would happen if we forgot the if "messages" not in st.session_state: line?

Common mistakes

  • Forgetting to append the assistant reply (chatbot has no memory)
  • Calling the API without sending st.session_state.messages (no context)
  • Hardcoding the API key (we have warned you, do not)

Debugging tip

If the bot acts like every turn is the first, you forgot to append or you forgot to send full history.

Challenge

Add a "Clear chat" button that resets st.session_state.messages.

Where this shows up

  • Prototype chat assistants
  • Internal AI demos
  • Resume and portfolio projects

From the field

This 30-line app is the skeleton of most LLM demos shown at hackathons in 2026. Memorize it.

Recap

30 lines. Working chatbot. Welcome to the club.


Quick recall

3 prompts · think before you flip

Prompt 1 of 3

What does `st.session_state` do?

Quiz time

1 question · tap an answer to check it

  1. 1. The chatbot remembers context because

Finished lesson 6.2?

Mark complete to update your module progress and unlock the streak.

Loading