config | ||
scripts | ||
static | ||
templates | ||
.dockerignore | ||
.gitignore | ||
app.py | ||
Dockerfile | ||
flask_start.sh | ||
gunicorn_config.py | ||
LICENSE | ||
README.md | ||
requirements.txt |
tiny_personal_website
This is a Python based CMS (content management system) for a small personal website aimed at first and foremost being a resume.
I originally wrote this 7 or 8 years ago, and recently absolutely borked my newer website, resulting in me quickly resurrecting this thing in about a day and a half. This one does the same thing, but better, and faster, with less js.
Feel free to take anything you need :) But keep it open source. You gotta. No, like you literally have to.
Under the Hood
-
Bootstrap v5 - frontend js/css
-
Flask - backend routing
-
Gunicorn - serving website
-
YAML - config file
-
The Open Source Community <3 - answers to all your questions for free
Dev and Testing
-
Clone this github repo into your desired webroot.
-
Install missing libraries if any:
pip3.10 install -r requirements.txt
-
You can configure everything (e.g. website title, your photo, quote, etc) by renaming
config/config.yaml.sample
toconfig.yaml
and replacing all the sample data with your own real data. -
All changes to HTML, CSS, and Python, or your core YAML will require a restart of gunicorn or a rebuild of the docker container.
-
for docker, you can just do:
docker build . -t <name of tag you want> # to test locally, you can do -p 8000:8080 to forward # port 8080 on the container to port 8000 on your local machine docker run --rm -p 8000:8080 <name of the tag you used>
For testing locally, without a docker rebuild:
gunicorn app:app
Then you can go to http://127.0.0.1:8000 in a browser to view your changes.
Deploying on an app platform
You want the following command plugged into where-ever this runs (e.g. digital ocean app platform):
gunicorn --worker-tmp-dir /dev/shm app:app
And the container port of note is port 8080.
Frontend Dev Notes
I found this guide
on vertically centering items and it helped a lot. Basically both the body and
base container you have need to be h-100 and vh-100 and for extra security,
add min-height: 100vh;
to the CSS for the body.