Introduction | Installation |
Packages | Start my app |
How to run | How to add templates |
How to add static files | How to setup with SQLite3 |
Front-end Suggestions |
Flask
for me is a type of python package, which is a good alternative forDjango
. This package looks like Laravel but easier to use and to setup.
Please read the Installation first, before you proceed.
- Virtual Environment
pip install virtualenv
- Flask
pip install flask
- Flask CORS
pip install flask-cors
There are primary things which are very required to do, you need to have
virtual environment
before you have these packages. Then you also need to initiate and activate the virtualenv first, before you install flask. To start executepip install virtualenv
thenvirtualenv venv
. Next is you need to activate by executing.\venv\Script\activate
for windows. And lastly, you need to install it thrupip install flask
First thing you need to know, is to build a simple webpage here, but first, you need to create a Folder just same as the directory shown below.
+ Flask Project
+- ProjectBase
+- venv
The `ProjectBase is the app name i'm using. meaning to say, this is the folder where I add all my resources inside of my flask project. next is you need to create a file inside of your folder, example is main.py.
+ Flask Project
+- ProjectBase
+- main.py
+- venv
Inside of your file add this simple code
from flask import Flask
app = Flask(__name__)
@app.route("/")
def index():
return "<h1>Hello</h1>"
In this format, you'll see a html code, inside of your python which can be seen as like as the webpage.
So basically, you need to execute to your terminal like this:
flask --app ProjectBase/main run
Where ProjectBase is our folder and main is our index or file name or the main program. if you want to debug your program kinfly execute this code:
flask --app ProjectBase/main --debug run
So basically, we need to create a folder called
templates
aligned with our main.py or the main python file.
+ Flask Project
+- ProjectBase
+- main.py
+- templates
+- index.html
+- venv
To use it, we need ot use the
render_template
from flask package. We will going to return a function with a render template, so that we may call thehtml
inside of template.
from flask import Flask, render_template
app = Flask(__name__)
@app.route("/")
def index():
return render_templates("index.html")
We all know that use of static files, is to store some external files such as images, styles and scripts to our project. To start, we need to create a static folder aligned with
main.py
andtemplates
.
+ Flask Project
+- ProjectBase
+- main.py
+- static
+- img
+- sample.jpg
+- styles.css
+- script.js
+- templates
+- index.html
+- venv
The tree above, is just an illustration for you to understand more about this, This may help you to uniform and make your workplace better. To call this, just simply setup
static_url_path="/static"
inside of the Flask and do like this sample in your html code:
main.py
from flask import Flask, render_template
app = Flask(__name__, static_url_path="/static")
@app.route("/")
def index():
return render_template("index.html")
Styles
<!DOCTYPE html>
<html>
<head>
<link href="/static/styles.css">
</head>
</html>
Script
<!DOCTYPE html>
<html>
<script src="/static/styles.css"></script>
</html>
Images
<!DOCTYPE html>
<html>
<body>
<img src="/static/img/sample.jpg">
</body>
</html>
Since SQLite is a default in python 2.x or auto installed, you don't need to install it manually. So first, you need to connect to your sqlite database file and create a table like this code:
import sqlite3
con = sqlite3.connect("db.sqlite", check_same_thread=False) # To connect, check same thread is used for you to delete some files
cur = con.cursor() # I forgot the use, but maybe the conenction between sqlite connection and your query
cur.execute("""CREATE TABLE IF NOT EXISTS users (
'ID' INTEGER PRIMARY KEY NOT NULL,
'usn' TEXT,
'pass' TEXT
)""") # Execution
con.commit() # This is to save as file
With the help of these code, with comments, you can see now the use of different functions as basics. The
.execute()
is a useful function, for you to communicate with your SQLite file. For more details about SQL Queries Basics kindly follow ths link.
Since I'm not yet good enough inn doing front end development skills, I still would like to share some of my resources. If you want to look for some color palletes, kindly go to Coolors.co and use Figma to create some templates and to visualized your front end design.