How to Build a Web App using Flask and SQLite in Python

A simple data-driven web application can be built using Flask and SQLite by combining form handling, database operations, and dynamic page rendering. The application collects user information, stores it in an SQLite database, and displays the stored records through Flask templates.

Run the following commands to install Flask:

pip install flask

Building an App Using Flask and SQLite

Prerequisites:

• Create and setup virtual environment and Flask app
• Python installed
• Basic Flask knowledge

After setting up the virtual environment and flask app, we can start building the application.

File Structure

This is how the file structure of our app will look like after completion.

index.html

The index.html file will contain two buttons, one button to check all the participant's lists (taken from the database). And the other button to create a new entry. 

join.html

Create join.html file in the templates folder, it will contain a form to collect Name, Email, City, Country, and Phone. Use the POST method to submit the data, then insert it into the database and commit the changes.

participants.html

Use table tag and assign the heading using <th> tag. To auto increment, the table row on the new entry, use a For loop jinja template. Inside For loop add <tr> and <td> tags. 

app.py

Create a file named app.py to define the Flask application, configure the SQLite database, handle form submissions, store participant details, and retrieve records for display in the web interface.

Output: 

For route: http://127.0.0.1:5000/join

Here we are adding two new data to the database. 

For route: http://127.0.0.1:5000/participants

Explanation:

• Initialize Flask App: Creates the Flask application and defines routes for the home page, registration form, and participant list.
• Create Database Table: Connects to the SQLite database and creates the PARTICIPANTS table if it does not already exist.
• Handle Form Submission: Receives participant details from the form and stores them in the SQLite database using an SQL INSERT query.
• Retrieve Participant Data: Fetches all records from the PARTICIPANTS table using fetchall() and passes them to the template.
• Render Templates: Uses Flask's render_template() function to display HTML pages and dynamically show participant information.

Related Articles

• SQLite
• Python
• Flask