What is a Form?
You already know what a form looks like. Every login page, every search bar, every signup page — those are forms. In HTML, a form is how you collect information from the user.
And here is why this matters to you specifically: forms are exactly where the frontend and your Python backend connect.
The <form> tag
A form starts with the <form> tag:
<form>
<!-- inputs go here -->
</form>
On its own, <form> is just a container. The inputs inside it are what the user actually interacts with.
The connection to Python
Remember input() in Python? A form is the web version of exactly that.
| Python | HTML |
|---|---|
name = input("What is your name?") |
<input type="text" name="name"> |
| Waits for the user to type and press Enter | Waits for the user to fill in and click Submit |
| You get the value in a variable | Python gets the value from the submitted form data |
The difference is that with a form, the data travels over the network to your Python server when the user clicks Submit.
action and method
The <form> tag has two important attributes:
<form action="/submit" method="post">
action— where to send the form data. This is the URL of your Python route.method— how to send it. Usepostfor forms that send data.
You do not need to worry deeply about these yet — you will use them properly when you connect forms to Python. For now, just know they exist and what they mean.
A basic form
<form>
<input type="text" name="username">
<button type="submit">Submit</button>
</form>
A text box and a submit button. That is a form.
Challenge
Add a <form> to your portfolio.html with a text input and a submit button. Open it in the browser, type something in the box, and click Submit.
Nothing dramatic happens yet — you have no Python server to receive the data. But notice what happens to the URL bar when you click Submit. The browser is trying to send the data somewhere. That is the mechanism you will eventually plug your Python into.
← Your First Proper HTML File Next: Text Inputs and Labels →