プログラミング

Djangoで天気アプリを作成

最終更新： 04/03/2025
1 分の読み

天気情報を表示するアプリケーションをDjangoフレームワークを使って構築する方法を説明します。この記事では、Djangoを使用して天気予報を取得し、ウェブページに表示する完全な手順を紹介します。APIから天気情報を取得し、その情報を表示するシンプルなウェブアプリケーションを作成します。

必要なツールとライブラリ

まず最初に必要なツールをインストールします。

関連記事
  1. Python: DjangoはPythonで動作するフレームワークなので、Pythonがインストールされている必要があります。
  2. Django: Djangoはウェブ開発用のフレームワークで、以下のコマンドでインストールできます。 
    bash
    pip install django
  3. requestsライブラリ: 天気データを取得するためにAPIリクエストを送るために使用します。以下のコマンドでインストールできます。 
    bash
    pip install requests

ステップ1: Djangoプロジェクトの作成

まず、Djangoプロジェクトを作成します。

bash
django-admin startproject weather_app
cd weather_app

次に、weatherという名前のアプリケーションを作成します。

bash
python manage.py startapp weather

ステップ2: OpenWeatherMap APIの設定

天気予報データを取得するために、OpenWeatherMapのAPIを使用します。OpenWeatherMapの公式サイト（https://openweathermap.org/）にアクセスし、APIキーを取得します。

APIキーを取得したら、Djangoアプリケーションに統合するために設定ファイルに追加します。

ステップ3: Django設定の変更

Djangoのsettings.pyファイルを開き、INSTALLED_APPSにweatherを追加します。

python
INSTALLED_APPS = [
    ...
    'weather',
]

次に、APIキーを格納するためにsettings.pyに以下のような設定を追加します。

python
# settings.py
import os

OPENWEATHERMAP_API_KEY = os.getenv('OPENWEATHERMAP_API_KEY')

ステップ4: 天気予報データの取得

views.pyにて、天気予報データを取得するための関数を作成します。

python
import requests
from django.shortcuts import render
from django.conf import settings

def get_weather(city_name):
    api_key = settings.OPENWEATHERMAP_API_KEY
    url = f'http://api.openweathermap.org/data/2.5/weather?q={city_name}&appid={api_key}&units=metric&lang=ja'
    response = requests.get(url)
    return response.json()

def home(request):
    city_name = 'Tokyo'  # デフォルトの都市名
    weather_data = {}

    if 'city' in request.GET:
        city_name = request.GET['city']
        weather_data = get_weather(city_name)

    return render(request, 'weather/home.html', {'weather_data': weather_data, 'city_name': city_name})

ステップ5: URLの設定

次に、urls.pyファイルを作成し、ビューをルーティングします。

python
from django.urls import path
from . import views

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

また、weather_app/urls.pyにて、weather.urlsをインクルードする必要があります。

python
from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('weather.urls')),
]

ステップ6: HTMLテンプレートの作成

templates/weather/home.htmlというファイルを作成し、天気データを表示するHTMLコードを記述します。

html
html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>天気アプリtitle>
head>
<body>
    <h1>{{ city_name }}の天気h1>

    <form method="get">
        <input type="text" name="city" placeholder="都市名を入力" value="{{ city_name }}">
        <button type="submit">検索button>
    form>

    {% if weather_data %}
        <h2>現在の天気: {{ weather_data.weather.0.description }}h2>
        <p>気温: {{ weather_data.main.temp }}°Cp>
        <p>湿度: {{ weather_data.main.humidity }}%p>
        <p>風速: {{ weather_data.wind.speed }}m/sp>
    {% else %}
        <p>天気情報は表示できませんでした。p>
    {% endif %}
body>
html>

ステップ7: サーバーを実行

すべての設定が完了したら、Djangoサーバーを実行してアプリケーションを確認します。

bash
python manage.py runserver

ブラウザを開き、http://127.0.0.1:8000/にアクセスすると、天気情報を表示するアプリケーションが確認できます。

ステップ8: その他の改善

  1. エラーハンドリング:
    APIから不正なデータが返された場合に備えて、エラーハンドリングを追加することをお勧めします。

    python
    def get_weather(city_name):
    api_key = settings.OPENWEATHERMAP_API_KEY
    url = f'http://api.openweathermap.org/data/2.5/weather?q={city_name}&appid={api_key}&units=metric&lang=ja'
    response = requests.get(url)
    if response.status_code == 200:
        return response.json()
    else:
        return None

  2. スタイルの追加:
    天気情報の表示にCSSを追加して、より魅力的なインターフェースを作成することができます。

  3. Ajaxによる動的更新:
    ページをリロードせずに天気情報を更新できるように、Ajaxを使用して動的にデータを取得することも可能です。

まとめ

この記事では、Djangoフレームワークを使用して天気予報を表示するシンプルなウェブアプリケーションを作成する方法を紹介しました。APIから天気データを取得し、その情報をウェブページに表示する基本的な流れを学びました。これにより、天気予報をリアルタイムで表示するアプリケーションを作成することができました。

最終更新： 04/03/2025
1 分の読み
Back to top button