Django Project ToDoList - 3

Python, Django, 장고
Page content

개요

  • Django 한 그릇 뚝딱 교재의 내용에서 멀티캠퍼스 강의에 맞게 일부 수정함
  • 2019년 버전이고 현재는 2023년이기 때문에 소스코드 변경 사항이 필요할 거 같아서 글을 남김

교재 홍보

Untitled

Step 01 - 이전 내용 확인

Step 02 - model.py 작성 및 장고 서버 반영

  • ToDo에 대한 데이터를 다룰 예정이며, 다음과 같이 코드를 작성한다.
    • 파일 경로 : ToDoList > my_to_do_app > models.py
from django.db import models

# Create your models here.
class Todo(models.Model):
    content = models.CharField(max_length=255)
  • 위 코드를 실제 Django 서버에 등록해줘야 한다. 다음과 같은 명령어를 입력한다.
    • 실행 경로는 [manage.py](http://manage.py) 이 있는 곳에서 아래 코드를 실행한다.
$ ls
db.sqlite3  manage.py*  my_to_do_app/  ToDoList/

$ python manage.py makemigrations
Migrations for 'my_to_do_app':
  my_to_do_app\migrations\0001_initial.py
    - Create model Todo
  • 그런데, 아직 데이터베이스 모델과 같은 테이블이 생성된 것은 아니다. 다음 명령어를 추가한다.
$ python manage.py migrate
  Applying auth.0001_initial... OK
  Applying admin.0001_initial... OK
  Applying admin.0002_logentry_remove_auto_add... OK
  Applying admin.0003_logentry_add_action_flag_choices... OK
  Applying contenttypes.0002_remove_content_type_name... OK
  Applying auth.0002_alter_permission_name_max_length... OK
  Applying auth.0003_alter_user_email_max_length... OK
  Applying auth.0004_alter_user_username_opts... OK
  Applying auth.0005_alter_user_last_login_null... OK
  Applying auth.0006_require_contenttypes_0002... OK
  Applying auth.0007_alter_validators_add_error_messages... OK
  Applying auth.0008_alter_user_username_max_length... OK
  Applying auth.0009_alter_user_last_name_max_length... OK
  Applying auth.0010_alter_group_name_max_length... OK
  Applying auth.0011_update_proxy_permissions... OK
  Applying auth.0012_alter_user_first_name_max_length... OK
  Applying my_to_do_app.0001_initial... OK
  Applying sessions.0001_initial... OK

Step 03 - DB 확인

  • 실제 Django 프로젝트 DB에 접근해서 확인하도록 한다.
$ python manage.py dbshell
SQLite version 3.39.3 2022-09-05 11:02:23
Enter ".help" for usage hints.
sqlite>
  • 테이블을 확인하기 위해서 다음 명령어를 이용한다.
    • my_to_do_app_todo 테이블이 만들어졌음을 확인한다.
sqlite> .tables
auth_group                  django_admin_log
auth_group_permissions      django_content_type       
auth_permission             django_migrations
auth_user                   django_session
auth_user_groups            my_to_do_app_todo
auth_user_user_permissions
  • 테이블이 가진 정보를 확인한다.
sqlite> PRAGMA table_info(my_to_do_app_todo);
0|id|INTEGER|1||1
1|content|varchar(255)|1||0
  • SELECT 명령어를 통해 데이터가 있는지 확인해본다.
    • 아무런 데이터가 없기 때문에 조회는 되지 않는다.
sqlite> SELECT * FROM my_to_do_app_todo;

Step 04 - HTML 코드 해석

  • index.html 파일을 연다.
  • 44번째 줄의 form 태그를 살펴본다.

Untitled

  • Django에서 POST 방식 사용 시, {% csrf_token %} 을 적어 주어야 한다.
  • action은 서버로 데이터를 전달할 시, 어떤 URL로 전달할 것인지를 나타낸다.
    • action에 다음과 같이 작성한다.
<form action="./createTodo/" method="POST">{% csrf_token %}
  • 위 코드는 아래 이미지에서 메모하기 버튼을 클릭할 때, createTodo 라는 url로 전달되는 것을 의미한다.

Untitled

Step 05 - urls.py 설정

  • 코드의 흐름은 기본적으로 ToDoList > ToDoList > urls.py 로 처리하여 넘기는 것이다.
  • 해당 코드는 이미 21번째 라인에서 처리중인 것을 확인할 수 있다.

Untitled

  • 21번째 라인이 의미하는 것은 my_to_do_app 폴더에 있는 urls.py 로 다시 넘기는 것을 의미한다. 기존 파일에서 수정을 한다.

    • 기존
    # -*- coding:utf-8 -*-
# my_to_do_app > urls.py

from django.urls import path 
from . import views 

urlpatterns = [
    path('', views.index)
]
    • 수정
    # -*- coding:utf-8 -*-
# my_to_do_app > urls.py

from django.urls import path 
from . import views 

urlpatterns = [
    path('', views.index), 
    path('createTodo/', views.createTodo)
]

    Step 06 - views.py 설정

  • my_to_do_app의 urls.py 에서 설정한 createTodo의 views 를 처리하는 함수를 만든다. 이미 함수명을 createTodo 라고 지정했다.

    from django.shortcuts import render
from django.http import HttpResponse

# Create your views here.
# before
'''
def index(request):
   return HttpResponse("My_to_do_app first page")
'''

# after
def index(request):
    return render(request, "my_to_do_app/index.html")

def createTodo(request):
    user_input_str = request.POST['todoContent']
    return HttpResponse("create Todo를 할 거야! => " + user_input_str)

  • 여기에서 확인해야 하는 코드는 user_input_str = request.POST['todoContent'] 이다.

    • index.html 에서 input 태그의 name 속성의 이름이 todoContent 이다.

  • 이제 결과를 확인해본다.

Untitled