Flaskチュートリアル-Flaskでブログを作ってみる①

コードFlaskチュートリアル

はじめに

このチュートリアルではPythonの軽量WebフレームワークであるFlaskを使ってブログを制作していきます。

このチュートリアルで使用している環境

OS:macOS Catalina
エディタ:Atom
Python3.7
SQlite3

WindowsやLinuxでも基本的には同じです。
エディタはご自身の使いやすいものを選んでください。

Flaskについて

FlaskとはPython用に作られた最小限の機能を持ったWebフレームワークです。

Djangoと違い標準では最小限の機能しか搭載されていないので、大規模なWebアプリより小規模なアプリの開発に向いています。

最小限の機能しか搭載されていないため学習コストが低いことも特徴です。

今回制作するブログ

image
image

ブログに搭載する機能
・記事一覧
・ログイン/ログアウト
・記事投稿(ログインしているユーザーのみ)
・記事編集/削除(ログインしているユーザーのみ)

環境構築

Python自体のインストールは過去に書いた記事で紹介しています。

Pythonをインストールする方法
今回はPython3の環境構築の方法を紹介していきたいと思います。WindowsこちらからPython3のページに移って黄色い「Download Python~」というボタンを押すことでインストーラをダウンロードできます。※...

Flaskのインストール

pip3 install Flask

SQLAlchemyのインストール

SQLAlchemyはPythonでデータベースを扱いやすくするためのライブラリです。

pip3 install sqlalchemy

Hello World

最低限必要な環境の構築ができたのでブラウザからアクセスすると「Hello World」と表示するプログラムを組んでいきます。

ファイル構成

最低限必要なファイルを設置していきます。

下記のようなファイル構成になるように作成します。

myblog/
 |-app/
 | |-static/
 | |-templates/
 | |-app.py
 |-run.py

作成したフォルダ・ファイルについて

static

CSSファイルや画像ファイル等を保存しておけるフォルダです。

templates

HTMLで書かれたテンプレートファイルを保存しておくフォルダです。

app.py

メインのプログラムを書くファイルです。

run.py

簡易サーバを構築するためのファイルです。

プログラム

ファイルを設置できたら実際にHello Worldと表示するプログラムを書いていきます。

app.py

from flask import Flask #Flaskのインポート

app = Flask(__name__)
@app.route("/")
def index():
    return "Hello World"

if __name__ == "__main__":
    app.run(debug=True)

run.py

from app.app import app

if __name__ == "__main__":
    app.run()

サーバを立てて実際に動かしてみる

ターミナルを開いてサーバを立てます。

アプリがあるディレクトリに移動してコマンドを打つことで起動できます。

ディレクトリを移動

cd myblog

サーバを起動

python3 run.py

下のようなメッセージが表示されていればサーバが問題なく起動できています。

 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)

起動できたらブラウザでlocalhost:5000にアクセスしてみてください。

Hello Worldと表示されれば正しく動いています。

終了する場合はコントロールキーとCを同時に押せば終了できます。

imges

テンプレートを使ってみる

Flaskにはjinja2というテンプレートエンジンが搭載されているので使ってみます。

テンプレートエンジンを使うために先程読み込んだFlaskの後に「render_template」を追加します。

app.py

from flask import Flask,render_template

次に「templates」に「index.html」という名前でHTMLファイルを作成して下のように編集します。

index.html

<!DOCTYPE html>
<html lang="ja" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>BlogName</title>
  </head>
  <body>
{{message}}
  </body>
</html>

できたらapp.pyを編集してindex.htmlをテンプレートとして呼び出せるようにします。

app.py

from flask import Flask,render_template

app = Flask(__name__)
@app.route("/")
def index():
    return "Hello World"

@app.route("/template")
def template():
    return render_template("index.html",message="これはテンプレートです")

if __name__ == "__main__":
    app.run(debug=True)

保存して先程と同じように

python3 run.py

でサーバを立ち上げてブラウザから

localhost:5000/template

にアクセスしてみてください。

今度は「 これはテンプレートです 」とだけ表示されれば正しく動いています。

render_templateを使うことによってHTML内で変数やif,for文を使うことができます。

次回から実際にブログを制作していきます。

次回の記事

Flaskチュートリアル-Flaskでブログを作ってみる②
前回の記事データベースを構築するはじめに投稿やユーザー情報を保存しておくためのデータベースを構築していきます。今回制作するブログは簡易的なものなので次のような構成でテーブルを作っていきます。「BlogContent」テーブル・i...

ビスケットを送る

コメント

タイトルとURLをコピーしました