🐶 FluffyTime (반려동물 전용 SNS)

🔗 프로젝트 링크

https://fluffytime.o-r.kr/

🗓️ 프로젝트 기간

2024.07.23 ~ 2024.09.06

🙌🏻 프로젝트 설명

반려동물과 함께하는 소중한 순간들을 공유하고, 다른 반려동물을 사랑하는 이들과 소통할 수 있는 특별한 공간을 만들기 위한 프로젝트입니다.

🖼️ 기획 배경

반려동물에 대한 관심과 애정이 지속적으로 증가함에 따라, 반려동물 전용 SNS와 같은 전문적인 서비스의 필요성이 커지고 있습니다.
반려동물을 주제로 한 소통 공간이 부족한 상황에서, 반려동물에만 집중된 소통이 가능한 플랫폼의 필요성이 대두되고 있습니다.
반려동물에 대한 다양한 정보와 지식을 손쉽게 얻을 수 있는 서비스가 필요합니다.
사용자의 관심사에 맞춘 콘텐츠만을 제공함으로써 불필요한 게시물 노출을 최소화할 수 있는 서비스가 요구되고 있습니다.

🎯 프로젝트 목적

반려동물에 대한 관심이 높은 사용자들을 위한 맞춤형 SNS 플랫폼을 제공하여, 그들이 더욱 깊이 소통하고 교류할 수 있는 환경을 조성합니다.
반려동물 전용 SNS를 통해 사용자들이 반려동물에 관한 정보와 경험을 쉽게 공유하며, 전문적인 지식을 얻을 수 있도록 지원합니다.
사용자 맞춤형 콘텐츠 제공을 통해 불필요한 정보의 노출을 줄이고, 반려동물에 집중된 소통과 교류의 질을 향상시킵니다.
반려동물 커뮤니티를 활성화하여, 반려동물을 사랑하는 이들이 함께 성장하고 발전할 수 있는 지속 가능한 생태계를 구축하는 것을 목표로 합니다.

📜 주요 기능 설명

회원가입, 로그인 및 로그아웃

일반 로그인과 소셜 로그인 기능
일반 회원가입과 소셜 회원가입 기능
- Gmail 인증을 통한 회원가입
이메일 찾기, 비밀번호 찾기 및 변경 기능
- Gmail 인증을 통한 비밀번호 변경 기능
JWT를 이용한 인증/인가 구현
- access token, refresh token 이용
로그아웃 기능
- 로그아웃 시 해당 계정 인증 토큰 만료 및 로그아웃 기능

홈 화면 (사이드바, 무한 스크롤)

모든 화면에서 이용할 수 있도록 사이드바 기능
JS를 이용해 홈 게시물 무한 스크롤 기능

마이페이지, 유저페이지 기능

마이페이지
- 내가 업로드한 게시물 목록 보기 기능
- 내가 북마크한 게시물 목록 보기 기능
- 내가 멘션된 게시물 목록 보기 기능
유저페이지
- 유저가 업로드한 게시물 목록 보기 기능
- 유저가 멘션된 게시물 목록 보기 기능
- 유저 차단 기능
- 유저 팔로우 기능
- 유저 DM 보내기 기능

프로필

계정 정보나 반려동물 정보 확인 및 수정 기능
프로필 정보 공계 및 비공계 설정 기능
유저 차단 목록 확인 및 차단 해제 기능
회원 탈퇴 기능

검색

검색한 결과 클릭 시 유저 페이지 이동 기능

이름 검색
- 유저 반려동물 이름을 이용한 유저 검색 기능
유저 검색
- 유저 닉네임을 이용한 유저 검색 기능

게시글 탐색

FluffyTime 내에 업로드 되어 있는 전체 게시물을 보여주는 기능
- 썸네일 이미지를 통해 게시물 나열
- 썸네일 이미지 클릭 시 게시물 상세보기 기능

릴스 기능

영상 데이터 업로드 시, 자동 릴스 등록 기능
릴스 화면에서 업로드된 릴스 영상 보여주는 기능
릴스 영상에 대한 좋아요, 북마크 기능

게시글/댓글/답글 CRUD + 멘션 + 좋아요 + 북마크 기능

게시글 CRUD 기능
게시글 임시저장 CRUD 기능
각 입력 창에 @ 입력 후 사용자의 계정 입력하면 사용자 멘션 기능
게시글/댓글/답글에 좋아요, 북마크 기능
좋아요 목록 보기 기능

팔로우/팔로잉 기능

유저 간의 팔로우/팔로잉 기능
- 팔로우/팔로잉 버튼 클릭으로 팔로우/필로잉 작동

알림

댓글, 답글, 좋아요, 팔로우, 멘션에 대한 알림 전송 기능
알림 페이지에서 받은 알림 확인 기능
관리자에게 가입, 탈퇴한 유저 알림 기능
관리자에게 등록, 삭제된 게시물 알림 기능

DM

타 유저와 DM 나누는 기능
- 웹 소켓을 이용한 실시간 채팅 기능

🌳 프로젝트 폴더 구조

📦 main
 ┣ 📂 java
 ┃ ┗ 📂 com
 ┃ ┃ ┗ 📂 fluffytime
 ┃ ┃ ┃ ┣ 📂 domain
 ┃ ┃ ┃ ┃ ┣ 📁 admin
 ┃ ┃ ┃ ┃ ┣ 📁 board
 ┃ ┃ ┃ ┃ ┣ 📁 chat
 ┃ ┃ ┃ ┃ ┣ 📁 notification
 ┃ ┃ ┃ ┃ ┣ 📁 search
 ┃ ┃ ┃ ┃ ┗ 📁 user
 ┃ ┃ ┃ ┗ 📂 global
 ┃ ┃ ┃ ┃ ┣ 📁 auth
 ┃ ┃ ┃ ┃ ┣ 📁 oauth2
 ┃ ┃ ┃ ┃ ┣ 📁 common
 ┃ ┃ ┃ ┃ ┗ 📁 config
 ┗ 📂 resources
 ┃ ┣ 📂 static
 ┃ ┃ ┣ 📁 css
 ┃ ┃ ┣ 📁 image
 ┃ ┃ ┗ 📁 js
 ┃ ┣ 📂 templates
 ┗ 📜 application.yml

⚒️ 프로젝트 아키텍쳐

👨‍👨‍👦‍👦 개발 팀원 및 역할

팀명 : I1lI1I1l (As 바코드)

팀장 : 권건형

팀원 : 김유진, 김찬우, 윤유경, 지유빈

이름	역할
권건형	로그인 및 회원가입 기능 개발, 관리자 패이지 기능 개발, 태그 기능 개발
김유진	마이페이지 및 프로필 기능 개발, 유저페이지 및 유저 차단 기능 개발, DM 기능 개발
김찬우	검색 및 탐색 페이지 기능 개발, 팔로우 기능 개발
윤유경	게시물 및 임시 게시물 CRUD 기능 개발, 북마크 기능 개발, 릴스 기능 개발
지유빈	댓글 및 답글 CRUD 기능 개발, 좋아요 기능 개발, 알림 및 멘션 기능 개발

🌏 개발 환경

⚒️ 개발 도구

IntelliJ IDEA Professional

개발 언어

Java 21.0.4

👨‍🎨 프론트 엔드

Thymeleaf
HTML
CSS
JS

🖥️ 백엔드

Spring 6.1.6
Spring Boot 3.3.2
Spring Web
Spring JPA
Spring Data JDBC
Spring Security 6

🔐 인증 및 보안

JWT
Oauth2
Gmail-SMTP

💾 데이터베이스

MySQL 9.0.1
Redis 7.4.0
MongoDB 2.3.0

🗂️ 버전관리

Git 2.43.0
Github

📜 문서관리

Notion

🌐 DevOps

Docker 27.2.0
AWS S3
AWS EC2
AWS Route53
Nginx 1.24.0

기술	적용 이유
JWT	💡 SNS는 많은 사용자 데이터를 처리해야 하므로 서버 부하가 큰데, JWT는 세션을 따로 관리하지 않아 서버 부하를 줄입니다. 또한, 서명된 토큰과 HTTPS로 보안성을 강화해 사용자 정보의 무결성을 보장하므로 인증/인가 부분에서 JWT를 사용했습니다.
SSE(vs websocket)	💡 SSE는 서버에서 클라이언트로의 단방향 통신에 최적화되어 있어, 알림이나 이벤트 스트리밍과 같은 단방향 데이터 전송에 적합하며, 양방향인 웹소켓보다 더 간단하고 효율적입니다. 또한, SSE는 서버 리소스를 적게 사용하여 많은 사용자가 동시에 알림을 받을 때 더 효율적라고 판단하여 SSE를 사용했습니다.
Redis Pub&Sub(vs kafka)	💡 Kafka는 대용량 데이터 처리와 높은 확장성을 제공하지만, 실시간 채팅처럼 빠른 응답이 중요한 경우에는 메모리 기반의 Redis가 더 빠르고 효율적입니다. 또한, Kafka는 AWS에서 MSK로 서버를 구축해야 하고, MSK는 프리티어에 포함되지 않아 비용이 많이 드는 반면, Redis는 AWS 프리티어에서 사용 가능하여 이를 선택했습니다.
MySQL	💡 RDBMS 중에서 MySQL은 기본적으로 뛰어난 읽기 성능을 제공하며, InnoDB 스토리지 엔진을 통해 ACID 트랜잭션을 지원하면서도 빠른 읽기 성능을 유지합니다. 쿼리 캐싱과 인덱스 최적화도 잘 되어 있어 성능이 우수합니다. 이러한 이유로 SNS에 적합하다고 판단하여 MySQL을 사용했습니다.
Redis	💡 TTL을 설정하면 자동으로 임시 데이터를 삭제할 수 있어 불필요한 데이터를 제거하고, Redis의 메모리 기반 저장 방식 덕분에 데이터 접근 속도가 빠르며 성능 요구사항을 효과적으로 처리할 수 있어 Redis를 사용했습니다.
Mongo	💡 채팅방 내역 저장을 위해 MongoDB를 사용한 이유는 비정형 데이터를 효율적으로 처리하고, 스키마를 동적으로 변경할 수 있으며, 빠른 읽기 및 쓰기 성능을 제공하기 때문입니다. MongoDB는 대량의 데이터를 효율적으로 관리할 수 있는 반면, MySQL은 대규모 데이터와 빈번한 작업에서 MongoDB보다 성능이 낮을 수 있기에 MongoDB를 사용했습니다.