Nybble™
Your First AI Project

Lesson 12 of 14

Giving it a face

Your tool runs in a notebook, which means it runs for you. Ten lines turn it into a web page with a text box and a button, which means it runs for anyone you send a link to — and that changes what it is.

Gradio

python
!pip install gradio
python
import gradio as gr

def process(notes):
    items, error = extract_validated(notes)
    if error:
        return f"Could not extract action items: {error}"
    if not items:
        return "No action items found."
    return "\n".join(
        f"• {i['action']}  —  {i['owner']}  (due {i['due']})" for i in items
    )

demo = gr.Interface(
    fn=process,
    inputs=gr.Textbox(lines=12, label="Meeting notes", placeholder="Paste notes here…"),
    outputs=gr.Textbox(lines=12, label="Action items"),
    title="Meeting notes → action items",
    description="Paste raw notes. Owners and dates are never invented — "
                "anything not stated comes back as UNKNOWN.",
)
demo.launch()

Run it and a working web interface appears inside the notebook. gr.Interface takes a function, a description of the inputs, and a description of the outputs, and builds the page.

The whole trick is that process is an ordinary Python function. Everything you built in lessons 5 to 10 sits behind it unchanged.

python
demo.launch(share=True)

This prints a public URL that anyone can open. It is genuinely useful for showing someone your work, and there are three things to know before you use it.

It expires — a share link lasts hours, not days. It is for a demonstration, not a deployment.

Your notebook is doing the work. The link routes to your Colab runtime. Close the tab and it stops.

It is public and unauthenticated. Anyone with the URL can use it, which means anyone with the URL is spending your API credit. Add a password if you are sharing it beyond one person:

python
demo.launch(share=True, auth=("team", "a-real-password"))

That is basic protection, not security. Do not put a share link anywhere public, and do not process anything confidential through one.

Making it good enough to hand over

Three changes take this from a demo to something a colleague can use without you standing next to them.

Handle empty input. Someone will press the button with an empty box.

python
def process(notes):
    if not notes or not notes.strip():
        return "Paste some meeting notes first."
    ...

Say what is happening. A model call takes several seconds and an unresponsive page reads as broken. Gradio shows a progress indicator by default; make sure you have not disabled it, and for longer jobs report progress explicitly.

Never show a raw traceback to a user. Catch exceptions and return a sentence. The traceback goes to your log, from lesson 10; the user gets "Something went wrong — try again, and tell me if it keeps happening."

What "deployed" would actually mean

Be clear about where this sits, because the gap is the honest boundary of this course.

A share link is a demo. Gradio also hosts permanently on Hugging Face Spaces, free for small things — genuinely useful for a personal tool, and the natural next step if you want this to keep existing.

Real deployment means a server that stays up, keys held in a secrets manager rather than a notebook, authentication, monitoring, cost controls, and someone responsible when it breaks at 2am. That is a different discipline, and it is what "in production" means when people say it.

The distinction worth carrying: you have built a tool, not a service. A tool that saves you an hour a week is worth building and needs none of the above. The moment someone else depends on it, everything above becomes the actual work — which is precisely the ceiling that Build AI Tools Without Code describes from the other direction, and it is the same ceiling.

Do this today: wrap your function in the ten lines of Gradio and click the button once. Watching your own code respond in a web page is disproportionately motivating, which is a good enough reason on its own.

← Previous