UserDonghu's Note

NCP 서버 포트 열어서 다른 버전의 추가 Django 올리기

UserDonghu — Sun, 16 Feb 2025 11:05:17 +0900

~~상황 : 운영중인 서버에 포트를 열어서 다른 버전의 Django를 runserver로 올리고 운영중인 서버에는 영향이 없게 하고싶었다. (비추) (이렇게 하면 안됨)~~

운영중인 서버와 DB를 분리해야하기 때문에 새로운 Database를 만들어야한다.

사용중인 NCP의 Cloud DB for MySQL 서비스에는 DB root 계정이 존재하지않아서 콘솔에서 Database를 생성.

해당 DB 선택 -> DB 관리 → DB server 상세보기 → Database 생성

서버에 8080포트를 열어서 그 포트로 접속하면 다른 버전의 백엔드 API가 호출되게 하고싶으니까

NCP Server ACG 설정에서 Inbound 규칙에 허용 포트 8080 추가.

gunicorn 연결 안하고 그냥 runserver로 돌릴거기 때문에 서버 nginx 설정에서 8080 포트로 들어오면 runserver 기본 포트인 로컬:8000번으로 프록시 설정하기.

/etc/nginx/conf.d 에 추가

server {
listen 8080;
server_name 주소;
server_tokens off;

location / {
    proxy_pass         <http://127.0.0.1:8000>;
    proxy_redirect     off;
    proxy_set_header   Host $host;
    proxy_set_header   X-Real-IP $remote_addr;
    proxy_set_header   X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header   X-Forwarded-Host $server_name;
    }
    
}

systemctl restart nginx 로 재시동

runserver을 유지시켜줘야하기 때문에

screen을 사용해서 runserver --noreload

noreload : 코드 변경을 감지해도 서버 자동 재시작 안하기

ctrl + a + d 로 screen을 나와서 screen -ls 로 확인. screen -r '세션명' 으로 다시 접속가능

여기까지 하고 왜 안되지 뻘짓했었는데,

Load Balancer에서 8080포트로 오는 연결을 막아놨었다.

NCP console -> Load Balancer에서 해당 서버 8080포트로 보내는 Target Group 추가

Load Balancer 리스너 설정에서 8080 포트 추가, Target Group 에 새로 만든 8080 Target Group 추가.

Django settings.py 에 CSRF_TRUSTED_ORIGINS와 ALLOW HOST 에 URL:8080 포트추가하는거 잊지 않기.

이렇게 하면 해당 서버 8080포트로 접속을 했을때 정상적으로 다른 버전의 Django 페이지로 연결 된다.

끗

Django apscheduler SQLAlchemy Connection timed out 오류

UserDonghu — Wed, 12 Feb 2025 21:03:11 +0900

Django 서버에서 스케쥴링을 할 일이 있어서 SQLAlchemy 라이브러리를 통해 사용중인 MySQL DB에 job을 저장해서 scheduler를 사용하고있었다.

from apscheduler.schedulers.background import BackgroundScheduler
from apscheduler.jobstores.sqlalchemy import SQLAlchemyJobStore
from django.conf import settings

class SchedulerManager:
    _instance = None

    @classmethod
    def get_scheduler(cls):
        if cls._instance is None:
            db_settings = settings.DATABASES['default']
            db_url = f"mysql+pymysql://{db_settings['USER']}:{db_settings['PASSWORD']}@{db_settings['HOST']}:{db_settings['PORT']}/{db_settings['NAME']}"
            jobstores = {
                'default': SQLAlchemyJobStore(url=db_url)
            }
            cls._instance = BackgroundScheduler(jobstores=jobstores, timezone="Asia/Seoul")
            cls._instance.start()
        return cls._instance

scheduler.py 파일을 만들어서 이런식으로 Django setting파일에서 설정해둔 DB 정보를 가져와서 jobstores설정을 해줬는데, jobstores설정을 안해줬을때 서버를 끄거나 재시동하면 기존에 스케쥴링 해둔 task & job들이 모두 없어지는거에 비해서 설정을 해두면 DB에 저장을 해둬서 재시동해도 재시간이되면 동작을 하고, DB에 접속해서 쿼리문으로 앞으로 실행될 예정인 작업들도 볼수있어서 좋았다.

그런데 분명 테스트를 할때는 잘 실행되던 작업들이 밤만 되면 오류가 나서 실행이 안되는 문제가 발생했다.

처음에는 작업을 스케쥴링 해둔 함수들에 변수로 들어가는 인스턴스가 문제를 일으키는줄 알았는데, 로그 파일에 오류를 확인해보니,

sqlalchemy.exc.OperationalError: (pymysql.err.OperationalError) (2006, "MySQL server has gone away (TimeoutError(110, 'Connection timed out'))")

이런 에러가 떠있었다.

분명 MySQL에 잘 연결돼서 쿼리문으로 예정된 작업까지 확인했는데 이게 무슨 오류지..? 하고 생각했었는데 알고보니 MySQL 서버가 긴 시간동안 사용되지 않아서 연결이 끊어진것이었다.

이 경우에는 두가지를 의심해볼수있는데,

첫번째는 MySQL 설정의 my.cnf 파일에서 wait_timeout과 interactive_timeout 이 몇초로 설정되어있는지를 확인해야한다.

[mysqld]
wait_timeout = 28800
interactive_timeout = 28800

두번째는 Scheduler의 SQLAlchemy 설정에서 pool_recycle, pool_pre_ping을 수정하는것이다.

from apscheduler.schedulers.background import BackgroundScheduler
from apscheduler.jobstores.sqlalchemy import SQLAlchemyJobStore
from django.conf import settings

class SchedulerManager:
    _instance = None

    @classmethod 
    def get_scheduler(cls):
        if cls._instance is None:
            db_settings = settings.DATABASES['default']
            db_url = (
                f"mysql+pymysql://{db_settings['USER']}:{db_settings['PASSWORD']}"
                f"@{db_settings['HOST']}:{db_settings['PORT']}/{db_settings['NAME']}"
                "?charset=utf8mb4"
            )

            jobstores = {
                'default': SQLAlchemyJobStore(
                    url=db_url,
                    engine_options={
                        'pool_size': 20, # 기본적으로 유지할 DB 갯수
                        'max_overflow': 10, # pool_size를 넘어서는 요청이 왔을때 추가로 허용하는 최대 연결 갯수
                        'pool_timeout': 60, # 사용 가능한 연결이 없을때 최대 60초 대기. 이 시간 지나면 Timeout에러
                        'pool_recycle': 3600, # 오래된 연결을 재설정하는 시간(초). 1시간마다 재연결
                        'pool_pre_ping': True, # 쿼리 실행전 연결이 유효한지 검사
                    }
                )
            }

            cls._instance = BackgroundScheduler(
                jobstores=jobstores, 
                timezone="Asia/Seoul",
                job_defaults={
                    'coalesce': True, # Job이 여러 번 스킵된 경우, 마지막 한 번만 실행할지 여부
                    'max_instances': 3, # 동시에 실행할수있는 Job 갯수
                    'misfire_grace_time': 60 # Job이 실행시간보다 늦게 실행될때, 허용할 최대 지연시간. 60초 지나면 실행 안하고 건너뜀.
                }
            )
            cls._instance.start()

이렇게 여러 설정들을 추가해주면 오류없이 더 쾌적하게 Django에서 스케쥴러를 사용할수있다.

끗

Django collectstatic S3 파일 업로드 안되는 오류 (Django static파일 S3 연결하기)

UserDonghu — Mon, 30 Dec 2024 19:40:42 +0900

서버 배포를 할때 static파일들을 AWS S3에 보관을 하고싶거나 해야만 할때 (zappa로 배포) Django는 boto3와 django-storages를 사용한다.

가상환경에서 설치

pip install boto3 django-storages

S3 버킷을 생성하고 적절하게 정책 부여 후(정책은 연결하고 해도 됨) AWS키 받아서 환경변수 설정

AWS_ACCESS_KEY_ID='' # 발급받은 키
AWS_SECRET_ACCESS_KEY='' # 발급받은 키
AWS_STORAGE_BUCKET_NAME='' # 내가 만든 버킷 이름
AWS_S3_REGION_NAME='' # 버킷 지역

settings.py에 환경변수 등록해주고 STATIC 설정

AWS_S3_CUSTOM_DOMAIN = f'{AWS_STORAGE_BUCKET_NAME}.s3.amazonaws.com' # S3 커스텀 도메인 설정

STATIC_URL = f'https://{AWS_S3_CUSTOM_DOMAIN}/static/' # 정적 파일 저장될 url 설정
DEFAULT_FILE_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage' # django 프로젝트 기본 파일 저장소를 S3를 사용하겠다
STATICFILES_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage' # boto3 SDK로 정적 파일은 S3를 사용하겠다

STATIC_ROOT = BASE_DIR / 'staticfiles' # 정적 파일을 모았다가 S3로 업로드 할 위치 설정

INSTALLED_APPS = [
     ...
    'storages', # 추가
     ...
]

collectstatic으로 정적파일 업로드

python manage.py collectstatic

S3 버킷에 정적파일 제대로 업로드 됐는지 확인

이렇게 하면 S3 연결이 되어야하는데, STATIC_ROOT에 정적파일을 모으기만 하고 S3 버킷에는 계속 파일 업로드가 안되는 문제가 발생했다.

분명 다른 프로젝트에서 정상작동하는데 왜 안되는거지 하면서 온갖 쌩쑈를 다 하면서 문제점을 찾다가 발견

바로 Django 버전을 최신 버전을 사용중이었다..

Django 4.2 버전 이후로는 settings.py 쓰는 법이 달라진다

# DEFAULT_FILE_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage'
# STATICFILES_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage'
# 얘네 둘 대신에 아래 처럼 써야함

STORAGES = {
    'default': {
        'BACKEND': 'storages.backends.s3boto3.S3Boto3Storage',
    },
    'staticfiles': {
        'BACKEND': 'storages.backends.s3boto3.S3Boto3Storage',
    },
}

수정하고 다시 collectstatic

python manage.py collectstatic

하니까 귀신같이 S3 버킷에 정적파일이 정상적으로 업로드 되었다.

몇시간씩 뻘짓거리하지말고 버전관리를 더 신경쓰자 꼭..

Zappa로 AWS Lambda를 사용해서 Django 서버리스 배포하기

UserDonghu — Mon, 30 Dec 2024 19:09:30 +0900

AWS Lambda 서비스를 이용하면 로드 밸런싱, 오토 스케일링등을 크게 신경 안쓰고 쉽게 서버를 배포할 수 있다.

AWS 키 발급

export AWS_ACCESS_KEY_ID='new_access_key_id' # 현재 셀의 환경변수 설정
export AWS_SECRET_ACCESS_KEY='new_secret_access_key_id' # 현재 셀의 환경변수 설정

가상환경(venv)에서 zappa 설치

pip install zappa

zappa 초기 설정

zappa init

# zappa 환경 이름 설정 (기본 dev)

# lambda 함수와 관련된 파일들을 관리할 zappa S3 버킷 이름 설정 (기본 랜덤값, 기본 해도 상관없음)

# Django settings.py의 경로 설정 (Django에서 쓸 settings.py 경로 입력 ex)myproject.settings)

# 글로벌적 서비스를 위해 모든 사용 가능한 리전에서 배포할건지 설정 (N 추천)

만들어진 zappa_settings.json 수정.

aws_region이랑 서버에서 사용할 env key값 넣기

{
    "dev": {
        "django_settings": "myproject.settings",
        "aws_region": "ap-northeast-2", # 배포할 리전 꼭 설정
        "exclude": [
            "boto3",
            "dateutil",
            "botocore",
            "s3transfer",
            "concurrent"
        ],
        "profile_name": null,
        "project_name": "myproject",
        "runtime": "python3.12",
        "s3_bucket": "zappa-asdfasdf",
        "environment_variables": { # env key는 이렇게 넣음
            "SECRET_KEY": "",
            "AWS_ACCESS_KEY_ID": "",
            "AWS_SECRET_ACCESS_KEY": "",
            "AWS_STORAGE_BUCKET_NAME": "",
            "AWS_S3_REGION_NAME": ""
        }
    }
}

환경 변수는 settings.py에서 이런식으로 가져오면 된다

import os

AWS_ACCESS_KEY_ID = os.environ.get('AWS_ACCESS_KEY_ID')

Zappa 배포

zappa deploy dev(환경 이름)

코드 업데이트 됐을때 재배포

zappa update dev

배포 취소

zappa undeploy dev

settings.py ALLOWED_HOSTS 에 내 배포 주소 추가

ALLOWED_HOSTS = ['asdfasdf.execute-api.ap-northeast-2.amazonaws.com']

AWS IAM 키 permission error 주의. lambda 함수 권한이 있어야 함

미래에서 기다릴게, <시간을 달리는 소녀>

UserDonghu — Thu, 23 May 2024 01:15:12 +0900

First time, Last time, Every time

잠시라도 같이 있음을 기뻐하고

애처롭기까지 만한 사랑을 할 수 있음에 감사하고

주기만 하는 사랑이라 지치지 말고

더 많이 줄 수 없음을 아파하고

남과 함께 즐거워한다고 질투하지 않고

그의 기쁨이라 여겨 함께 기뻐할 줄 알고

깨끗한 사랑으로 오래 기억할 수 있는 나

"당신을 그렇게 사랑합니다."

영화 분위기가 참 좋다.

기억 조작을 하는 것 처럼 나에게도 저런 시절이 어렴풋있지 않을까 생각하게 된다.

마지막 장면에서 키스를 하지않고 포옹을 하는것조차 청춘이구나 어울린다 잘.

"멀끔한 나"의 23SS 우영미 코튼 백로고 셔츠

UserDonghu — Tue, 6 Feb 2024 22:48:25 +0900

색깔 이쁘긴해

2024년이 와버리고 반오십이 되어버린 나..

간만에 너무 이쁜 옷을 선물받아서 스타일 변화를 꾀한다

앞에는 요런 느낌 가슴에 자수가 포인트

진짜 이런 셔츠 태어나서 처음 입어봄 ㄷㄷ

나한테 잘 어울리려나 걱정이 태산

뒤에 턱 살짝 잡혀있는게 이쁜듯

우영미 옷 볼때마다 드는 생각이지만 뒤에 스퀘어탭 떨어져서 잃어버리면 어쩌지?

50사이즈가 105라는데 워낙 오버해서 그거보다 좀 더 큰듯?

요런 너낌

Django 프로젝트(3) - School Talks

UserDonghu — Wed, 3 Jan 2024 15:12:53 +0900

https://github.com/EstSoftOrmi3FinalProject

EstSoftOrmi3FinalProject

EstSoftOrmi3FinalProject has 2 repositories available. Follow their code on GitHub.

github.com

[School Talks] DRF를 활용한 입시정보 커뮤니티 서비스

1. 목표와 기능

1.1 목표

고등학생들의 입시정보 및 생활정보 공유 서비스
대입에 대한 입시정보를 찾고, 일상생활을 공유하며 공감대를 형성하는 서비스
공부하다 지친 학생들이 편히 찾을 수 있는 커뮤니티

1.2 기능

기본 기능
- 회원가입, 로그인, 프로필 기능
- 커뮤니티 게시판 기능(입시게시판, 자유게시판 2개)
- AI 티칭 기능

선택 기능
- 실시간 익명 채팅 기능
- 문의 기능

1.3 팀 구성

김정원	김동후	김찬양	황진경	김창수

- Study, Qna, Chat BE & FE - Accounts FE 연결 - 전체 프론트 효율 개선 - 배포 및 CI/CD 진행 - 문서작업	- AIchat 메인 담당 BE & FE - 문서작업	- Post 메인 담당 BE & FE - 전체 프론트 코드 효율 개선 - 문서작업	- Chat, AIChat 서브: 구현방법조사 및 FE수정 - 문서작업	- Accounts 메인 담당 BE - 문서작업

1.4 플로우차트

✨2. 요구사항 명세와 기능 명세

기본 요구사항
- 회원 관련 기능
- 기능 최소 3가지 이상 구현 (회원 기능 포함)
선택 사항
- UI 추가
필수 결과물
- 데이터베이스 구조(ERD)
- API 명세서(마크업, 노션, swagger… 등)
- 발표 자료
평가 지표
- 기술성: 마이크로식과 CBV의 적절한 사용, Django 라이브러리들의 적절한 사용
- DB설계: 데이터베이스 설계, DB 복잡도, 적절성에 따라 구현
- 배포: nginx, gunicorn, django 등 연계하여 배포
- 설계와 구현: 설계와 구현 복잡도(요구사항 작성, 와이어프레임 등 기간 내 설계한 요소들이 모두 구현이 되어 있는지 등)

3. 개발 환경 및 배포 URL

3.1 개발 환경

FE:
BE:
Deployment:

3.2 배포 URL

BE : https://schooltalks.maxworld7070.net/
FE : https://schooltalks77.netlify.app/ (도메인주소 : https://englishmax.xyz)
aws과금으로 현재 서버 중단 상태

3.3 CI/CD 구축 배포

BE Github Action 자동 배포
FE Netlify 자동 배포

4. URL 설계 & API 명세 및 사용 외부라이브러리

4.1 URL 설계 & API 명세

스웨거 문서(API 명세) : API 기능과 사용 방법을 명확히 전달 하기 위한 Swegger drf-yasg 사용하여 문서화

https://schooltalks.maxworld7070.net/schema/swagger-ui/

엔드포인트	HTTP 메서드	기능	앱
/accounts/signup/	POST	새로운 User를 만들어주는 역할 (회원가입)	Accounts
/accounts/token/	POST	인증 토큰 생성 (로그인)	Authentication
/accounts/token/refresh/	POST	토큰 갱신	Authentication
/accounts/token/verify/	POST	토큰 유효성 검사	Authentication
/accounts/user/	GET	특정 사용자의 프로필 조회 (프로필 보기)	User Profile
/aichat/	GET, POST, DELETE	AI와 채팅 (채팅 보기, 채팅 보내기, 전체 채팅 삭제)	AI Chat
/chat/api/chat-messages/	GET, POST	채팅 메시지 조회 및 생성	Chat
/post/	GET, POST	글 목록 조회 및 글 작성	Posts
/post/{id}/	GET, PUT, PATCH, DELETE	특정 글 조회, 수정, 삭제	Posts
/post/{post_id}/comment/{id}/	DELETE, PUT, PATCH	특정 댓글 삭제, 수정	Comments
/qna/inquiry/	GET, POST	문의 사항 조회 및 생성	QnA
/qna/inquiry/{id}/	GET, PUT, PATCH, DELETE	특정 문의 사항 조회, 수정, 삭제	QnA
/study/{id}/	GET, DELETE, PUT	특정 게시물 조회, 삭제, 수정	Study

: 로그인 권한
: 작성자 권한

4.2 사용 외부라이브러리

라이브러리	버전	설명
`djangorestframework`	3.14.0	RESTful API 구축을 위한 강력한 툴킷을 Django에 제공
`djangorestframework-simplejwt`	5.3.1	JWT 인증을 Django Rest Framework에 쉽게 통합할 수 있게 해주는 확장
`drf-spectacular`	0.26.5	DRF 스키마 생성 및 문서화를 위한 확장으로, API 문서화 작업을 간소화
`channels[daphne]`	~4.0.0	비동기 웹소켓 처리 및 실시간 기능 구현의 지원을 위한 Django 확장으로, Daphne 서버를 포함
`redis`	!=4.4.0	Redis 서버와의 통신을 위한 클라이언트 라이브러리, Channels의 백엔드로도 사용
`faker`	21.0.0	목업 데이터 생성, 데이터베이스의 부하 테스트 등 다양한 상황에서 유용하게 사용 됨
`python-dotenv`	1.0.0	`.env` 파일에서 환경 변수를 로드하여 Django 설정에 사용할 수 있게 해주는 도구
`openai`	1.5.0	OpenAI API를 사용하기 위한 공식 클라이언트 라이브러리, GPT-3 등의 AI 모델을 활용할 때 사용

5. 프로젝트 구조와 개발 일정

5.1 프로젝트 구조

# SCHOOLTALKS-BACKEND
├──   .github
├──   accounts
├──   aichat
├──   chat
├──   media
├──   post
├──   project
├──   qna
├──   study
├──   venv
├──   .env
├──   .gitignore
├──   db.sqlite3
├──   manage.py
├──   README.md
└──   requirements.txt

# SCHOOLTALKS-FRONTEND
├──   .vscode
├──   assets
│   ├──   css
│   ├──   fonts
│   ├──   images
│   ├──   js
│   └──   mail
├──   chat
├──   gpt
├──   post
├──   study
├──   header.html
├──   index.html
├──   license.txt
├──   login.html
├──   profile.html
├──   qna.html
├──   README.md
└──   register.html

7개의 앱과 1개의 프로젝트로 구성
assets와 html 폴더로 구성

5.2 개발 일정(WBS)

개발일정은 GitHub Projects Tool로 작성
배포일정은 앞당겨 여유있게 문서작업을 진행
발표전날은 여유있게 프로젝트 복기와 코드 팀스터디를 진행

6. 데이터베이스 모델링(ERD)

학습 게시물 테이블:
- 다대일 관계: 하나의 게시물은 여러 댓글(Study Comment)과 좋아요(Study Like)를 받을 수 있음.
일반 게시물 테이블
- 다대일 관계: 하나의 게시물은 여러 댓글(Comment)과 좋아요(Like)를 받을 수 있음.
AI 대화 테이블(Conversation): AI 와의 대화 내용. 사용자의 입력(Prompt)와 AI의 답변(Response)를 저장.
채팅 테이블(Chat): 채팅방 정보 저장. 각 채팅방은 여러 사용자가 참여할 수 있음.

7. Architecture

프론트엔드: HTML, CSS, JavaScript, Bootstrap으로 구성되며, Netlify를 통해 배포
백엔드: Python과 Django를 사용하고, SQLite 데이터베이스, Gunicorn WSGI, Nginx 웹 서버와 함께 Ubuntu 시스템에 AWS Lightsail로 배포

⌨8. 기술성

용어 정리
마이크로식 :
- 소프트웨어 시스템을 작은 독립적인 서비스로 분해하는 접근 방식
- 분산 아키텍쳐로 구성
- API 또는 메시징 시스템을 통해 상호통신
모놀로그식 :
- 단일 모듈 및 단일 코드 베이스로 구축하는 접근방식
- 모든 기능이 하나로 통합되어 개발

9. 와이어프레임 / UI

9.1 와이어프레임

카카오 오븐을 통한 와이어프레임 제작
게시판, 챗, 로그인 등 메인 기능에 대한 개략적 프레임 작성
부트스트랩 활용 (출처 : GrayGrids)

9.2 화면 설계

Accounts 앱

메인 로그인

회원가입 프로필
Post 앱

자유게시판 게시글 생성

게시글 상세페이지 게시글 수정

AI Chat 앱

시작 질문

Study 앱

입시 정보 게시판 게시글 생성

게시글 상세페이지 게시글 수정
Chat 앱

익명실시간챗

QNA 앱

문의

10. 메인 기능

메인 페이지

서비스로 이동하는 아이콘이 반응할 수 있도록 함
사용자가 바로 이동할 수 있도록 네비게이션바와 배너를 생성

회원 관리 기능

회원가입

회원가입 성공시 성공 메시지 생성
로그인 버튼 클릭 후 로그인 화면으로 이동 가능

로그인

로그인 성공시 이전 페이지로 리다이렉트 됨
상단에 로그인 버튼이 사라지고 로그아웃 버튼이 생성됨

로그아웃

로그아웃 성공시 로그아웃 버튼이 사라지고 로그인 버튼이 생성됨
다시 로그인 버튼을 클릭하여 로그인 하거나 회원가입을 할 수 있음

프로필

회원 가입시 입력 정보를 프로필로 불러옴
회원 가입시 이미지 정보도 불러 오기 가능

자유게시판 기능

글 작성

자유게시판에 새로운 글을 작성
제목과 내용으로 구성되어있으며, 따로 제한없이 자유롭게 글을 쓸 수 있음
로그인한 사용자만 작성 가능

글 보기

글 목록이 있음
글 제목을 클릭하면 상세보기로 들어가짐

글 수정

자유게시판 글을 수정함
기존에 작성햇던 내용이 미리 들어가있음
작성자만 수정 가능

글 삭제

자유게시판 글을 삭제함
작성자만 삭제 가능

글 검색

제목, 내용, 제목+내용, 글쓴이 정보로 검색이 가능함

회색일떄 좋아요을 클릭하면 빨갛게 활성화되고 카운트가 1 오름
빨간색일떄 좋아요를 클릭하면 회색으로 비활성화되고 카운트가 1 내려감
사용자마다 각기 다른 좋아요 정보가 있음

댓글 작성

로그인한 사용자는 글 상세보기에서 최하단에 댓글 작성이 있음
댓글내용을 적고 작성하면 등록됨

댓글 수정

댓글 내용을 수정함
기존 댓글 내용이 미리 들어가있음
작성자만 수정 가능함.
수정시 한번 확인 알람이 있음.

댓글 삭제

댓글을 삭제함
댓글 작성자만 삭제 가능함.

AI 채팅 기능

초기 화면

AI 채팅을 시작할때, 이전 채팅 내역이 없다면 채팅 예시를 보여줌

채팅

질문을 입력하고 보내기 버튼을 누르면, AI의 말풍선이 생기고 잠시후 답변을 보여줌

채팅 저장

유저의 질문과 AI의 답변은 DB에 저장됨
다른 화면에서 AI 채팅방으로 다시 왔을때 이전 채팅 내역을 보여줌

채팅 삭제

삭제 버튼을 누르면 이전 채팅 내역이 모두 삭제되고 새로운 채팅을 시작함

입시정보게시판 기능

:pushpin: 게시판 리스트 검색 및 페이지네이션

메모지형식의 게시판 구현
페이지네이션 이전 다음 버튼으로 구현
리스트 검색 기능 제목, 작성자, 내용에 따라 검색 가능
핵심 주요 정보 게시판이기 때문에 로그인을 해야 CRUD 가능
기존에 작성한 내용을 미리 볼 수 있음
더보기를 클릭하면 상세 글로 들어감

:pushpin: 게시글 CRUD

게시글에는 작성자, 작성일, 조회수, 좋아요, 내용, 이미지, 첨부파일이 포함됨
게시글은 작성자만 수정, 삭제 가능
해당 페이지에 접속 시 +1로 View가 올라감

:pushpin: 좋아요 및 댓글 CRUD

좋아요 기능 구현
- 회색일때 좋아요을 클릭하면 빨갛게 활성화되고 카운트가 1 오름
- 빨간색일때 좋아요를 클릭하면 회색으로 비활성화되고 카운트가 1 내려감
- 사용자마다 각기 다른 좋아요 정보가 있음
댓글 CRUD 가능
- 로그인한 사용자는 글 상세보기에서 최하단에 댓글 작성이 있음
- 댓글 내용을 작성 수정, 삭제 가능
- 작성자만 수정 삭제 가능함.
로그인 및 사용자 권한이 있어야 CRUD 가능

11. 추가기능

문의 기능

Q&A

자주 찾는 질문은 배너를 활용하여 게시함
메일, 카테고리, 문의내용을 통해 문의할 수 있음

실시간 익명 채팅 기능

익명 채팅방

익명으로 채팅에 참여할 수 있음
로그인하지 않아도 채팅에 참여할 수 있음
하단에는 쿠팡파트너스 광고를 넣어 실제 커뮤니티와 비슷하게 수익성도 고려 해 보았음.

12. 에러와 에러 해결

김정원

⚙ 에러명 : 403 Forbidden

문제점 : 웹 서버(Nginx)를 사용하는 웹 애플리케이션에서 403 Forbidden 오류 발생.

문제 원인 : Nginx 서버가 기본적으로 www-data 사용자로 실행되어 웹 애플리케이션의 파일에 접근할 때 권한 부족으로 인한 오류.

해결 방법 :
```
Nginx의 실행 사용자 변경
```

/etc/nginx/nginx.conf 파일을 열어서 Nginx의 실행 사용자를 ubuntu로 변경.
user ubuntu;

권한 변경

/media 디렉토리의 소유자와 그룹을 ubuntu로 변경.
sudo chown -R ubuntu:ubuntu /media
cat /etc/nginx/nginx.conf | grep user

Nginx 구성 파일 테스트
변경된 구성 파일의 유효성을 검사.
sudo nginx -t

Nginx 재시작
변경 사항이 적용되도록 Nginx 서버를 재시작.
sudo systemctl restart nginx

기타 정보
sudo systemctl status nginx 명령으로 Nginx 서버 상태 확인.

⚙ 에러명 : 404 에러 Not Found


- 문제 원인 :
교안에 따라 location / 위치 설정을 하였지만, 새로운 프로젝트와 url 주소가 맞지 않아서 그냥 location 부분을 '/'로 비워둠
proxy가 url 위치를 찾지 못해서 생기는 문제 


- 해결 방법 :
nginx의 default 값이 잘못 설정되어 다음과 같이 수정하여 해결

    location / {
    include proxy_params;
    proxy_pass http://unix:/tmp/gunicorn.sock;
   }


⚙ 에러명 : 400에러 Bad Request


- 문제: 배포 이후 페이지는 찾지만, 보안 관련설정이 올바르지 않아서 뜨는 오류


- 해결 방법:
- ALLOWED_HOST를 임의로 비워둬서 발생했던 오류
- DEBUG = False로 보안상 두기


⚙ 에러명 : 500에러 Internal Server Error


- 문제: 배포 이후 앱 몇 개에서 500에러가 발생


![image](https://github.com/maxkim77/CI/assets/141907655/f4299f8c-7758-46be-ae2e-13840b49f229)


![image](https://github.com/maxkim77/CI/assets/141907655/d9e2bbb6-b0b2-4ec0-a425-250b3e80147e)


- 문제 원인
- ls -a로 폴더 권한을 확인하던 중 정상 작동되던 앱은 migration이 있는데 오류가 뜨는 앱은 migration이 없었음
- migrations이 안되었던 상황 gitignore에 migration을 추가해서 이후에 추가 된 앱들이 migration이 없는 체로 배포가됨


- 해결 방법


![image](https://github.com/maxkim77/CI/assets/141907655/d80c78a2-6ff6-48aa-82ec-bcd437968e00)


- mgirations 폴더를 다시 올리고 makemigrations 및 migrate
- 500 에러는 migrate가 안될 가능성이 있음
- 배포를 위해선 git에 miration 폴더 및 init 도 추가해야 함



⚙  에러명 : NameError

-   문제:

NameError: name 'Post' is not defined SystemCheckError: System check identified some issues: ERRORS: post.Comment.author: (fields.E304) Reverse accessor 'User.comments' for 'post.Comment.author' clashes with reverse accessor for 'study.StudyComment.author'. HINT: Add or change a related_name argument to the definition for 'post.Comment.author' or 'study.StudyComment.author'. post.Comment.author: (fields.E305) Reverse query name for 'post.Comment.author' clashes with reverse query name for 'study.StudyComment.author'. HINT: Add or change a related_name argument to the definition for 'post.Comment.author' or 'study.StudyComment.author'. study.StudyComment.author: (fields.E304) Reverse accessor 'User.comments' for 'study.StudyComment.author' clashes with reverse accessor for 'post.Comment.author'. HINT: Add or change a related_name argument to the definition for 'study.StudyComment.author' or 'post.Comment.author'. study.StudyComment.author: (fields.E305) Reverse query name for 'study.StudyComment.author' clashes with reverse query name for 'post.Comment.author'. HINT: Add or change a related_name argument to the definition for 'study.StudyComment.author' or 'post.Comment.author'.


-   문제 원인:

    -   Django 모델에서 역 관계(accessor)와 역 질의(reverse query) 이름이 충돌하는 경우 발생
    -   study 게시판과 post 게시판이 합쳐지면서 비슷한 이름끼리 충돌하여 생긴문제


-   해결 방법:

각 모델의 역 관계 이름을 명시적으로 설정하여 충돌을 해결가능. related_name 매개변수를 사용하여 각 모델의 관계 이름을 고유하게 지정

-   예제:

python Copy code class Comment(models.Model): author = models.ForeignKey(User, on_delete=models.CASCADE, related_name='post_comments') # 다른 필드들...

class StudyComment(models.Model): author = models.ForeignKey(User, on_delete=models.CASCADE, related_name='study_comments') # 다른 필드들... 변경 후:

위와 같이 related_name을 설정한 후, makemigrations 및 migrate 명령을 실행하여 데이터베이스를 업데이트 -> 역 관계 이름 충돌 문제가 해결


### 김찬양
⚙  에러명 : NOT NULL constraint failed

-   문제:

django.db.utils.IntegrityError: NOT NULL constraint failed: accounts_user.grade


-   문제 원인:

    -   accounts의 커스텀 사용자 앱에서 학년에 작은 양수만 저장시키기 위해 PositiveSmallIntegerField로 작성한것이 문제
    -   해당 필드는 기본적으로 null값을 허용하지 않는것으로 보임

-   해결 방법:

    - 처음엔 기본값을 주려고 했다가, REQUIRED_FIELDS를 사용해 입력받도록 함
    - 기본값을 주기 or null을 허용 or REQUIRED_FIELDS를 사용해 지정해야함

-   예제:

grade = models.PositiveSmallIntegerField(verbose_name="학년", null=True)

grade = models.PositiveSmallIntegerField(verbose_name="학년", default=1)

REQUIRED_FIELDS = [grade]

위와 같이 null = True를 해도 에러가 나지 않는다고 판단했기에 추가하여 에러를 해결


### 김동후
⚙  에러명 : OPEN AI Version Issue

-   문제:

You can run 'openai migrate' to automatically upgrade your codebase to use the 1.0.0 interface.

Alternatively, you can pin your installation to the old version, e.g. pip install openai==0.28


-   문제 원인:

    -   Openai Api를 사용해서 인공지능 답변을 받아오기위한 views.py의 코드가 openai 버전에 맞지 않음
    -   Openai 라이브러리의 버전이 1.~ 버전으로 변경됨에 따라서 인공지능 모델을 생성하는 코드가 변경됨

-   해결 방법:

    - Openai 버전을 강제로 낮춰서 쓰거나 코드를 수정해야 해야 함

-   문제 원인:

    - Openai 버전을 0.27로 낮추어서 사용했으나 pip 버전에 따라서 0.27이 설치되지 않는 문제가 추가로 발생

-   해결 방법:

    - openai migrate를 통해서 모델을 생성 후, OPEN-AI-KEY 가져오는 코드를 최대한 최신 버전의 라이브러리에서 사용해도 문제가 없도록 수정

##  13. 개발하며 알게 된 점 및 느낀점

### 김정원
-  가장 실무와 가까운 협업 프로젝트를 하는 건 처음이고, 특히 컨벤션 맞추는 부분이 어색하고 어려웠지만, 같이 문제를 해결하는 과정이 재미가 있었음.
-  또한 협업을 할 때 깃 환경을 어떻게 활용하는지 배우면서 팀 프로젝트를 진행할 수 있었기 때문에 매우 도움이 되었던 프로젝트임.
-  아직 부족한 점은 많지만 지난 DRF 개인 프로젝트에 비해 프론트서버랑 통신에서 오류잡는 시간이 단축되었고, 또한 CI/CD 구축과 서버 배포 후 오류를 잡는 과정에서 더욱 성장할 수 있었음.

### 김창수
-  개인 프로젝트를 진행할 때와는 다르게 팀 프로젝트는 서로간의 커뮤니케이션이 많이 중요하다는 걸 느낄 수 있었음.
-  부족하여 이해하지 못했던 부분들을 계속 작업을 하면서 조금 더 이해할 수 있었고, 협업하는데 Git이 많은 도움이 된다는걸 느껴 앞으로 더 다양하게 활용하는 방법을 공부할 예정.
-  개인 프로젝트와는 다르게 팀 프로젝트여서 팀원들에게 많은 도움을 받아 혼자 구현하지 못했던 부분들을 해낼 수 있었고 많은 공부가 되었음.

### 김찬양
-  첫 chatGPT DRF 프로젝트에서 토큰에 과하게 시간을 투자해서 아쉬웠던 점이 많앗는데, 이번에는 여럿이서 개발하게 되어 시간이 넉넉했기 때문에 나름 만족할 수 있었던 프로젝트가 되었음.
-  장고에서 꽤 많은 라이브러리를 봤다고 생각했는데 그것보다 더 다양한 라이브러리와 편의 기능이 있다는 것에 매우 놀랐음.
-  협업에 대해 팀원에 대한 참여율이나 컨벤션 등 걱정이 꽤 많았는데, 생각보다 부드럽게 흘러가 좋은 결과물을 낸 것 같음
-  코드를 짜다보니 욕심이 점점 생겨서 차근차근 이것저것 테스트해 보면서 사용하지 못했던 기능 등을 이후에 더 개발해볼 생각.

### 황진경
-  1:1 채팅 개발 경험이 있어 프로젝트 시작과 동시에 채팅을 맡아 팀 프로젝트를 진행하였다. 그러나 첫 DRF 프로젝트였고 오류가 많아 프로젝트 기간 내 완수할 수 없다고 판단되어 포기한 것이 너무 아쉬웠음.
   부족한 점이  많으니 노력해야겠다고 생각함.
-  맡은 임무를 완벽히 수행하지 못해 대부분 서브로 프로젝트를 진행. 그러나 옆에서 팀원들이 개발하는 과정이나 배포하는 과정을 보며 공부할 수 있었고 실제 서비스가 운용이 되니 신기 함.
-  협업을 진행하여 Git을 더 숙달할 수 있는 시간이었음.

### 김동후
-  Git을 실무와 비슷하게 사용하는 법을 익히고 이를 통해서 배움이 늘어가는 것이 눈에 뚜렷하게 보여서 뿌듯했고, 처음 하는 팀 프로젝트이다 보니까 많이 미숙하고 부족한 부분도 있었지만 결과물을 보니 만족스러움
-  Django에 조금 더 익숙해지고 특히 담당한 Open ai API를 사용하는 부분이나 채팅 관련 부분에서 많은 공부가 되어서 단순히 결과물을 위한 프로젝트가 아니라 성장하는 경험이 된거같아 아주 의미 있는 시간이었음.

##  14. 마무리 및 시연 영상


https://github.com/EstSoftOrmi3FinalProject/SchoolTalks-Backend/assets/141907655/37a0c6d0-990f-4a94-8265-602bcc16af41

##  15. 참고 사항(로컬환경 실습)

- 깃폴더를 다운로드 후 아래와 같이 실행

python -m venv venv

Window: venv/Scripts/activate
Mac, Linux: source venv/bin/activate

.env 파일 생성

SECRET_KEY=YOUR_KEY
DEBUG=True
OPENAI_API_KEY=YOUR_KEY
REDIS_HOST=YOUR_HOST
REDIS_PORT=YOUR_PORT
REDIS_PASSWORD=YOUR_PWD


- 테스트용 더미데이터를 만드는 명령어를 추가
- faker 라이브러리를 이용해서, 랜덤한 가상의 데이터가 들어가서 보다 다양한 경우의수에 대한 테스트가 용이
- 현재 가상 사용자(비밀번호는 해싱되지 않은 데이터이므로 변경 필요)와 가상 자유게시판 글이 기능중에 있음

1. 가상 유저 생성방법
    - 기본값은 2명 생성이고, 뒤에 --total (생성할 갯수)를 붙여주면 그만큼 생성

python manage.py seed-users


2. 가상 자유게시판 데이터 생성방법
    - 이것 역시 기본값은 2명 생성이고, 뒤에 --total (생성할 갯수)를 붙여주면 그만큼 생성
    - 사용자는 현재 가입된 사용자중 한명이 랜덤하게 선택되어 들어 감
```shell
python manage.py fake-post

16. 기타

School Talks 깃이모지 컨벤션

School Talks 깃브랜치 컨벤션

School Talks 프레젠테이션

School Talks 코드 스터디
맨 위로

Git & GitHub 심화

UserDonghu — Wed, 6 Dec 2023 19:00:11 +0900

Branch

git의 기본 브랜치 : master

GitHub에서의 기본 브랜치 : main

브랜치 생성

git branch mybranch

메인에서 파생되는 브랜치 생성

git branch mybranch main

브랜치 이동/변경

git checkout mybranch

코드 이후로 원격 저장소에 mybranch라는 브랜치를 만들어 push

git push --set-upstream origin mybranch

브랜치 변경

git switch mybranch

브랜치 새로 만들어서 변경

git switch -c mybranch

파일을 최근 커밋으로 되돌리기

git restore README.md

최근 커밋 전으로 되돌리기

git checkout -- README.m

스테이지에 올린 파일 빼기

git restore --staged README.md

git reset HEAD README.md

브랜치 삭제

git branch -D <브랜치명>

삭제된 브랜치 복구

git reflog로 커밋 해시값 가져오고

git checkout -b <브랜치명> <커밋 해시값>

merge(합병)하기

git checkout main

git merge mybranch

git push origin main

Fork

Github 레파지토리에 들어가서 Fork를 클릭후 내 레파지토리 생성

clone -> commit -> push 후 pull request 보내기

그 외 명령어

amend

하나의 기능을 만들고 커밋을 할 때 누락한 파일을 추가하고 싶을 때 사용

최신 커밋에 스테이징한 내용 추가

git commit --amend

stash

현재 브랜치에서 아직 커밋 하지 못한 파일들이 있는데, 다른 브랜치로 넘어가야 하는 경우 현재 브랜치의 변경사항을 잠시 보관할 때 사용

Tracked : git 저장소에서 관리하는 파일

UnTracked : git 저장소에서 관리하지 않는 파일

수행중인 README.md 파일 작업을 임시 저장

git add README.md

git stash

다른 브랜치에서 작업하고 돌아온 후, 가장 최근에 임시 저장한 내용 가져오기

git stash pop

UnTracked 파일을 stash하려면 --all 붙여줘야함

git stash --all

reset

이전 커밋으로 브랜치를 되돌릴 때 사용

git reset --[mode] <커밋 id>

hard : 지정한 커밋 이력 이후 변경사항을 다 버리고 지정한 커밋으로 리셋

mixed : 지정한 커밋 이력 이후 변경 사항은 로컬에 unstaged 상태로 유지하고 커밋은 리셋

soft : 지정한 커밋 이력 이후 변경 사항은 로컬에 stage 상태로 유지하고 커밋은 리셋

revert

지정한 커밋의 내용으로 새로운 커밋 생성(히스토리 보존)

git revert <커밋 id>

cherry-pick

여러가지 커밋 중에 내가 원하는 커밋만 가져와서 현재 브랜치에 붙이기

git cherry-pick <commit-id>

Django 프로젝트(2) - AI 지식인 서비스

UserDonghu — Sat, 2 Dec 2023 21:45:09 +0900

https://github.com/UserDongHu/ChatGPT_DRF_Project

GitHub - UserDongHu/ChatGPT_DRF_Project

Contribute to UserDongHu/ChatGPT_DRF_Project development by creating an account on GitHub.

github.com

Django DRF Project - AI 지식인 서비스

AI가 답변을 해주는 지식인 서비스 입니다.
질문을 하면 ChatGPT가 답변을 해줍니다.
내가 한 질문과 ChatGPT의 답변이 게시물로 생성됩니다.
다른 사람들의 질문들을 볼 수 있습니다.

1. 목표와 기능

1.1 목표

DRF(Django REST Framework)를 이용한 REST API 구현
ViewSet을 사용해서 CRUD 기능 설계
Accounts(Login, Logout) 인증 방식 JWT 사용
ChatGPT API 사용
AWS에 서버 배포
HTML + Vanilla JS로 간단한 Front-End 구현
Netlify로 FE 배포

1.2 기능

회원가입 혹은 로그인 후, 글쓰기를 통해 카테고리를 선택하여 질문을 할 수 있습니다.
내가 한 질문과 ChatGPT의 답변이 게시물로 생성됩니다.
메인화면에서 모든 질문들을 볼 수 있습니다.
상세 게시물에서 조회수와 추천수를 확인 할 수 있습니다.
게시물에 추천을 누르거나 댓글을 작성할 수 있습니다.
내가 쓴 게시물과 댓글을 삭제할 수 있습니다.

2. Stacks 및 배포 URL

2.1 Stacks

Enviroment

![GitHub](https://img.shields.io/badge/GitHub-100000?style=for-the-badge&logo=github&logoColor=white)

Development

![Django](https://img.shields.io/badge/Django-092E20?style=for-the-badge&logo=django&logoColor=white)



![HTML](https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge&logo=html5&logoColor=white)



![JS](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=JavaScript&logoColor=white)

DataBase

2.2 배포 URL

https://stupendous-elf-84bccd.netlify.app/

- test ID : test
- test PW : mypw1234

3. 아키텍처/URL 구조 및 플로우 차트

3.1 아키텍처 구조

3.2 URL 구조

Swagger link : http://52.78.33.155:8000/api/schema/swagger-ui/

accounts

App	Method	URL	Views Class	Note
accounts	POST	'/accounts/join/'	-	회원가입
accounts	POST	'/accounts/login/'	-	로그인 / JWT발급
accounts	POST	'/accounts/logout/'	-	로그아웃 / JWT삭제
accounts	GET	'/accounts/profile/'	ProfileViewSet	내 프로필

blog

App	Method	URL	Views Class	Note
blog	GET	'/blog/posts/'	PostViewSet	게시글 목록
blog	POST	'/blog/posts/'	PostViewSet	게시글 생성 / ChatGPT API 요청
blog	GET	'/blog/posts/{post_id}/'	PostViewSet	게시글 상세보기 / 게시글 조회수 증가
blog	PATCH	'/blog/posts/{post_id}/'	PostViewSet	게시글 수정
blog	DELETE	'/blog/posts/{post_id}/'	PostViewSet	게시글 삭제
blog	POST	'/blog/posts/{post_id}/like/'	PostViewSet	게시글 좋아요 증가
blog	GET	'/blog/posts/{post_id}/comments/'	CommentViewSet	게시물의 댓글 목록
blog	POST	'/blog/posts/{post_id}/comments/'	CommentViewSet	게시물의 댓글 생성
blog	GET	'/blog/posts/{post_id}/comments/{comment_id}/'	CommentViewSet	게시물의 특정 댓글 보기
blog	PATCH	'/blog/posts/{post_id}/comments/{comment_id}/'	CommentViewSet	게시물의 특정 댓글 수정
blog	DELETE	'/blog/posts/{post_id}/comments/{comment_id}/'	CommentViewSet	게시물의 특정 댓글 삭제

3.3 플로우 차트

메인페이지

게시글 상세보기

4. 디렉토리 구조와 개발일정(WBS)

4.1 디렉토리 구조

├──  FE
│   ├──  js
│   │   ├──  accounts
│   │   │   ├──  accounts-join.js
│   │   │   ├──  accounts-login.js
│   │   │   ├──  accounts-logout.js
│   │   │   └──  accounts-profile.js
│   │   └──  blog
│   │       ├──  blog-create.js
│   │       └──  blog-main.js
│   └──  templates
│       ├──  accounts
│       │   ├──  join.html
│       │   ├──  login.html
│       │   ├──  logout.html
│       │   └──  profile.html
│       └──  blog
│           ├──  create.html
│           └──  index.html
├──  README.md
├──  accounts
│   ├──  __init__.py
│   ├──  __pycache__
│   ├──  admin.py
│   ├──  apps.py
│   ├──  managers.py
│   ├──  migrations
│   ├──  models.py
│   ├──  serializers.py
│   ├──  tests.py
│   ├──  urls.py
│   └──  views.py
├──  blog
│   ├──  __init__.py
│   ├──  __pycache__
│   ├──  admin.py
│   ├──  apps.py
│   ├──  migrations
│   │   ├──  __init__.py
│   │   └──  __pycache__
│   ├──  models.py
│   ├──  permissions.py
│   ├──  serializers.py
│   ├──  tests.py
│   ├──  urls.py
│   └──  views.py
├──  db.sqlite3
├──  manage.py
├──  media
├──  project
│   ├──  __init__.py
│   ├──  __pycache__
│   ├──  asgi.py
│   ├──  settings.py
│   ├──  urls.py
│   └──  wsgi.py
├──  requirements.txt
└──  static

4.2 개발일정(WBS)

gantt
    title ChatGPT DRF Project
    dateFormat  YYYY-MM-DD
    section 기획
        레포지토리 생성 :2023-11-21, 1d
        주제 선정 :2023-11-21, 2d
        WBS :2023-11-22, 1d
        화면 설계 :2023-11-22, 1d
        플로우 차트 설계 :2023-11-22, 2d
        URL 설계 :2023-11-23, 1d
        Model 설계 :2023-11-23, 2d

    section BE 구현
        로그인/로그아웃 :2023-11-23, 1d
        회원가입 :2023-11-23, 1d
        프로필 페이지 : 2023-11-23, 1d
        JWT 인증 :2023-11-23, 2d
        게시물 상세/조회수 :2023-11-24, 1d
        게시물 CRUD :2023-11-24, 1d
        댓글 CRUD :2023-11-24, 1d
        ChatGPT API 연결 :2023-11-24, 1d
        AWS EC2 배포 :2023-11-24, 2d
        Swagger :2023-11-25, 1d

    section FE 구현
        로그인/로그아웃 :2023-11-27, 1d
        회원가입 :2023-11-27, 1d
        프로필 페이지 : 2023-11-27, 1d
        JWT 인증 :2023-11-27, 2d
        게시물 상세 :2023-11-28, 1d
        게시글 CRUD :2023-11-28, 1d
        댓글 CRUD :2023-11-28, 2d
        Netlify 배포 :2023-11-29, 1d

5. ERD

6. UI

로그인/로그아웃
회원가입
프로필
글쓰기
좋아요/댓글작성
댓글 삭제
게시글 삭제

7. 발생한 문제와 문제 해결

문제1 : 적절하지않은 Mixin사용

상황 : 현재 접속한 유저의 프로필 정보를 나타내는 ProfileViewSet을 만들기위해 모델 인스턴스를 리턴해 주는 믹스인 RetrieveModelMixin을 사용했으나 '/accounts/profile/'에서 바로 모델 인스턴스를 리턴해주지 않고 '/accounts/profile/1' 처럼 User모델의 pk값으로 모델 인스턴스를 선택해서 반환을 해주었다.
원인 : RetrieveModelMixin은 개별 항목 조회를 구현할 때 주로 사용되기 떄문에 현재 접속한 유저의 정보만을 불러오려는 나의 목적에는 알맞지 않는다.
해결 : Queryset을 리스팅하는 믹스인 ListModelMixin을 사용해서 현재 접속된 유저의 모델만을 리턴하도록 하여 해결했다.

문제2 : 이벤트 리스너의 중첩

상황 : 메인 화면에서 게시글 상세보기를 한번 들어갔다가 다시 메인화면을 나왔다가 할 때 마다 게시물 상세보기에서 댓글 작성 버튼을 눌렀을 때 같은 내용으로 생성되는 댓글의 수가 늘어난다.
원인 : HTML파일에서 미리 만들어둔 댓글 작성 버튼을 style속성으로 숨겨두기만 했었는데, 게시글 상세보기를 클릭했을 때 댓글 작성 버튼에 이벤트를 추가하도록 JS코드로 구현해서 이벤트 리스너가 계속 중첩이 되는것이었다.
해결 : 댓글 작성 버튼을 HTML파일에서 미리 만들어두는것이 아닌, 게시글 상세보기를 클릭했을 때 동적으로 생성되도록 JS코드를 수정해서 이벤트 리스너의 중첩을 막았다.

문제3 : HTTPS -> HTTP 통신

상황 : 프론트 배포를 마친 후, 테스트를 하는데 서버에 request를 보내지 못하고 fetch에러가 계속 뜨는 문제가 생겼다.
원인 : Netlify를 통해서 프론트 엔드 배포를 하였는데 Netlify는 HTTPS를 사용하는 반면 AWS로 배포한 서버는 SSL인증을 받지 않아서 HTTP를 사용해서 HTTPS와 HTTP의 통신을 금지하는 웹 보안 문제로 인해 프론트와 서버간 통신에 어려움이 있었다.
해결 : 서버를 HTTPS로 바꿀수도 있었지만, Netlify 문서를 찾아보니 리다이렉트 경로를 설정해서 모든 요청을 CDN서버에서 바로 프록시 시키는 방식으로 HTTP서버와 통신을 가능하게 하는 방법이 있어서 이를 통해 해결했다.

"간지나는 나"의 스톤아일랜드 23FW 크링클랩스 롱패딩

UserDonghu — Fri, 1 Dec 2023 00:06:55 +0900

이번 겨울에는 꼭 간@지 쌈@뽕 나는 롱패딩 하나 사야지 하고 블랙 프라이데이 해외 직구 정보를 며칠을 봤는데도 맘에 드는게 하나 없어서 그냥 크림에서 샀다. 크림이 제일 쌈 그냥..

21, 22, 23FW 시즌들 롱패딩이 생긴게 다 달라서 조금 고민했는데 21은 이쁘긴한데 너무 예전 모델 같고.. 22는 주머니가 치렁치렁이라 안이쁨 23은 너무 무난함..

어차피 새거 사서 오래 입을건데 최신 모델 사자해서 23FW를 골랐습니다.

사실 17FW 같은 옛날 모델이 이쁜듯 근데

크림 수수료 장난하냐? 죽을래?

크림에서 짱 큰 박스 옴

요망한 와펜과 택

사실 매장가서 한번 입어봤는데 백화점에서는 230임... 미친 가격

XL랑 XXL 고민했는데 롱패딩은 딱 맞게 입는게 이쁘대서 XL 선택함 (오버핏충 패배)

105~108 정도 사이즈 되는듯?

옷걸이도 주네

사기꾼들이 쓸까봐 서명넣음 ㅎㅎ

스톤아일랜드만큼 돈값하는 브랜드도 없는듯?

크링클랩스 원단 한번 부스럭거리면 중독돼서 사고싶어짐 ㅋㅋ

183/65/XL

유행을 안타는 디자인에 유행을 안타는 색상에 유행을 안타는 브랜드(이미 인식 나락ㅋㅋ)이므로 오래오래 입을 수 있겠네요

누가 정장에 구두신고 걸친거를 보고 너무 멋져서 참지 못하고 사버린 스톤아일랜드 23FW 크링클랩스 롱패딩 이었읍니다.

자유게시판	게시글 생성

게시글 상세페이지	게시글 수정

입시 정보 게시판	게시글 생성

게시글 상세페이지	게시글 수정

시작	질문