분류 전체보기

[Photogram] 댓글 구현

이번 시간에는 댓글을 작성하고 삭제하는 기능을 구현해보려고 합니다. 📝 Entity 우선 아래와 같이 댓글(Comment) 객체를 구현하였습니다. package com.cos.photogram.domain.comment; ... @Data @Builder @NoArgsConstructor @AllArgsConstructor @Entity public class Comment { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) private Long id; @Column(length = 100, nullable = false) private String content; @JsonIgnoreProperties({"images"}) @JoinColumn(na..

[Photogram] 프로필 사진 변경

이번 시간에는 사용자가 자신의 프로필 사진을 변경할 수 있도록 하는 기능을 구현해보겠습니다. 📝 View 우선 자신의 프로필 사진만 변경할 수 있도록 제한하기 위해 View 페이지를 아래와 같이 구현하였습니다. 즉, 자신의 프로필 페이지가 아니라면 아래와 같은 사진 업로드 모달이 보이지 않게 될 것입니다. 📝 Javascript 이후 ajax 통신을 통해 이미지를 서버에 저장하기 위해 js 파일에 아래와 같은 함수를 구현해주었습니다. // (4) 유저 프로파일 사진 변경 (완) function profileImageUpload(principalId) { $("#userProfileImageInput").click(); $("#userProfileImageInput").on("change", (e) => ..

[Photogram] 인기 페이지 구현

이번시간에는 사용자가 좋아요 표시를 한 글들을 좋아요가 많은 순서대로 출력하여 보여주는 페이지를 구현해보려고 합니다. 📝 Repository 이를 위해 먼저 아래와 같이 네이티브 쿼리를 작성해주었습니다. package com.cos.photogram.domain.image; ... public interface ImageRepository extends JpaRepository{ ... @Query(value = "SELECT i.* FROM image i INNER JOIN (SELECT image_id, COUNT(image_id) like_count FROM likes GROUP BY image_id) c ON i.id = c.image_id ORDER BY like_count DESC", nati..

[Photogram] 좋아요 구현하기

이번 시간에는 스토리 페이지에서 자신이 구독한 사용자의 글에 좋아요를 마킹할 수 있는 기능을 구현해보겠습니다. 📝 Like 우선 아래와 같이 좋아요 객체를 구현하였습니다. package com.cos.photogram.domain.likes; ... @Data @Builder @NoArgsConstructor @AllArgsConstructor @Table( //데이터베이스에서 두 개의 컬럼에 대해 unique 제약조건 설정 uniqueConstraints = { @UniqueConstraint( name = "likes_uk", columnNames = {"image_id", "user_id"} ) } ) @Entity public class Likes { @Id @GeneratedValue(strat..