top of page

How to Build & Run a Login Form using Flask + Docker

Updated: Nov 16, 2025

Objective

Students will learn


  1. How to Build & Run a Login Form using Flask + DockerCreate a simple Flask application with a login form


  2. How to Containerize the application using Docker


  3. How to Run the Docker container and access the login form in the browser


PART–1: Create the Flask Project


Step 1: Create project folder

Step 2: Create a file named app.py

Add this code:

from flask import Flask, render_template, request

app = Flask(__name__)

@app.route('/', methods=['GET', 'POST'])
def login():
    if request.method == 'POST':
        name = request.form['name']
        password = request.form['password']
        return f"Welcome {name}, your login is successful!"
    return render_template('login.html')

if __name__ == '__main__':
    app.run(host='0.0.0.0', port=5000)

Step 3: How to Create a folder named templates

Inside it, create a file login.html

templates/login.html

<!DOCTYPE html>
<html>
<head>
    <title>Student Login</title>
</head>
<body>
    <h2>Login Form</h2>
    <form method="POST">
        <label>Name:</label>
        <input type="text" name="name" required><br><br>

        <label>Password:</label>
        <input type="password" name="password" required><br><br>

        <button type="submit">Login</button>
    </form>
</body>
</html>

PART–2: How to Create Docker Setup

Step 4: Create requirements.txt

Flask

Step 5: How to Create a Dockerfile

Inside the project folder, create a new file named Dockerfile

Dockerfile

FROM python:3.10

WORKDIR /app

COPY requirements.txt .

RUN pip install -r requirements.txt

COPY . .

EXPOSE 5000

CMD ["python", "app.py"]

PART–3: How to Build & Run the Docker Container


Step 6: Build the Docker Image

Open terminal inside project folder:

docker build -t student-login-app .

Step 7: Run the Docker Container

docker run -d -p 5000:5000 student-login-app

Step 8: Test the App

Open browser and visit:

You should see the Student Login Form.

$50

Product Title

Product Details goes here with the simple product description and more information can be seen by clicking the see more button. Product Details goes here with the simple product description and more information can be seen by clicking the see more button

$50

Product Title

Product Details goes here with the simple product description and more information can be seen by clicking the see more button. Product Details goes here with the simple product description and more information can be seen by clicking the see more button.

$50

Product Title

Product Details goes here with the simple product description and more information can be seen by clicking the see more button. Product Details goes here with the simple product description and more information can be seen by clicking the see more button.

Recommended Products For This Post
 
 
 

Comments


© 2023 by newittrendzzz.com 

  • Facebook
  • Twitter
  • Instagram
bottom of page