Flask – Adding The JS Files

# ----------------------------------
# -- Flask => Adding The JS Files --
# ----------------------------------

from flask import Flask, render_template

skills_app = Flask(__name__)

my_skills = [("Html", 80), ("CSS", 75), ("Python", 95), ("MySQL", 45), ("Go", 35)]

@skills_app.route("/")
def homepage():
  return render_template("homepage.html",
                          title="Homepage",
                          custom_css="home")

@skills_app.route("/add")
def add():
  return render_template("add.html",
                          title="Add Skill",
                          custom_css="add")

@skills_app.route("/about")
def about():
  return render_template("about.html", title="About Us")

@skills_app.route("/skills")
def skills():
  return render_template("skills.html",
                          title="My Skills",
                          page_head="My Skills",
                          description="This Is My Skills Page",
                          skills=my_skills,
                          custom_css="skills")

if __name__ == "__main__":
  skills_app.run(debug=True, port=9000)

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>{{ title }}</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}" />
    <link rel="stylesheet" href="{{ url_for('static', filename='css/master.css') }}" />
    {% if custom_css %}
    <link rel="stylesheet" href="{{ url_for('static', filename='css/' + custom_css + '.css') }}" />
    {% endif %}
    <link rel="icon" href="any_icon.png">
  </head>
  <body>
    {% block body %}
    {% endblock %}
    <script src="{{ url_for('static', filename='js/jquery-3.4.1.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/main.js') }}"></script>
  </body>
</html>

{% extends 'base.html' %}
{% block body %}
<h1 class="page-head">{{ page_head }}</h1>
<p class="page-description">{{ description }}</p>

{% for skill in skills %}
<div class="skill-box">
  <div class="skill-name">{{ skill[0] }}</div>
  <div class="skill-progress">
    <span data-width="{{ skill[1] }}%"></span>
  </div>
</div>
{% endfor %}

{% endblock %}