2 基本部分

2.1 データベースの定義

まずデータベースのクラスを定義します。UserクラスとToukouクラスです。今回はファイルを分割し、データベースの定義をmodels.pyに記述します。

from flask_sqlalchemy import SQLAlchemy
from datetime import datetime

db = SQLAlchemy()

class User(db.Model):
    uid = db.Column(db.Integer, primary_key=True)
    uname = db.Column(db.String(255))
    upass = db.Column(db.String(255))

    toukou = db.relationship('Toukou', backref='user', lazy=True)

class Toukou(db.Model):
    tid = db.Column(db.Integer, primary_key=True)
    uid = db.Column(db.Integer, db.ForeignKey("user.uid"))
    image = db.Column(db.String(255))
    mes = db.Column(db.String(255))
    tag = db.Column(db.String(255))
    hi = db.Column(db.DateTime, default=datetime.now)

UserクラスはToukouクラスと連結できるようにrelationshipを設定します。また、Toukouではuidに外部キー（ForeignKey）を設定します。

2.2 データベース初期化

データベースを作成し、初期データを入れる部分を関数で作成します。これもファイルを分割し、init_db.pyにcreate関数を作成しテーブルを作成し、初期データを入れます。初期データはUserが２名。Toukouが３つです。

from models import db, User, Toukou

def create(app):
    with app.app_context():
        db.create_all() # テーブル作成

        # 初期データ追加
        if User.query.count() == 0:
            data = [
                User(uname="tanaka", upass="aaa"),
                User(uname="yamada", upass="bbb"),
                Toukou(uid=1, image="ringo.jpg", mes="りんごです。",tag="果物 りんご"),
                Toukou(uid=2, image="mikan.jpg", mes="みかんです。",tag="果物 みかん"),
                Toukou(uid=1, image="cat.jpg", mes="ねこです。",tag="動物 猫"),
            ]
            db.session.add_all(data)
            db.session.commit()

2.3 app.py

webアプリケーションの本体となる app.py を作成します。まずは、インポートを記述します。あらかじめ、必要となるものを全て読み込ませます。Flaskオブジェクトのappを生成します。

import os
from flask import Flask,render_template,request,redirect,session,flash
from models import db, Toukou, User
import init_db
from datetime import datetime
import uuid

app = Flask(__name__)

app.config["TEMPLATES_AUTO_RELOAD"] = True
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///photo.db'
app.secret_key = b'\x83\xc9L:\xdf\x8a\x97\xb9\xef\xc4}G\t\xed\x1b('

このときapp.secret_keyにセッションの暗号化キーを記述します。セッションはログイン情報など、ページをまたいで保持する必要があるデータです。これはブラウザに保存されますので暗号化キーで暗号化して保存します。

また、その後テーブル設定とデータベースの初期化を行います。

# テーブル設定
db.init_app(app)

# データベース初期化
init_db.create(app)

2.4 トップページ

関数 indexでindex.htmlを開くようにします。

@app.get('/')
def index():
    return render_template("index.html")

2.5 実行

Flaskの場合、通常のpython実行ではなく、コマンドラインで実行が可能です。この場合、app.run(debug=True) を書く必要がありません。

ターミナルで現在のフォルダを確認します。photoではない場合、ターミナルに以下を入力しphotoフォルダに移動します。

cd photo

ターミナルで以下を入力します。

flask run --debugger --reload

app.py を自動的に実行してくれます。

http://127.0.0.1:5000 にアクセスし、index.htmlが表示されていることを確認します。

2.6 テンプレート

index.htmlでは以下の部分しか書かれていません。

{% extends "base.html" %}
{% block title %}写真投稿サイト{% endblock %}
{% block main %}

 <h1>投稿一覧</h1>


{% endblock %}

にも関わらず、なぜ「写真投稿サイト」や「新規登録」「ログアウト」の部分が表示されるかというと、extends "base.html"のところでhtmlを継承するように指定しているからです。

このhtmlの継承を使うと、base.htmlを読み込んで、そこにある{% block 名前 %} ～{% endblock %} までのところを置き換えてくれます。

base.htmlには全ページで共通部分のhtmlが書かれています。ですから、index.html ではそのページ固有の部分のみを書いていけばいいわけです。