Flask Getting Started Tutorial example: Building a static blog

There are a lot of popular static blog/website generation tools, such as Jekyll, Pelican, middleman, Hyde and so on, Staticgen lists some of the most popular static website generation tools at the moment.

Our in-house tools are built by PYTHON/FLASK/MONGODB, and now we need to add the document function, the writing format is Markdown, do not want to put the document in the database, do not want to get a static blog tool to manage the document, so found the Flask-flatpages This handy Flask module. Familiar with Flask students spend a few minutes to build a simple blog, plus Bootstrap help, in less than an hour can use flask-flatpages get a smarty pants site out.

Create a development environment

First we need PIP, the simplest way to install on MAC is:
Copy the Code code as follows:

$ sudo easy_install pip
$ sudo easy_install virtualenv

If you use the Homebrew Package management tool on your MAC, you can also use brew to upgrade Python and install PIP:
Copy CodeThe code is as follows:

$ Brew Update
$ brew Install Python

Create a blog directory, build a Python standalone virtual environment and install the required Flask in this environment, Flask-flatpages module:
Copy CodeThe code is as follows:

$ mkdir Blog
$ CD Blog

$ virtualenv Flask
New python executable in Flask/bin/python
Installing Setuptools, Pip...done.

$ Flask/bin/pip Install flask
$ flask/bin/pip Install Flask-flatpages

In the blog directory we create a few new directories: Static used to store Css/js and other files, templates used to store flask to use the Jinja2 template, pages to store our static blog (Markdown format):
Copy CodeThe code is as follows:

$ mkdir-p app/static app/templates app/pages

Program

The function of the main program blog.py is to import the necessary modules, configure the required parameters of the Flask-flatpages module, create Flask applications, write several URL routing functions, and finally run the application:
Copy the Code code as follows:

$ VI app/blog.py
#!flask/bin/python
From flask import flask, render_template
From flask_flatpages import flatpages

DEBUG = True
Flatpages_auto_reload = DEBUG
Flatpages_extension = '. MD '

App = Flask (__name__)
App.config.from_object (__name__)
Flatpages = flatpages (APP)

@app. Route ('/')
def index ():
Pages = (p for p in flatpages if ' date ' in P.meta)
Return render_template (' index.html ', pages=pages)

@app. Route ('/pages/ /')
Def page (path):
page = flatpages.get_or_404 (path)
Return render_template (' page.html ', page=page)

if __name__ = = ' __main__ ':
App.run (port=8000)

Templates

Generating HTML directly in Python is tedious and not fun (that's what PHP did in the 90 's), and in modern times, we use the template engine, Flask has automatically configured the JINJA2 template, using the method Render_template () to render the template can be The Flask will find the template by default in the templates directory, we just need to create a few template files on it, here we create base.html, index.html and page.html.
Copy the Code code as follows:

$ VI app/templates/base.html




<title>vpsee.com Static Blog</title>

Vpsee.com Blog

{% block content%}
{% Endblock content%}

The code extends "base.html" means to inherit the basic "skeleton" from the base.html.
Copy CodeThe code is as follows:

$ VI app/templates/index.html
{% extends "base.html"%}

{% block content%}

List of pages

{% for page in pages%}

• 
  {{Page.title}}
  

{% Else%}

• No Post.

{% ENDFOR%}

{% Endblock content%}

Copy the Code code as follows:

$ VI app/templates/page.html
{% extends "base.html"%}

{% block content%}

{{Page.title}}

{{Page.html|safe}}
{% Endblock content%}

The Flask-flatpages module will default from the pages directory for the. MD End of the Markdown document, so we put the content of the static blog in this directory:
Copy CodeThe code is as follows:

$ VI app/pages/hello-world.md
Title:hello World
Date:2014-10-14
Tags: [General, blog]

**hello world**!

$ VI app/pages/test-flatpages.md
Title:test Flask Flatpages
Date:2014-10-15
Tags: [python, Flask]

Test [Flask-flatpages] (https://pythonhosted.org/Flask-FlatPages/)

Run

Basically done, run to see the effect of it:
Copy the Code code as follows:

$ Flask/bin/python app/blog.py
* Running on Http://127.0.0.1:8000/
* Restarting with Reloader

Static

Up to now, the above blog is running well, but there is a problem, this blog is not "static", no HTML file generated, not directly into the Nginx/apache such as the use of the Web server. So we need another Flask module Frozen-flask help.

Install Frozen-flask:
Copy the Code code as follows:

$ flask/bin/pip Install Frozen-flask

Modify the blog.py, import the Flask-frozen module, initialize the freezer, and generate static HTML using Freezer.freeze ():
Copy CodeThe code is as follows:

$ VI app/blog.py
...
From flask_flatpages import flatpages
From Flask_frozen Import Freezer
Import Sys
...
Flatpages = flatpages (APP)
Freezer = Freezer (APP)
...
if __name__ = = ' __main__ ':
If Len (SYS.ARGV) > 1 and sys.argv[1] = = "Build":
Freezer.freeze ()
Else
App.run (port=8000)

After running the blog.py build, the build directory is generated in the app directory, and the build directory is the HTML static file we want:
Copy CodeThe code is as follows:

$ Flask/bin/python app/blog.py Build

$ ls app/
blog.py Build pages static templates

A clearer directory structure is as follows:
Copy CodeThe code is as follows:

$ tree App
App
├──blog.py
├──build
│├──index.html
│└──pages
│├──hello-world
││└──index.html
│└──test-flatpages
│└──index.html
├──pages
│├──hello-world.md
│└──test-flatpages.md
├──static
└──templates
├──base.html
├──index.html
└──page.html

