Home > Others

Flask Introductory Tutorial Example: Build a static blog _python

Source: Internet
Author: User
Tags mkdir what php virtual environment virtualenv
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

There are a number of popular static blog/site generation tools, such as Jekyll, Pelican, Middleman, Hyde, and so on, and Staticgen lists some of the most popular static Web site generation tools available today.

Our internal tool is built by PYTHON/FLASK/MONGODB, now need to add document function, writing format is markdown, do not want to put the document in the database, also 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 of time can be used to build a simple blog, plus Bootstrap help, within an hour can use Flask-flatpages to get a presentable site out.

Creating a development environment

First we need PIP, the easiest way to install on MAC is:

Copy 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 the PIP:
Copy Code code 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 modules:
Copy Code code 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 separate directories: Static used to store files such as Css/js, templates used to store flask to use the JINJA2 template, pages used to store our static blog (markdown format):
Copy Code code 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 parameters required by the Flask-flatpages module, create flask applications, write several URL routing functions, and finally run this application:

Copy 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/<path:path>/')
Def page (path):
page = flatpages.get_or_404 (path)
Return render_template (' page.html ', page=page)

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

Mould Plate

Creating HTML directly in Python is tedious and not fun (that's what PHP did in the 90 's), in the modern world, we use the template engine, flask has automatically configured the JINJA2 template, using method Render_template () to render the template can Out. Flask will be the default in the templates directory to find templates, we just need to create a few template files on it, where we create base.html, index.html and page.html.

Copy Code code as follows:

$ VI app/templates/base.html
<!doctype html>
<meta charset= "Utf-8" >
<title>vpsee.com Static blog</title>

<body>
{% block content%}
{% Endblock content%}
</body>


In the code extends "base.html" means to inherit the basic "skeleton" from the base.html.
Copy Code code as follows:

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

{% block content%}
<ul>
{% for page in pages%}
<li>
<a href= "{{url_for (" page ", Path=page.path)}}" >{{Page.title}}</a>
</li>
{% Else%}
<li>no post.</li>
{% ENDFOR%}
</ul>
{% Endblock content%}


Copy Code code as follows:

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

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


The Flask-flatpages module will default from the pages directory to find the. MD End of the markdown document, so we put the contents of the static blog in this directory:
Copy Code code 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 Code code as follows:

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

of static

So far, the above blog is working well, but there is a problem, the blog is not "static", no HTML files generated, can not be directly placed in the Nginx/apache such a Web server. So we need the help of another flask module FROZEN-FLASK.

Install Frozen-flask:

Copy Code code as follows:

$ flask/bin/pip Install Frozen-flask

Modify blog.py, import Flask-frozen module, initialize freezer, use Freezer.freeze () to generate static HTML:
Copy Code code 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, we will generate the building directory in the app directory, which is the HTML static file we want:
Copy Code code 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 Code code 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

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

Related Keywords:
python 3 flask tutorial python flask react tutorial flask make response example flask button tutorial flask tutorial python 3 flask example github python flask example

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

What's Trending
Top 10 Tags
datastax versions naming convention zookeeper client class definition md5 microsoft sql server 2005 data structures exception handling error handling
Top 10 Keywords
microsoft download center down wordpress address url site address url wordpress address url windows installer 4 0 download 302 not found web address url definition site address url wordpress db2 integer mac os installation step by step pdf abbreviation for return

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More