こんにちは!Masaです。
今回はDjangoで家計簿アプリの作成の続きを行っていきたいと思います。
前回の記事↓
- Django初心者で簡単なWebアプリケーション作成を考えている人
- Djangoの学び直しをしている人
- Djangoの基礎を身に付けたい人
前回のおさらい
前回の記事では、Djangoの環境構築、初期設定、モデルの作成を行いました。
from django.db import models
from django.utils import timezone
#収入のモデル
class Income(models.Model):
date = models.DatTimeeField(default=timezone.now) #日付
kind = models.CharField(max_length=20) #収入の種類
account = models.CharField(max_length=30) #入金口座
amount = models.IntegerField() #金額
memo = models.TextField(null=True, max_length=100) #メモ
def __str__(self):
return self.type + self.amount
#支出のモデル
class Expense(models.Model):
date = models.DateField(default=timezone.now) #日付
kind = models.CharField(max_length=20) #支出の種類
account = models.CharField(max_length=30) #出所
amount = models.IntegerField() #金額
memo = models.TextField(null=True, max_length=100) #メモ
def __str__(self):
return self.type + self.amount
#口座のモデル
class Account(models.Model):
name = models.CharField(max_length=20) #口座名
amount = models.IntegerField() #口座残高
def __str__(self):
return self.name
#資産推移のモデル
class Assets(models.Model):
date = models.DatTimeeField(default=timezone.now) #日付
amount = models.IntegerField() #資産総額
def __str__(self):
return self.date + self.amount
今回はビューの作成、フォームの作成を行いたいと思います!
ビューの作成
views.pyに以下のコードを作成します。
from django.shortcuts import render
from django.views import View
from .models import Income, Expense, Account, Assets
#トップページ
class IndexView(View):
def get(self, request):
#データをインスタンスに格納
income = Income.objects.all()
expense = Expense.objects.all()
params = {
'income': income,
'expense': expense,
}
return render(request, 'money_diary/index.html', params)
簡単な解説をすると、
- 4行目:各モデルを読み込み
- 7行目:IndexViewというビューのクラスを作成
- 8行目:IndexView内にgetというメソッドを作成(getリクエスト時作動)
- 11,12行目:各モデルのデータをそれぞれのインスタンスに格納
- 14行目:各インスタンスをparamsに格納
- 18行目:テンプレートファイルにparamsを渡す
という感じになります。
次にテンプレートを作成します。
アプリケーションディレクトリ” money_diary”等と同じ階層に”templates”というフォルダを作成してください。
次に”templates”の下に”money_diary”というフォルダを作成し、その中にindex.htmlというファイルを作成しましょう。
以下のような階層になるかと思います。
次にテンプレートの位置を指定しましょう。
settings.pyに追加をします。
#14行目付近に以下1行追加
import os
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')], #追加
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
また、settings.pyに以下を追加します。
これはアプリケーションの追加で、”money_diary”を追加するという意味になります。
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'money_diary' #追加
]
最後にURLを設定しましょう。
プロジェクトフォルダにあるurls.pyを開き、以下のコードを追加して下さい。
from django.contrib import admin
from django.urls import path, include #追加
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('money_diary.urls')) #追加
]
次にアプリケーションフォルダ”money_diary”にurls.pyを作成し、以下のコードを追加しましょう。
from django.urls import path
from . import views
urlpatterns = [
path('', views.IndexView.as_view(), name='index'),
最後に開発用サーバを起動し、URLをブラウザに入力しましょう。
開発用サーバの起動は以下のコマンドで行います。
python manage.py runserver
真っ白な画面が出てくれば成功です!
フォームの作成
次に収入・支出を入力するフォームを作成しましょう。
“money_diary“の下に、”forms.py”というファイルを作成してください。
このファイルに以下のコードを記述します。
from django import forms
from .models import(
Income,
Expense,
)
#収入入力のフォーム
class IncomeForm(forms.ModelForm):
class Meta:
model = Income
fields = '__all__'
#支出入力のフォーム
class ExpenseForm(forms.ModelForm):
class Meta:
model = Expense
fields = '__all__'
基本的にModelFormの使い方は以下のようにします。
class フォーム名(forms.ModelForm):
class Meta:
model = モデル名
fields = '__all__' #または使用するfieldsを指定する場合は('date', 'kind')とします。
簡単なフォーム作成は以上になります。
まとめ
本日は以上になります。
ビューの作成、フォームの作成と骨組みになる部分ですが、Djangoにおいては基本的な部分しか使っていないのでしっかりマスターしてください👍
次回はWeb表示やWebから収入・支出を登録できるように作成していきたいと思います
最後まで読んでいただきありがとうございます。
自己学習に役立てていただけたら嬉しく思います
またSNSやブログでシェアしていただくことや、誤植などをコメントで指摘いただけたら幸いです。
次回の記事↓
コメント