How to Make a Website for Free With Python’s Flask and Google App Engine

Published in

Geek Culture

3 min readDec 29, 2021

This tutorial demonstrates how easy it is to build and deploy a website using the Python micro-framework Flask and Google App Engine.

Experience: Beginner

Requirements:

Basic knowledge of python and html.
This tutorial demonstrates how to make a live website with just python and html. If you have never used HTML, you may want to start with The Beginner’s Guide to HTML and CSS.

A python interpreter such as VSCode or Spyder.
These interpreters make it easy for you to edit your code.

A Google Cloud Account and Cloud SDK.
It’s free to create an account and you’ll receive 300 free credits when you do.

Setting up the Site

Google App Engine requires four files to deploy a Flask site. These files are: an HTML page, a Python file as the “controller”, a requirements file, and a file that tells App Engine what to do, called a .yaml file. Create a new directory for these files to live. Everything except the HTML page should be in this directory. For the HTML page, make a sub-directory called “templates”.

The HTML

For this example site we will use a very basic html page. Copy and paste the below code into a file called index.html and place it in the “templates” sub-directory.

<!doctype html>
<html lang=”en”> 
<head> 
<title>Example Flask Website</title> 
<meta charset=”utf-8"> 
<meta name=”viewport” content=”width=device-width, initial-scale=1"></head> 
<body>Hello World!</body> 
</html>

The Controller

The python file tells the website what to do. We need to create a new flask app and create a single route for our HTML file. Copy and paste the following into a file called main.py.

from flask import Flask, render_template, requestapp=Flask(__name__) @app.route(‘/’)
def root(): 
    return render_template(‘index.html’) if __name__ == ‘__main__’: 
    app.run(host=”localhost”, port=8080, debug=True)

At this point we can check to make sure everything is working by running this python file and going to http://localhost:8080/ to view our html page.

The Requirements.txt

The requirements files should list all the python packages used in your website. Since we are only using Flask, the file should be one line. Copy and paste the following into a file called requirements.txt.

Flask==2.0.2

app.yaml

The app.yaml tells app engine how to serve your application. Since this is just an example, we will keep it simple and use the bare minimum requirement. Copy and paste the following into a file called app.yaml.

runtime: python39

Deploying Your Website

Create a new project in the cloud console. Open up the Google Cloud SDK shell and set this project as your working project.

gcloud config set project [PROJECT_NAME]

Now set the current working directory to where your files are stored. Run the following command.

gcloud app deploy

Follow the guidance to finish deploying your site and view it at the free domain provided for your app engine project.

Congratulations! You’ve successfully deployed a website to Google App Engine. Stay tuned for customizing your site with CSS and Javascript!

View the full tutorial code on github here.