loading...
Cover image for Flask Boilerplate - Windows95 UI Kit

Flask Boilerplate - Windows95 UI Kit

sm0ke profile image Sm0ke Updated on ・3 min read

Hello Coders,

This article presents an open-source and free Flask boilerplate coded on top of a retro UI - Windows 95 UI Kit crafted by Themesberg. I've landed accidentally on this super funny product and later, decided to generate an open-source Flask app on top. I hope you will enjoy it!. Tell me your thoughts in the comments.

In a rush? App Links: Flask App, LIVE Demo, Sources and original UI Kit

Flask Windows95 UI Kit - Open-Source boilerplate Coded in Flask.


What's in the box

The app is built on top of a super simple code-base, enhanced with authentication, SQLite database, and Flask-SqlAlchemy ORM to manipulate the USER table in an object-oriented way.


Windows 95 UI Kit

This UI Kit has been developed by Themesberg and released under the MIT license on Github - the HTML sources are available here.


Let's build the app

To build this simple Flask starter we need a terminal, GIT properly installed, and a healthy Pyhton3 env. The information to build the app is also saved in the README file (committed on Github), but I will drop here a simplified setup:

$ # Clone the sources
$ git clone https://github.com/app-generator/flask-windows-95-ui-kit.git
$ cd flask-windows-95-ui-kit
$
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv --no-site-packages env
$ source env/bin/activate
$ 
$ # Install requirements
$ pip3 install -r requirements.txt
$
$ # Set the FLASK_APP environment variable
$ (Unix/Mac) export FLASK_APP=run.py
$
$ # Run the application
$ # --host=0.0.0.0 - expose the app on all network interfaces (default 127.0.0.1)
$ # --port=5000    - specify the app port (default 5000)  
$ flask run --host=0.0.0.0 --port=5000
$
$ # Access the app in browser: http://127.0.0.1:5000/

If all goes well, we should see this super nice RETRO login page in the browser (app redirects guest users, to authenticate):

Flask Windows 95 UI Kit - Login Screen.

We can use the default credentials, test/pass, or create another user through the registration page. After login, the app unlocks two private pages: index and docs.


Index Page

Flask Windows 95 UI Kit - Index Page.


UI Navbar

Flask Windows 95 UI Kit - UI Navbar Screen.


UI Buttons

Flask Windows 95 UI Kit - UI Buttons.


That's all folks, thanks for reading!


Credits


What is Flask

Flask is a lightweight WSGI web application framework. It is designed to make getting started quick and easy, with the ability to scale up to complex applications. It began as a simple wrapper around Werkzeug and Jinja and has become one of the most popular Python web application frameworks.

Posted on by:

sm0ke profile

Sm0ke

@sm0ke

#Automation, my favorite programming language

Discussion

markdown guide
 

Hopefully if they haven't already they'll offer a full-gamut color picker in which most of the "colors" are dithered together from the 16 original MS-DOS colors.

 
 

Great to see the retro UI Kit integrated in a working back-end. Awesome job guys! 🤩

 

Thanks :) - The UI kit is super creative, deserves some credit.

 
 

I found this windows 98 css kit today.

Will be good with my windows 98 themed xubuntu testing vm :)

xubuntu VM screenshot

 

W98 was a beast! 10x!