ep 15. 인스타그램 클론코딩 (6)

폴더 구조 리팩토링

이번 시간은 구현에 앞 서 폴더 구조를 조금 고쳐주도록 하겠습니다.

위와 같이 server 파일을 삭제함과 동시에 html 폴더를 assets/ 아래에 만들어 html 파일들을 옮겨주고,

server 아래 있던 파일들과 폴더는 frontend 아래로 옮겨줍니다.

 

파일들이 위치를 이동했음으로 이에 따라 코드도 수정해줍니다.

server.js

sever.js

server.js

server.js 파일의 6, 14, 18번째 줄을 위와 같이 수정해줍니다.

 

이 후 nodemon start 로 서버를 실행시켜 잘 작동되는 지 확인 해줍니다! ( 까먹지 말고 백엔드 서버도 켜줍시다.)

 

댓글 API 구현

먼저 backend/api/resources 폴더에 comment.py 파일을 새로 생성해줍니다.

 

 

from flask_restful import Resource, request

class CommentList(Resource):
    @classmethod
    def get(cls, post_id):
        pass
    
    @classmethod
    def post(cls, post_id):
        pass
    
class CommentDetail(Resource):
    @classmethod
    def put(cls, post_id, comment_id):
        pass
    
    @classmethod
    def delete(cls, post_id, comment_id):
        pass

그 후 위와 같이 CRUD에 대한 틀만 잡아 코드를 짜줍니다.

 

 

__init__.py 에 만들어준 리소스를 등록해줍니다.

 

 

from api.ma import ma
from api.models.comment import CommentModel
from marshmallow import fields
from api.ma import ma, Method


class CommentSchema(ma.SQLAlchemyAutoSchema):
    """
    댓글 모델에 대한 직렬화 규칙을 정의합니다.
    """

    created_at = fields.DateTime(format="%Y-%m-%d,%H:%M:%S")
    updated_at = fields.DateTime(format="%Y-%m-%d,%H:%M:%S")

    author_name = Method("get_author_name")

    def get_author_name(self, obj):
        return obj.author.username

    class Meta:
        model = CommentModel
        dump_only = [
            "author_name",
        ]
        exclude = ("author_id", "post_id")
        load_instance = True
        include_fk = True
        ordered = True

이후 댓글은 json으로 응답할 것이기에,

직렬화와 역직렬화에 대한 코드를 schemas/comment.py 를 생성해 여기에 짜줍니다.

comment의 id 를 받는 필드는 아까 등록한 리소스(url)을 통해 받아올 것임으로 제외 혹은 읽기 전용 필드로 설정해줍니다.

이후, Post 모델에서 comment_set 필드에 lazy = 'dynamic' 옵션을 추가합니다.

이는 정렬을 위함입니다.

 

Comment 모델의 updated_at 필드에 default 필드를 추가합니다.

수정일자가 자동으로 저장되기 위함입니다.

 

from marshmallow import ValidationError
from flask_restful import Resource, request

from api.models.comment import CommentModel
from api.models.post import PostModel
from api.models.user import UserModel

from api.schemas.comment import CommentSchema

from flask_jwt_extended import jwt_required, get_jwt_identity

comment_list_schema = CommentSchema(many=True)
comment_schema = CommentSchema()

class CommentList(Resource):
    @classmethod
    def get(cls, post_id):
        post = PostModel.find_by_id(post_id)
        orderd_comment_list = post.comment_set.order_by(
            CommentModel.id.desc()
        )
        
        return comment_list_schema.dump(orderd_comment_list)
    
    @classmethod
    @jwt_required()
    def post(cls, post_id):
        comment_json = request.get_json()
        username = get_jwt_identity()
        author_id = UserModel.find_by_username(username).id
        try:
            new_comment = comment_schema.load(comment_json)
            new_comment.author_id = author_id
            new_comment.post_id = post_id
        except ValidationError as err:
            return err.messages, 400
        
        try:
            new_comment.save_to_db()
        except:
            return {"Error" : "저장에 실패했습니다."}, 500
        return comment_schema.dump(new_comment), 201
        
    
class CommentDetail(Resource):
    @classmethod
    def put(cls, post_id, comment_id):
        pass
    
    @classmethod
    def delete(cls, post_id, comment_id):
        pass

리소스를 위와 같이 코드를 수정해줍니다.

get 메소드와 post 메소드를 구현해줬습니다.

이는 각각 조회와 작성을 담당합니다.

작성의 경우 로그인이 된 상태에서만 작성할 수 있도록 코드를 짰습니다.

 

 

 

이제 postman으로 확인해봅시다.

위와 같이 생성과 조회가 잘 되면 코드를 잘 작성한 것입니다.

 

디음으로는 수정입니다. 이 역시 로그인한 대상이 작성한 대상과 같아야 수정이 가능하고,

존재하지 않는 댓글에 대한 예외처리를 해주었습니다.

이후 update_to_db() 에 대한 함수를 models/comment.py 파일에 추가해줬습니다.

데이터 베이스 내용을 업데이트 해주는 함수입니다.

마지막으로 삭제입니다.

전반적인 내용은 수정과 비슷하며, db에 update 되는 것이 아닌 delete 되는 코드라 생각하면 되겠습니다.

 

 

 

이 역시 postman을 통해 확인해보실 수 있습니다!

 

감사합니다.