Wednesday, July 6, 2016

Making an HTML Website with Flask

It's very simple to make a (simple) HTML-based website using Flask to deliver webpages -- that is precisely what I did with my new site mckinleymath.com. Here's a quick guide.

You should have an HTML file before starting, but if you don't, make one using a text editor of your choice and use online resources such as w3schools or HTML Dog to write one. Call this whatever you want - the example uses index.html. If you want a mobile version, make a separate file for that - I called it mobile.html. Then find a web server that can run python files (such as Digital Ocean for $5+ per month, which is what I use). In that server, you can make a file called routes.py like this (vim on DigitalOcean is built in):
from flask import Flask, request, render_template, Blueprint
app = Flask(__name__)
app.config['BASIC_AUTH_FORCE'] = True
@app.route('/')
def site():
return render_template('index.html')##change 'index.html' as necessary
##This is if you have a mobile site
@app.route("/mobile")
def mobile():
return render_template('mobile.html') ##change 'mobile.html' as necessary
if __name__ == "__main__":
app.run(host="0.0.0.0" , port=80)

Use screen to start a new terminal session that persists after you logout. In that session, run python routes.py. Then press Ctrl and A and D simultaneously to exit the session (leaving it running). You can logout at this point using exit.

Then do this on your DNS settings page. Most providers include a "subdomain forward" option, so forward it to your servers IP address. If you have a mobile site, you can subdomain forward that in a similar way -- do m.website.com -> website.com/mobile. Then do this in resource records to enable users being able to use the site without index.html or mobile.html being part of the URL:

Name: www
Type: cname
TTL: 1h
Data: website.com.

That's it. Save your changes and wait a minute or two for the records to update and it should be functional.

No comments:

Post a Comment