[Django] 게시판 만들기 프로젝트 중간 보고

프로젝트/장고 웹페이지 구축

[Django] 게시판 만들기 프로젝트 중간 보고

eunjuu 2023. 9. 4. 20:35

728x90

👩🏻‍💻 현재까지 프로젝트 진행이 얼마나 되었는지 공유!

개발 왕초보인 나. . . 그래도 열심히 하나씩 완성해 나가는 중,,,٩(^ω^)و 나는 기초 스터디 부원과 심화 스터디 부원 각각이 업로드할 과제 업로드 페이지를 만드는 업무를 맡았다. 오늘은 지금까지 완성한 부분들을 공유해보려고 한다.

먼저 기초를 눌러보면, (# url path : assignments/basic/)

이런 식으로 게시판 목록, 즉 리스트가 뜬다. 간단히 설명해 보자면,

1) WRITE 버튼

→ 이 버튼을 누르면 게시물 작성 페이지로 넘어간다(계획). (html로 버튼 모양만 만들어둔 상태. . . 실제로 누르면 아직 아무 일도 발생하지 않는다.)

2) 게시판 리스트

No.	Title	Author	Created At	Views
게시물 순서	게시물 제목 → 클릭하면 게시물 상세 페이지로 넘어감	작성자	게시물 만든 시간	조회수

안에 게시물 하나는 admin 페이지에서 (# url path : admin/) 만들었다.

Title : [1주차] 과제 제출
Author : enjprk41 // (나)
Content : 룰루랄라 즐거운 아이슬리

*View count는 안 적어도 된다 (밑에 85는 내가 적은 게 아니라 내가 실제로 게시물을 85번 방문해서 그만큼 카운트 된 것)

다시 이 친구로 돌아와서, 코드와 함께 살펴보도록 하겠다.

(っ´ω`c)♡

💻 models.py

from django.db import models
from django.conf import settings

# author는 settings.py 의 User 테이블 사용, 참고로 User는 User 폴더의 models.py에 정의되어 있다.

# 기초 과제 페이지 모델
class BasicAssignment(models.Model):
    title = models.CharField(max_length=200)
    author = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
    content = models.TextField()
    created_at = models.DateTimeField(auto_now_add=True)
    view_count = models.PositiveIntegerField(default=0)

    def __str__(self):
        return self.title

# 심화 과제 페이지 모델
class AdvancedAssignment(models.Model):
    title = models.CharField(max_length=200)
    author = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
    content = models.TextField()
    created_at = models.DateTimeField(auto_now_add=True)
    view_count = models.PositiveIntegerField(default=0)

    def __str__(self):
        return self.title

Django 웹 애플리케이션에서 두 가지 모델 "기초 과제 페이지"와 "심화 과제 페이지"를 정의하는 파이썬 코드다. 각 모델은 다음과 같은 필드와 동작을 가지고 있다:

title: 최대 200자까지 허용되는 문자열 필드로, 과제 페이지의 제목을 저장
author: settings.py의 설정된 사용자 모델(settings.AUTH_USER_MODEL)과 외래 키 관계를 가지며, 과제 페이지를 작성한 사용자를 나타냄
content: 긴 텍스트 내용을 저장하기 위한 TextField
created_at: 과제 페이지의 생성 일시를 자동으로 기록하는 DateTimeField
view_count: 과제 페이지가 조회된 횟수를 저장하는 양의 정수 필드로, 기본값은 0

💻 views.py

from django.shortcuts import render, get_object_or_404
# View에 Model(Post 게시글) 가져오기
from .models import BasicAssignment, AdvancedAssignment

def BasicBlog(request):
    postlist1 = BasicAssignment.objects.all()
    return render(request, 'assignments/basiclist.html', {'postlist1': postlist1})

def AdvancedBlog(request):
    postlist2 = AdvancedAssignment.objects.all()
    return render(request, 'assignments/advancedlist.html', {'postlist2': postlist2})


# blog의 게시글(posting)을 부르는 posting 함수
# BasicPosting
def BasicPosting(request, post_id):
    # 게시글(Post) 중 pk(primary_key)를 이용해 하나의 게시글(post)를 검색
    post = get_object_or_404(BasicAssignment, id=post_id)

    # 조회 횟수 증가
    post.view_count += 1
    post.save()

    # 작성자 정보 가져오기
    author = post.author

    # 페이지를 열 때, 찾아낸 게시글(post)을 post라는 이름으로 가져옴
    return render(request, 'assignments/post.html', {'post': post, 'author': author})

# AdvancedPosting
def AdvancedPosting(request, post_id):
    # 게시글(Post) 중 pk(primary_key)를 이용해 하나의 게시글(post)를 검색
    post = get_object_or_404(AdvancedAssignment, id=post_id)

    # 조회 횟수 증가
    post.view_count += 1
    post.save()

    # 작성자 정보 가져오기
    author = post.author

    # 페이지를 열 때, 찾아낸 게시글(post)을 post라는 이름으로 가져옴
    return render(request, 'assignments/post.html', {'post': post, 'author': author})

Django 웹 애플리케이션에서 두 가지 종류의 게시글을 표시하기 위한 뷰 함수를 정의하는 파이썬 코드다.

Blog 함수들(게시판 리스트 함수)

BasicBlog 함수	AdvancedBlog 함수
- BasicAssignment 모델에서 모든 게시글을 검색하여 가져오는 뷰 함수 - `BasicAssignment.objects.all()`을 사용하여 모든 기초 과제 게시글을 가져옴 - 가져온 게시글 리스트를 'assignments/basiclist.html' 템플릿에 전달	- AdvancedAssignment 모델에서 모든 게시글을 검색하여 가져오는 뷰 함수 - `AdvancedAssignment.objects.all()`을 사용하여 모든 심화 과제 게시글을 가져옴 - 가져온 게시글 리스트를 'assignments/advancedlist.html' 템플릿에 전달

Posting 함수들(게시판 상세 페이지 함수)

BasicPosting 함수	AdvancedPosting 함수
- BasicAssignment 모델에서 특정 게시글을 가져오는 뷰 함수 - `get_object_or_404` 함수를 사용하여 해당 게시글을 가져옴 - 게시글의 조회 횟수를 증가시키고 저장한 후, 작성자 정보를 가져옴 - 'assignments/post.html' 템플릿에 게시글과 작성자 정보를 전달	- AdvancedAssignment 모델에서 특정 게시글을 가져오는 뷰 함수 - `get_object_or_404` 함수를 사용하여 해당 게시글을 가져옴 - 게시글의 조회 횟수를 증가시키고 저장한 후, 작성자 정보를 가져옴 - 'assignments/post.html' 템플릿에 게시글과 작성자 정보를 전달

이 코드는 Django 애플리케이션에서 두 가지 유형의 게시글을 표시하고 게시글을 클릭하면 상세 정보를 볼 수 있는 뷰 함수를 구현하는 데 사용된다.

💻 admin.py

from django.contrib import admin
from .models import BasicAssignment, AdvancedAssignment

# Register your models here.
# 관리자(admin)가 게시글(Post)에 접근 가능

admin.site.register(BasicAssignment)
admin.site.register(AdvancedAssignment)

💻 urls.py

from django.urls import path
from .views import BasicBlog, BasicPosting, AdvancedBlog, AdvancedPosting

urlpatterns = [
    # url path: assignments/advanced/
    path('advanced/', AdvancedBlog),
    # url path : assignments/basic/
    path('basic/', BasicBlog),
    # url path : assignments/submit/
    path('submit/', BasicBlog), #이건 아직 구축을 안 해서 그냥 임의로 BasicBlog로 연결되게 함

    # URL:80/assignments/basic/숫자로 접속하면 게시글-세부페이지(posting)
    path('basic/<int:post_id>/', BasicPosting, name="BasicPosting"),

    # URL:80/assignments/advanced/숫자로 접속하면 게시글-세부페이지(posting)
    path('advanced/<int:post_id>/', AdvancedPosting, name="AdvancedPosting"),
]

이렇게 파이썬 코드를 구성했다.

(=^･ω･^=)

이제 html을 확인해보자! 다 넣자니 너무 길어질 것 같아 위 아래 header랑 footer 이런 거 다 생략하고 그냥 주요 부분만 넣었다.

💻 basiclist.html

(# url path : assignments/basic/) 눌렀을 때 등장하는 페이지

<div class="container">
    <div class="row">
      <div class="col-lg-12">
        <div class="page-content">

          <div class="col-lg-12">
                <div class="main-button">
                  <a> WRITE </a>
                </div>
          </div>

          <div>
            <table class="table">
                <thead>
                    <tr>
                        <th style="color: white;">No.</th>
                        <th style="color: white;">Title</th>
                        <th style="color: white;">Author</th>
                        <th style="color: white;">Created At</th>
                        <th style="color: white;">Views</th>
                    </tr>
                </thead>
                <tbody>
                {% for post in postlist1 %} <!-- 기초: postlist1, 심화: postlist2-->
                <tr>
                    <td style="color: DarkSeaGreen;">{{ post.id }} </td>
                    <td style="color: DarkSeaGreen;">
                        <a href="{% url 'BasicPosting' post.id %}">{{ post.title }}</a><br>
                    </td>
                    <td style="color: DarkSeaGreen;">{{ post.author }}</td>
                    <td style="color: DarkSeaGreen;">{{ post.created_at}}</td>
                    <td style="color: DarkSeaGreen;">{{ post.view_count}}</td>
                </tr>
                {% endfor %}
                </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>

→ WRITE 버튼과 게시물 리스트를 구현했다.

*심화는 advancedlist.html로 { for post in postlist1 %} 이 부분이 { for post in postlist2 %}로 바뀐다. (위의 views.py 참고!)

지금부터는 게시물 상세 페이지와 관련해 약간의 설명을 덧붙이겠다. 게시판 리스트에서 제목 부분을 클릭하면 게시물 상세 페이지로 넘어간다.

*basiclist.html 참고 :

<td style="color: DarkSeaGreen;"> <a href="{% url 'BasicPosting' post.id %}"> {{ post.title }}</a><br> </td>

[1주차] 기초 과제 제출을 클릭해봤다.

일단, 기초 과제 상세 페이지의 url은 http://127.0.0.1:8000/assignments/basic/1/ (basic/게시물넘버) 이런 식으로 작동한다.

아까 views.py를 다시 보면,

...
# blog의 게시글(posting)을 부르는 posting 함수
# BasicPosting
def BasicPosting(request, post_id):
    # 게시글(Post) 중 pk(primary_key)를 이용해 하나의 게시글(post)를 검색
    post = get_object_or_404(BasicAssignment, id=post_id)

    # 조회 횟수 증가
    post.view_count += 1
    post.save()

    # 작성자 정보 가져오기
    author = post.author

    # 페이지를 열 때, 찾아낸 게시글(post)을 post라는 이름으로 가져옴
    return render(request, 'assignments/post.html', {'post': post, 'author': author})

# AdvancedPosting
def AdvancedPosting(request, post_id):
    # 게시글(Post) 중 pk(primary_key)를 이용해 하나의 게시글(post)를 검색
    post = get_object_or_404(AdvancedAssignment, id=post_id)

    # 조회 횟수 증가
    post.view_count += 1
    post.save()

    # 작성자 정보 가져오기
    author = post.author

    # 페이지를 열 때, 찾아낸 게시글(post)을 post라는 이름으로 가져옴
    return render(request, 'assignments/post.html', {'post': post, 'author': author})

'assignments/post.html'에 정보를 전달한 것으로 나온다. 그렇다면 마지막으로 'assignments/post.html'을 확인해보자.

  <div class="container mt-5">
    <h1>{{ post.title }}</h1>
    <div class="card mt-4">
        <div class="card-body">
            <h5 class="card-title" style="color: DarkSeaGreen;">작성자: {{ author.username }}</h5>
            <p class="card-text">{{ post.content }}</p>
            <p class="card-text"><small class="text-muted">작성일: {{ post.created_at }}</small></p>
        </div>
    </div>
  </div>

대충 이렇게 해놓은 상태다. 케챱 고백하자면,, 🥫 1학년 때 html이랑 css 배우고 몇 년 만에 쓰려니 하나도 기억이 안 나서 대충 대충 끼워넣었더니 형식이 지금 저렇게 됐다. Σ(￣□￣;) html과 css 공부를 다시 해야겠다. . .

🩷 [과제 리스트 페이지에서 앞으로 개선할 사항]

게시물을 추가하면 위에서 밑으로 (↓) 글이 추가되는 방식이라, 가장 오래된 글이 맨 위에 있고 새로운 글이 그 아래로 계속 추가된다. 그래서 이걸 역순으로 바꾸는 작업을 해야 함.
페이징 작업 : 한 페이지에 게시물이 (예를 들어) 20개가 넘으면 다음 페이지로 넘기는 페이징 작업을 할 예정.

🩵 [과제 상세 페이지에서 앞으로 개선할 사항]

게시물 작성자가 게시물 수정 및 삭제를 할 수 있는 버튼 및 기능 만들기
… 디자인

728x90

저작자표시

'프로젝트 > 장고 웹페이지 구축' 카테고리의 다른 글

[Django] 포스트 작성 페이지 구현하기 - (1) (1)	2023.09.27
[Django] 게시판 페이징 처리 - (2) (0)	2023.09.10
[Django] 게시판 페이징 처리 - (1) (0)	2023.09.06
[Django] Django의 model 클래스 & MySQL DB 이해하기 (0)	2023.08.27
[Django] Django에 MySQL DB 연결 - MacOS (0)	2023.08.23

현재글[Django] 게시판 만들기 프로젝트 중간 보고

eunjuicy’ orchard