I began creating an extremely simple Flask application as I've done before and I'm getting a 404 error that's going completely over my head. My directory structure is as follows:
Site/
----static/
--------css/
------------css files
--------img/
------------image files
----templates/
--------contact.html
--------index.html
app.py
The problem I'm having is that there is a button within the index.html page that takes you to the contact.html page.
<nav class="main-nav">
<ul>
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#">About Me</a>
</li>
<li>
<a href="#">Resume</a>
</li>
<li>
<a href="contact.html">Contact</a>
</li>
</ul>
</nav>
This button takes you to the contact page which works exactly as it should when I'm using Live Server in VSCode. The problem is when I try to go to this page in the Flask local server. Here is app.py:
from flask import Flask, render_template
app = Flask (__name__)
app.debug = True
@app.route('/')
def index():
return render_template('index.html')
@app.route('/contact')
def contact():
return render_template('contact.html')
if __name__ == '__main__':
app.run()
I've always followed this basic syntax for routing to pages and it's always worked until now and I can't figure out why I get a 404 error. I've tried leaving a trailing space in the app.route and clearing my browsers cache in case its a redirect error and still nothing. When I open the contact page in Live Server and Flask and place them next to each other they have the exact same url just on different localhost ports. What am I missing?
Your route is named contact, but your link is to contact.html. Those names need to be identical.
Try one of these:
@app.route('/contact.html')
OR
<a href="contact">Contact</a>
As was pointed out elsewhere, the recommended usage is url_for():
<a href={{url_for('contact')}}>Contact</a>