[다시, 장고]Muklog - 먹기록 프로젝트

Adela·2020년 7월 7일
0

다시, 장고

목록 보기
2/6
post-thumbnail

오늘 진행한 것들

  • 먹기록 작성하기
  • 먹기록 작성 내역 보여주기
  • 먹기록 저장하기

오늘 내가 구현한 기능들을 구현한 순서대로 정리해보고자 한다.

모델 만들기

먹기록 저장을 위해 모델을 만들어 준다.

from django.db import models

class Blog(models.Model):
   title = models.CharFields(max_length=200)
   pub_date = models.DateTimeField('date published')
   body = models.TextField()
   
   def __str__(self):
      return self.title
      
   def summary(self):
      return self.body[:100]

먹기록에 기록될 제목, 날짜, 본문에 대한 모델을 만들어주었다.

  • 제목은 최대 200글자만큼 쓸 수 있도록 지정했다.
  • 날짜는 퍼블리시하는 당시의 시간으로 지정했다.
  • 본문은 별거없다. 그냥 텍스트필드로 했다.
  • __str__은 모델 클래스 객체의 문자열 표현을 리턴한다. admin페이지에 가면 내가 저장한 글들의 title이 객체의 이름으로 보여진다.
  • summary는 먹기록 내역에서 본문을 100글자만큼만 잘라 보여주게 했다.

뷰 만들기

먹기록을 진행시키기 위해 뷰를 만든다.

0. 뷰 작성할 때 필요한 것들을 import해주어야 한다.

from django.shortcuts import render
from .models import Blog 
# 위에서 만든 Blog 모델 가져오기

1. 먹기록 작성 페이지

def write(request):
   return render(request, 'write.html')

작성할 페이지를 render한다.

2. 임시 홈

※ 현재 같이 진행중인 친구의 것과 겹치지 않도록 임시 홈을 만들었다.
임시 홈에서 저장된 먹기록 내역을 보여줄 것이다.

def tempHome(request):
   blogs = Blog.objects.all()
   # Blog에 저장한 데이터들을 모두 불러온다.
   return render(request, 'tempHome.html', {'blogs': blogs})

3. 먹기록 저장해주는 뷰

def create(request):
   blog = Blog()
   blog.title = request.GET['title']
   # html 페이지에서 'title'로 받은 데이터를 blog의 title로 받는다. 
   blog.body = request.GET['body']
   blog.pub_date = timezone.datetime.now()
   blog.save()
   # 작성한 내용을 블로그에 저장 ㄴㄱ~
   return redirect("blog/" + str(blog.id)
   # 작성한 기록의 상세페이지로 redirect

어? redirect는 import를 안해줬는데? 글구 timezone도 import 안해줬다.
그래서 이때 해준다.

from django.shortcuts import render, redirect
from .models import Blog
from django.utils import timezone

4. 먹기록 상세페이지

def detail(request, blog_id):
# 보고자 하는 먹기록의 pk를 불러옴 
   blog_detail = get_object_or_404(Blog, pk=blog_id)
   # 해당 객체를 불러오던지 404를 불러오던지 해라 !
   return render(request, 'detail.html', {'detail': blog_detail})

작성한 먹기록들은 Blog 모델에 각자 pk를 갖고 저장된다. 따라서, 보고싶은 먹기록이 있으면 그와 일치하는 pk를 불러와야 한다.

url 만들기

먹기록을 불러오고 저장하고 기타 등등 진행시키는데 필요한 url 주소를 연결해준다.

from django.urls import path
from . import views as blog

urlpatterns = [
    path('write', blog.write, name="write"),
    path('blog/<int:blog_id>', blog.detail, name="detail"),
    path('create', blog.create, name="create"),
    path('tempHome', blog.tempHome, name="tempHome"),
]

view를 import해온 후 blog라는 이름으로 사용하겠다고 지정하였다.
그런 후, 뷰에서 작성한 함수들에 대응하는 url 주소를 만들어주었다.
name은 html 페이지에서 url 주소를 불러올 때 사용된다. 따라서 (아무 이름을 붙여도 좋으나) 본인이 쉽게 알 수 있는 이름으로 정하는 것이 좋다.

html 페이지 만들기

작성, 임시 홈, 상세페이지에 해당하는 html 페이지를 만들어 준다.

사진처럼 templates이라는 폴더를 app안에 만들어 그 안에 html 파일들을 저장하였다.

1. write.html

<div>
    <form action="{% url 'create' %}">
      <!-- 아까 url에서 name으로 지정했던 create가 바로 이렇게 사용된다. -->
        <h4>title: </h4>
        <input type="text" name="title">
        <br>
        <br>
        <h4>body: </h4>
        <textarea cols="40" rows="10" name="body"></textarea>
        <br>
        <br>
        <input type="submit" value="submit">
    </form>
</div>

<input> 안에 있는 name='title'은 뷰에서 request.GET['title']로 들어온다.
그리고 submit을 하면 {% url 'create' %}을 불러 create 뷰가 실행되고, 이에 따라 Blog 모델에 나의 먹기록이 저장되게 되는 것이다.

뷰에서 먹기록 저장후 저장이 완료되면 상세페이지를 redirect 해주기로 했다.
따라서 redirect될 상세페이지를 구현했다.

2. detail.html

<h1>{{ detail.title }}</h1>
<p> {{ detail.pub_date }} </p>
<p> {{ detail.body }} </p>
<a href="{% url 'tempHome' %}">임시홈으로 돌아가기</a>

detail 뷰를 어떻게 작성했는지 다시 보면,

def detail(request, blog_id):
   blog_detail = get_object_or_404(Blog, pk=blog_id)
   return render(request, 'detail.html', {'detail': blog_detail})

이렇게 pk로 불러온 먹기록 객체 blog_detail'detail'이라는 이름으로 사용하겠다고 해주었다.
따라서 html페이지에 있는 detail.title은 해당 먹기록 객체의 제목을 불러오는 역할을 하는 것이다.
불러오고 싶은 것들을 위와 같은 방식으로 불러온다.

2. tempHome.html

먹기록의 내역을 보여주는 곳이다.

{% for blog in blogs %}

<h1>{{ blog.title }}</h1>
<p>{{ blog.summary }}</p>
<a href="{% url 'detail' blog.id %}">더보기</a>
<hr>

{% endfor %}

저장된 먹기록을 모두 보여줄 것이기 때문에, Blog에 저장된 모든 객체를 처음부터 끝까지 가져와야 할 것이다.
tempHome 뷰를 어떻게 작성했는지 다시 보면,

def tempHome(request):
   blogs = Blog.objects.all()
   return render(request, 'tempHome.html', {'blogs': blogs})

Blog의 모든 객체를 'blogs' 라는 이름으로 사용하겠다고 했다.
이들을 모두 보여줄 것이니 -> for문을 사용해서 반복시켜 저장된 모든 객체를 보여주도록 한다.
※ 반복문이 끝나면 반드시 {% endfor %}를 해주어야 한다.
먹기록 내역은 (아직 임시지만) 제목과 본문의 summary를 보여주도록 했다.

오늘은 여기까지 진행했다.

profile
개발 공부하는 심리학도

0개의 댓글