04.md

이제는 본격적으로 CRUD를 배울 예정입니다. CRUD는 대부분의 컴퓨터 소프트웨어가 가지는 기본적인 데이터 처리 기능인 Create(생성), Read(읽기), Update(갱신), Delete(삭제)를 묶어서 일컫는 말입니다.

우리가 이미 만들었더 Blog 객체들을 Read로 먼저 확인해보고, Create를 배워보겠습니다.

그 전에 GET방식과 POST방식에 대해 먼저 짚어보고 넘어갈게요.

GET vs POST

GET방식은 데이터를 얻기 위한 요청입니다. URL에 변수를 표함시켜 요청하게 되므로, 데이터가 노출되어 보안에 취약하죠. e.g. /hello/test.php?name1=value1&name2=value2

반면 POST방식은 데이터를 생성하기 위한 요청입니다. 데이터가 본문(BODY)에 포함되므로 데이터가 URL에 노출되지 않아 기본적인 보안이 가능합니다. CSRF 공격 방지가 가능합니다. CSRF 공격(Cross Site Request Forgery)은 웹 어플리케이션 취약점 중 하나로 인터넷 사용자(희생자)가 자신의 의지와는 무관하게 공격자가 의도한 행위(수정, 삭제, 등록 등)를 특정 웹사이트에 요청하게 만드는 공격입니다. CSRF 공격을 방어하기 위한 다양한 방법이 있지만 Django에서는 기본적으로 csrf token을 이용하며, POST 요청에 대해서만 csrf token을 발급하고 체크합니다.

1. Views.py

from django.shortcuts import render
from .models import Blog # Blog import 해주기

def showmain(request):
    blogs = Blog.objects.all() # blogs라는 변수에 Blog의 모든 객체들 담는다.
    return render(request, 'main/mainpage.html',{'blogs':blogs})
 

models.py의 Blog를 만드시 import 해주어야 인식할 수 있습니다.

그 후 showmain함수를 수정해줄게요. 먼저 blogs라는 변수에 Blog의 모든 객체를 담습니다. 그 다음 main앱의 mainpage.html에 blogs라는 이름(key)으로 아까 Blog의 모든 객체를 담았던 blogs(value)를 보내줍니다.

💡 render의 세 번째 인자로는 Python의 딕셔너리(dictionary) 타입의 값을 넣어줘야 합니다. 딕셔너리 타입은 {'key':value}였죠. 이 과정을 해야 mainpage.html에서 blogs를 인식할 수 있습니다.

2. mainpaige.html

{% extends 'base.html' %}
{% load static %}

{% block content %}
    <h1>2021 Dongguk Likelion 3rd session</h1>
    <a href="{% url 'first' %}">first</a>
    <a href="{% url 'second' %}">second</a>
    <img src="{% static 'images/image01.jpg' %}">

<h1>글 목록</h1>
<div>
    {% for blog in blogs %} <!-- blogs의 객체들을 blog라는 이름으로 하나씩 꺼내 반복한다. -->
    <div>
        <h3>
            {{blog.title}} <br> <!-- 그 객체 하나 blog의 속성 title을 띄워준다. -->
            {{blog.writer}}<br> <!-- 그 객체 하나 blog의 속성 writer를 띄워준다. -->
            {{blog.body}} <!-- 그 객체 하나 blog의 속성 body를 띄워준다. -->
        </h3>
    </div>
    {% endfor %}
</div>

{% endblock %}

shomain 함수에서 blogs에 Blog의 모든 객체들을 담아서 보내주었습니다. 이제 이 객체들을 for문을 통해 화면에 표시해줄게요. blogs의 여러 객체들을 하나씩 꺼내 blog라는 이름으로 담아서 반복문을 돌려줍니다.

✏️ 템플릿 태그 base.html 상속, url, include 할 때 많이 봤던 템플릿 태그 {% %}입니다. 지금까지 사용했던 템플릿 태그는 닫지 않아도 됐지만, for, if문은 반드시 닫아주어야합니다.

✏️ 템플릿 변수 html에 변수가 표시되게 하려면 템플릿 변수인 중괄호 2개 {{ }}를 사용합니다. 3주차 세션에서 템플릿 언어에는 변수, 필터, 태그, 주석 4가지가 있다고 배웠죠? 그 중 내용을 가져오는 역할을 하는 템플릿 변수입니다. 객체의 속성에 접근하려면 이전에 shell에서 ORM을 사용했던 방법처럼 .을 사용해주면 됩니다.

3. 본문 앞부분 내용만 보이게 하기

본문 내용이 너무 길면 앞부분 몇글자만 보이게 할 수 있습니다. models.py의 Blog클래스로 다시 가서 summary 함수를 추가해줍니다.

class Blog(models.Model):
    id = models.AutoField(primary_key=True)
    title = models.CharField(max_length=200)
    writer = models.CharField(max_length=100)
    pub_date = models.DateTimeField(auto_now_add=True)
    body = models.TextField()

    def __str__(self):
        return self.title

    def summary(self):
        return self.body[:20] # 객체 자기자신의 body속성의 처음(0)부터 19까지 slicing하여 리턴

✏️ Python slicing

A[start:end:step]

start: 시작 위치, end: 끝낼 위치, step: 간격(보폭) index는 0부터 시작하고, end-1까지 자릅니다. 간격은 설정해주지 않으면 1입니다.

다시 mainpage.html 내용도 수정해줍니다.

{% extends 'base.html' %}
{% load static %}

{% block content %}
    <h1>2021 Dongguk Likelion 3rd session</h1>
    <a href="{% url 'first' %}">first</a>
    <a href="{% url 'second' %}">second</a>
    <img src="{% static 'images/image01.jpg' %}">

<h1>글 목록</h1>
<div>
    {% for blog in blogs %} <!-- blogs의 객체들을 blog라는 이름으로 하나씩 꺼내 반복한다. -->
    <div>
        <h3>
            {{blog.title}} <br>
            {{blog.writer}}<br> 
            {{blog.summary} <!-- body에서 summary로 변경 -->
        </h3>
    </div>
    {% endfor %}
</div>

{% endblock %}

4. 상세 페이지 만들기

views.py

객체마다 내용을 전부 볼 수 있는 상세 페이지를 만들어 보겠습니다. basic/main/views.py

from django.shortcuts import get_object_or_404, render # import get_object_or_404 

def detail(request, id):
    blog = get_object_or_404(Blog, pk = id) # id에 해당하는 객체를 가져오고, 없다면 404 에러
    return render(request, 'detail.html', {'blog':blog}) 
    

이제는 views 에 detail 함수를 작성해볼게요. 기존에는 request만 들어오면 바로 html 파일을 넘겨주는 방식으로 가능했지만, 이번에는 몇 번째 객체인지도 결정해주어야 하므로 id 도 파라미터로 받아야 합니다. 다음으로는 id 에 해당하는 객체를 가지고 와야합니다. 기존처럼 objects 로 가져오게 되면 모든 객체를 가져오기 때문에 다른 메소드를 사용해야합니다. 바로 get_obejct_or_404 입니다. 위에서 imort를 먼저 해주고, 이 메서드는 두 개의 인자를 받게 되는데 첫번째로 어떤 클래스에서 객체를 가져올지, 두번째로 앞의 클래스의 몇번째 객체인지를 결정하게 됩니다. 그리고 몇 번째 객체인지는 pk(primary key) 를 사용하게 됩니다. pk는 각 객체를 구분해주는 키 값입니다.

urls.py

basic/basic/urls.py

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', views.showmain, name="showmain"),
    path('first/', views.first, name="first"),
    path('second/', views.second, name="second"),
    path('<str:id>', views.detail, name="detail"),
]

view를 정의해줬으니 url을 해줘야합니다. 기존의 달라진 점은 <str:id>입니다. id라는 이름을 가진 값을 str(문자열) 타입으로 주소로 보낸다는 의미입니다. 이 부분을 바로 path converter 라고 부르는데 이를 통해 여러 객체들을 다루는 계층적인 url을 자동으로 쉽고 편하게 생성할 수 있습니다. 첫번째 글의 상세 페이지와 두번째 글의 상세 페이지 url은 달라야겠죠. 또한, 하나의 템플릿으로 여러 경우의 페이지를 띄울 수 있습니다.

기존의 url은 기본적으로 str 타입으로 인식을 합니다. id값은 정수이므로 <int:id>로 해주어도 좋습니다. 우리가 views.py에서 show 함수를 호출할 때 id값을 받는다고 했었죠. 여기서 id가 바로 이 urls.py의 id입니다. 다음의 url 로 접속시 id를 views 에 detail 함수로 넘겨주게 됩니다. 그러면 detail함수는 id에 해당하는 객체를 blog라는 변수에 담고, 없다면 404에러를 띄우겠죠. 만약 <str:blog_id> 였다면 views.py에도 def detatil(request,blog_id)여야 합니다.

mainpaige.html

{% extends 'base.html' %}
{% load static %}

{% block content %}
    <h1>2021 Dongguk Likelion 3rd session</h1>
    <a href="{% url 'first' %}">first</a>
    <a href="{% url 'second' %}">second</a>
    <img src="{% static 'images/image01.jpg' %}">

<h1>글 목록</h1>
<div>
    {% for blog in blogs %}
    <div>
        <h3>
            {{blog.title}} <br>
            {{blog.writer}}<br>
            {{blog.summary}}
            <a href="{% url 'detail' blog.id %}">...자세히</a>
        </h3>
    </div>
    {% endfor %}
</div>

{% endblock %}

상세 페이지로 이동할 수 있는 버튼의 링크를 연결해줍니다. blog.id를 통해 id값을 URL 뒤에 붙여서 보내줘야 합니다. 그래야 아까 작성한 detail이라는 이름의 url에서 id를 받아 detail함수로 보내줄테고, 그래야 deatail함수가 id에 맞는 객체를 찾아 blog라는 이름에 담아 deatil.html로 보내어 띄워줄 수 있겠죠.

detail.html

basic/main/templates/main/detail.html을 만들어줍니다. 상세 페이지의 template이에요.

{% extends 'base.html' %}
{% load static %}

{% block content %}

<h1>
    {{blog.titile}}
    작성자: {{blog.writer}}
    날짜: {{blog.pub_date}}
</h1>
<p>{{blog.body}}</p>

{% endblock %}

READ 완료!