![[장고] Blog app - 1:N 댓글 기능 구현하기](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcRXtQO%2FbtqFzuBKX7u%2Fkjm5x8501Fvl0kKUXbQfd1%2Fimg.png)
저번 Blog app에 1:N 댓글 기능을 구현하려고 한다.
1개의 post와 n개의 댓글의 관계를 의미하는 1:N 기능을 공부해보자!
1. models.py에 blog와 1:n 관계인 comment model 작성
from django.utils import timezone
#장고에서 기본으로 제공되는 timezone을 import 해줌
class Comment(models.Model):
post=models.ForeignKey(Blog, related_name='comments', on_delete=models.CASCADE)
author_name=models.CharField(max_length=20)
comment_text=models.TextField()
created_at=models.DateTimeField(default=timezone.now) #장고에서 기본으로 제공됨
# 들어갈 내용들 : 댓글 작성자, 댓글 내용, 댓글 작성 시간
def approve(self):
self.save()
def __str__(self):
return self.comment_text
2. 터미널에서 migration 해줄 것
- 하는 이유는 model(즉, database에 수정이 있는 경우)의 변경 사항이 있을 경우에 적용시켜주기 위함이다.
(newenv) luh-ui-MacBook-Pro:ch2 ruheekim$ python manage.py makemiations
(newenv) luh-ui-MacBook-Pro:ch2 ruheekim$ python manage.py migrate
3. admin.py에 comment model 추가
from django.contrib import admin
from .models import Blog, Comment #comment 추가
#같은 폴더 내에 있는 model 안에서 blog라는 객체를 가져와라
# Register your models here.
admin.site.register(Blog)
#admin site에 등록해라
admin.site.register(Comment)
4. detail 페이지에 comment 보여주기 -> detail.html 수정
{% for comment in blog.comments.all %}
<div class="comment">
<div class="date">{{ comment.created_at }}</div>
<strong>{{ comment.author_name }}</strong>
<p>{{ comment.comment_text|linebreaks }}</p>
</div>
{% empty %}
<p>No comments here yet :(</p>
{% endfor %}# 방문자가 댓글을 달 수 있게 하려면?!!
-> django form 이라는 것을 사용!
: 사용자로부터 응답을 받을 수 있는 코드가 미리 구현되어져 있는 form class를 사용!
: Modelform : modelr과 field를 지정하면 자동으로 form을 만들어준다.
5. blog 폴더 디렉토리 아래에 forms.py 만들어서 CommentForm 이라는 class 작성
- field는 댓글 작성자와 댓글의 내용을 사용할 것
from django import forms
from .models import Comment
class CommentForm(forms.ModelForm):
class Meta:
model=Comment
fields=('author_name', 'comment_text')
6. views.py에 forms.py를 연결해 줄 댓글 작성과 관련된 함수 추가
- detail page를 불러서 가져오고
- comment를 저장할 경우에 blog의 detail 페이지로 연결할 수 있도록 redirect 해줌
from .forms import CommentForm
def add_comment_to_post(request, blog_id):
blog=get_object_or_404(Blog, pk=blog_id)
if request.method == "POST":
form=CommentForm(request.POST)
if form.is_valid():
comment=form.save(commit=False)
comment.post=blog
comment.save()
return redirect('detail', blog_id)
else:
form=CommentForm()
return render(request, 'add_comment_to_post.html', {'form':form})
7. urls.py에 add_comment_to_post view를 연결해 줌
path('blog/comment/<int:blog_id>', blog.views.add_comment_to_post, name='add_comment_to_post'),
8. detail.html에 댓글달기 버튼 추가
<hr>
<a class="btn btn-default" href="{% url 'add_comment_to_post' blog.id %}">댓글달기</a>
9. form 과 html 연결 -> add_comment_to_post.html 추가 (댓글 작성창)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
{% block content %}
<h1>New comment</h1>
<form method="POST" class="post-form">{% csrf_token %}
{{ form.as_p }}
<button type="submit" class="save btn btn-default">Send</button>
</form>
{% endfor %}
</body>
</html>
'⭐️ 개발 > Web' 카테고리의 다른 글
| [장고] 장고를 통해 Blog app 생성하는 과정(3) - Detail page (0) | 2020.07.07 |
|---|---|
| [장고] 장고를 통해 Blog app 생성하는 과정(2) - View&Templates (0) | 2020.07.06 |
| [장고] 장고를 통해 Blog app 생성하는 과정(1) - Model&Admin (2) | 2020.07.06 |
| [장고]Mac OS에 장고 설치하고 가상환경 설정하기 (0) | 2020.07.05 |