Djangoのrequest.sessionを使ったシンプルなカウンターアプリの作成方法

この記事では、ボタンをクリックするたびに数値が1ずつ加算されていく、とてもシンプルなカウンターアプリの作り方を紹介します。カウントの値はセッション（session）に保存されるため、ブラウザのタブを閉じてもデータは保持され続けます。セッションの基本的な使い方と、セッションを介したデータの受け渡し方法を理解できる内容となっています。

実装例

1. urls.py の設定

まず、urls.py に以下のコードを追加します。

from django.urls import path
from django.urls.resolvers import URLPattern
from . import views

urlpatterns = [
    path('', views.counterView, name='counter'),
]

ここでは、ホームURLに対して counterView を割り当てています。

2. views.py の設定

次に、views.py に以下のコードを追加します。

from django.shortcuts import render

# Create your views here.
def counterView(request):
    if request.method == "POST" and 'count' in request.POST:
        try:
            request.session['count'] += 1
        except:
            request.session['count'] = 0
    elif request.method == 'POST' and 'reset' in request.POST:
        request.session['count'] = 0
        return render(request, 'counter.html')

ここではPOSTリクエストを処理するハンドラを作成しています。フロントエンドから「count」が送信されると、セッションの count 変数の値を1増やします（初回アクセス時は例外をキャッチして0からスタート）。一方、「reset」が送信された場合は、セッションの count を0に戻します。

なお、実際に動作させる際は、関数の最後に return render(request, 'counter.html') を追加して、どの操作でもテンプレートが再描画されるようにしておくと確実です。

3. テンプレートの作成

アプリディレクトリ内に templates フォルダを作成し、その中に counter.html を作成して、以下のように記述します。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Counter</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
</head>
<body>
    <style>
        body{
            background-color: palevioletred;
        }
        .counter form .count{
            border:none;
            outline: none;
            background-color:black;
            color: white;
        }
        .counter form .reset{
            border:none;
            outline: none;
            background-color:rgb(50, 181, 204);
        }
    </style>
    <div class="container counter text-center" style="margin-top: 150px;">
        <h1 class="display-1 text-white">
            {% if request.session.count %}
            {{ request.session.count }}
            {% else %}
            0
            {% endif %}</h1> <br> <br>
        <form method="post"> {% csrf_token %}
            <button name="count" class="count px-5 py-3 text-white shadow-lg">Count</button>
        </form>
        <br> <br>
        <form method="post"> {% csrf_token %}
            <button name="reset" class="reset px-5 py-3 text-white shadow-lg">Reset</button>
        </form>
    </div>
</body>
</html>

これがホームURLで表示されるフロントエンド部分です。Djangoテンプレート言語の {% if %} タグでセッション内のカウント値を判定して表示し、Bootstrapを使って見た目を整えています。また、CSRF対策としてフォーム内に {% csrf_token %} を配置している点にも注目してください。

実行結果

Djangoのrequest.sessionを使ったシンプルなカウンターアプリの作成方法

Count ボタンをクリックすると数値が1ずつ増加し、Reset ボタンをクリックするとカウンターが0にリセットされます。データはセッションに保存されているため、タブを閉じても（セッションが有効な間は）カウント値が保持され続けるのがポイントです。

DjangoでURL短縮アプリを作成する方法を徹底解説

DjangoモデルでPickleフィールドを作成する方法

PythonとTkinterで作る！初心者向けシンプルGUI計算機の作り方
このチュートリアルでは、Pythonの標準モジュールTkinterを使用して、シンプルなGUI計算機を作成します。TkinterはPythonに組み込まれているGUIアプリケーション開発用のモジュールで、追加インストールが不要で手軽に使えるのが魅力です。GUIアプリケーションを活用すれば、データや計算結果を視覚的にわかりやすく操作できます。それでは、シンプルなGUI計算機の作り方を見ていきましょう。作成の手順 Tkinterからすべての機能を「*」でインポートします。計算機のインターフェース（ウィンドウ）を作成します。入力フィールドに数字を入力する関数（input_number）を作
Python Tkinterで作る簡単な登録フォーム入門
Tkinterは、GUI(グラフィカルユーザーインターフェース)を開発するためのPython標準ライブラリです。Tkinterを使うことで、ウィンドウをはじめとするさまざまなUI(ユーザーインターフェース)要素を持つデスクトップアプリケーションを作成できます。推奨されているPython 3.xを使用している場合、TkinterはPythonに標準搭載されているパッケージなので、追加のインストールは一切不要です。この記事では、まずTkinterの基本的なGUIアプリケーションの作り方を解説し、その後、実際の登録フォームやローン金利計算ツールといった実用的な例まで段階的に見ていきます。シンプルなG