Create a Static website on github using Python and Flask Framework.Part-1

Anup Bhande
4 min readDec 20, 2022

It has taken a while for me to start writing this blog. I thought that it would be incredible to make an article on how to create static website. I had always wanted to build my own portfolio website. This blog serves as a complete explanation of the first few bacis steps I took in learning static github website. I hope that this will help anyone who is also interested in developing their own projects online. We are going to create static website and deploy it on github handle using Python and flask framework.

The main advantage of thi static website is that we don’t need to create any hosting website and buy server to run and store our information. And need to regularly come back to maintain it. It’s absolutely free and once create it and leave it.

So now, let’s begin.

A Brief Introduction of Flask.

In order to put my ideas into context, I believe it’s essential to share some background information regarding this Github, static website and Flask. For those who have no expertise in web development with tools like Ruby on Rails or React. For those who are in no desire, position to learn a language like Javascript that is more specialised. Simply said, I want to launch a website with the least amount of coding necessary, and I also want it to be technically, functionally, and organizationally intuitive. If this describes you, this tutorial might be useful.

First things first, what is a GitHub? Simply put, a GitHub is a place to store your coding projects and to collaborate with other developers around the world.

What is staic website? A static website is designed to store and serve content over HTTP without requiring server-side processing. Static websites are made up of files such as HTML, CSS, JavaScript and images. The data these websites display is stored on a web server and served to the user when they request the webpage. But the language we are using for this static website is Python.

In the end, I choose Flask framework for this project.

What is Flask? Flask is a microframework written in Python that implements the Werkzeug WSGI library.Writing clear, simple, and modularized code came naturally to me. It only takes three lines of Python to manage URIs and routing for new web pages. Flask has built-in server development and debugging tools, integrated unit testing, and Jinja2 templating for nested web pages. The Flask FlatPages and Frozen Flask modules make up the ideal set of tools for creating static websites. By creating a “build” file that turns your dynamic Flask code into a sequence of static files, Frozen Flask “freezes” a Flask-based application and enables hosting of your code without the need for server-side software. As an alternative to using a conventional relational database. Writing and pushing blog content is as easy as creating a new Markdown file in the chosen directory since Flask Flat Pages allows you to generate content from standard text files rather than from a traditional relational database.

Basic Setup.

I advise making a virtual environment, whether it be with the “virtualenv” module or an Anaconda environment, to keep all of your modules and dependencies in order. You should enter something similar to this in your Terminal, presuming you’re using Anaconda. The first line of code refer folder creation, that will hold the python, Flask code for your website. Next 2nd line is entering into folder. The last three lines configure the virtual environment and install the required software since it speeds up the set up process.

$ mkdir flask_blog
$ cd flask_blog
$ touch server.py
$ conda create — name myenv
$ source activate myenv
$ pip install Flask Frozen-Flask Flask-FlatPages

Pip will most likely install some extra dependencies that Flask comes with, but those are the bare necessities. Now, within the server.py file, you’ll want to enter the following code.

import sys, os
from flask import Flask
app = Flask(__name__)# URL Routing — Home Page

@app.route(“/”)
def index():
return “Hello World!”

# Main Function, Runs at http://0.0.0.0:8000
if __name__ == “__main__”:
app.run(port=8000)```

You should see output similar to the following, if you return to Terminal and run the above command. You should notice output beginning to appear. If you direct your web browser at the specified URL. It should just be a white screen with the words “Hello World!” in the top left corner for the webpage itself.

$ python server.py
* Running on http://127.0.0.1:8000/ (Press CTRL+C to quit)
127.0.0.1 - - [05/Jan/2019 17:48:24] "GET / HTTP/1.1" 200 -```

Remember that you may now begin building new routes using the same approach as before. For instance, I would simply add the following block of code to the code to establish a new URL route at welcome leading to a webpage that says “Welcome to my webpage!” (http://127.0.0.1:8000/welcome).

@app.route(“/welcome/”)
def welcome():
return “Welcome to my webpage!”

Conclusion:

In this section, we just focus on the introduction and how to get started with portfolio website using python using flask framework to create static website. In next section we will focus on introducing more information related to topic which we are creating website but in more details and more to explore.

Hope this article was more informative to you, Thank you.

--

--