Flask Server

Flask HTML server using templates (Jinja2)

Project structure

project/
├── app.py
├── templates/
│   ├── base.html
│   └── index.html
└── static/
    └── style.css

Basic Flask HTML server (`app.py`)

from flask import Flask, render_template

app = Flask(__name__)

@app.route("/")
def home():
    return render_template("index.html", title="Home")

@app.route("/users/<int:user_id>")
def user(user_id):
    return render_template(
        "index.html",
        title="User Page",
        user_id=user_id,
        name="Alice"
    )

if __name__ == "__main__":
    app.run(debug=True)

Base template (`templates/base.html`)

<!DOCTYPE html>
<html>
<head>
    <title>{{ title }}</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
    <header>
        <h1>My Flask Site</h1>
    </header>

    <main>
        {% block content %}{% endblock %}
    </main>
</body>
</html>

Page template (`templates/index.html`)

{% extends "base.html" %}

{% block content %}
  <h2>{{ title }}</h2>

  {% if user_id %}
    <p>User ID: {{ user_id }}</p>
    <p>Name: {{ name }}</p>
  {% else %}
    <p>Welcome to the homepage!</p>
  {% endif %}
{% endblock %}

5. Static CSS (`static/style.css`)

body {
  font-family: Arial, sans-serif;
  margin: 40px;
}

Main Flask template keyworks

| | render_template() | renders HTML | | {{ variable }} | insert Python values | | {% if %}, {% for %} | logic | | {% extends %} | template inheritance | | url_for('static', filename=...) | static files |

Common template patterns

Loop

<ul>
{% for user in users %}
  <li>{{ user.name }}</li>
{% endfor %}
</ul>

Conditional

{% if logged_in %}
  <p>Welcome back!</p>
{% endif %}

7. Example URLs

http://localhost:5000/
http://localhost:5000/users/7

API server

Dependencies

pip install flask

Flask API Server

Write app.py

from flask import Flask, jsonify, request

app = Flask(__name__)

@app.route("/")
def home():
    return "Flask HTTP server running"

@app.route("/health", methods=["GET"])
def health():
    return jsonify(status="ok")

@app.route("/echo", methods=["POST"])
def echo():
    data = request.json
    return jsonify(received=data)

@app.route("/users/<int:user_id>", methods=["GET"])
def get_user(user_id):
    return jsonify(id=user_id, name="Alice")

if __name__ == "__main__":
    app.run(host="0.0.0.0", port=5000, debug=True)

Run the server
```
python app.py
```

Web client

curl http://localhost:5000/
curl http://localhost:5000/health
curl -X POST http://localhost:5000/echo \
     -H "Content-Type: application/json" \
     -d '{"msg":"hello"}'
curl http://localhost:5000/users/10

Web Socket server

Dependencies

pip install flask flask-socketio eventlet

Flask WebSocket server

from flask import Flask
from flask_socketio import SocketIO, emit

app = Flask(__name__)
app.config["SECRET_KEY"] = "secret!"
socketio = SocketIO(app, cors_allowed_origins="*")

@app.route("/")
def index():
    return "Flask WebSocket server running"

@socketio.on("connect")
def handle_connect():
    print("Client connected")
    emit("server_message", {"msg": "Welcome!"})

@socketio.on("client_message")
def handle_client_message(data):
    print("Received:", data)
    emit("server_message", {"msg": "Message received"}, broadcast=True)

@socketio.on("disconnect")
def handle_disconnect():
    print("Client disconnected")

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

Simple JavaScript client

<!DOCTYPE html>
<html>
<head>
  <script src="https://cdn.socket.io/4.7.2/socket.io.min.js"></script>
</head>
<body>
  <script>
    const socket = io("http://localhost:5000");

    socket.on("connect", () => {
      console.log("Connected");
      socket.emit("client_message", { msg: "Hello server" });
    });

    socket.on("server_message", (data) => {
      console.log("Server:", data);
    });
  </script>
</body>
</html>

Flask response types

String

return "Hello"
return "<h1>Hello</h1>"

Tuple (body, status, headers)

return "Not found", 404
return "Created", 201, {"X-App": "Flask"}

`Response`

from flask import Response
return Response("Hello", status=200, mimetype="text/plain")

`jsonify()`

return jsonify(id=1, name="Alice")

`make_response()`

resp = make_response("Hello")
resp.headers["X-Test"] = "123"
return resp

`render_template()`

return render_template("index.html")

`render_template_string()`

return render_template_string("<h1>{{ name }}</h1>", name="Alice")

`abort()` (error + redirect-like flow stop)

abort(404)
abort(401, "Unauthorized")

`send_file()`

return send_file("report.pdf")

`send_from_directory()`

return send_from_directory("uploads", "image.png")

Streaming response

return Response(generator(), mimetype="text/plain")

Redirect (URL or endpoint)

Redirect to a URL

from flask import redirect

return redirect("https://example.com")

Redirect to a Flask endpoint

from flask import redirect, url_for

return redirect(url_for("home"))

Redirect with status code

return redirect("/login", code=301)  # permanent

Common codes:

Code

Description

302

default

301

permanent

303

after POST (recommended)

307

preserve method

PreviousApache HTTP Server NextNGINX HTTP Server

Last updated 5 days ago

hashtagFlask HTML server using templates (Jinja2)

hashtagProject structure

hashtagBasic Flask HTML server (app.py)

hashtagBase template (templates/base.html)

hashtagPage template (templates/index.html)

hashtag5. Static CSS (static/style.css)

hashtagMain Flask template keyworks

hashtagCommon template patterns

hashtag7. Example URLs

hashtagAPI server

hashtagDependencies

hashtagFlask API Server

hashtagWeb client

hashtagWeb Socket server

hashtagDependencies

hashtagFlask WebSocket server

hashtagSimple JavaScript client

hashtagFlask response types

hashtagString

hashtagTuple (body, status, headers)

hashtagResponse

hashtagjsonify()

hashtagmake_response()

hashtagrender_template()

hashtagrender_template_string()

hashtagabort() (error + redirect-like flow stop)

hashtagsend_file()

hashtagsend_from_directory()

hashtagStreaming response

hashtagRedirect (URL or endpoint)

Flask HTML server using templates (Jinja2)

Project structure

Basic Flask HTML server (`app.py`)

Base template (`templates/base.html`)

Page template (`templates/index.html`)

5. Static CSS (`static/style.css`)

Main Flask template keyworks

Common template patterns

7. Example URLs

API server

Dependencies

Flask API Server

Web client

Web Socket server

Dependencies

Flask WebSocket server

Simple JavaScript client

Flask response types

String

Tuple (body, status, headers)

`Response`

`jsonify()`

`make_response()`

`render_template()`

`render_template_string()`

`abort()` (error + redirect-like flow stop)

`send_file()`

`send_from_directory()`

Streaming response

Redirect (URL or endpoint)