Chainlit fundamentals

Chainlit is a framework for building chat UIs for LLM applications. It uses Python decorators to handle chat events like session start and incoming messages.

Chainlit architecture flow

How a user message travels from the Chainlit UI through the backend to LangGraph and back as a streamed response.

app.py
python
import chainlit as cl

@cl.on_chat_start
async def start():
    """Called when a new chat session starts"""
    await cl.Message(
        content="Welcome to the Text2SQL Assistant! "
                "Ask me questions about the e-commerce data."
    ).send()

@cl.on_message
async def main(message: cl.Message):
    """Called when user sends a message"""
    user_question = message.content
    # Process the question...

@cl.on_chat_end
async def end():
    """Called when chat session ends"""
    await cl.Message(content="Goodbye!").send()

The three main Chainlit decorators for handling chat lifecycle.

Because LLM API calls are slow (often 1-5 seconds). If handlers were synchronous, the server would freeze while waiting for the AI to respond, blocking all other users. Async lets it serve many users at once by switching between tasks during those wait times.

Flashcards: Flashcards

Loading practice…

Quiz: Quiz

Loading practice…

You know the Chainlit basics: decorators for lifecycle events and async handlers. Next, we will integrate the full agent workflow into the chat interface with real-time step display.