<aside>
🎦
full_video.mov
</aside>
<aside>
🎦
RPReplay_Final1727841126.MP4
</aside>
🎥 반응형 웹 동작 시연 영상
<aside>
🎦
Responsive_video.mov
</aside>
🖥️ 각 기능 별 영상 및 화면
<aside>
💻
메인화면
mainPage_video.mov
- 헤더, 메인, 푸터로 구성되어 있습니다.
- 메인에는 인기글, 최신글이 3개씩 자동으로 다음 데이터로 넘어가고 있습니다.
- 지금 시간대의 이전 시간대 인기 태그 10개가 도출됩니다. 이때, 10개가 채워지지 않는다면 대체 태그(랜덤 태그)가 회색으로 도출됩니다.
- 이번주 최다 팔로워 목록이 10명 도출됩니다. 이때, 10명이 채워지지 않는다면 대체 유저(랜덤 유저)가 회색으로 도출됩니다.
회원가입, 비밀번호 찾기 및 로그인 화면
[회원가입]
- 회원가입 버튼을 누르면, 계정 또는 구글로 회원가입할 수 있는 버튼이 도출됩니다.
- 구글 아이디를 클릭하여 해당 서비스에 회원가입할 수 있습니다.
[회원가입 동작 영상]
signup_video.mov
[로그인]
- 로그인 버튼을 누르면, 계정 또는 구글로 로그인할 수 있는 버튼이 도출됩니다.
- 로컬 회원가입때 사용한 이메일과 비밀번호를 입력하여 로그인합니다.
- 구글 아이디를 클릭하여 해당 서비스에 회원가입할때 사용한 이메일로 로그인할 수 있습니다.
[로그인 동작 영상]
login_video.mov
[비밀번호 찾기]
[비밀번호 찾기 영상]
find_passwd_video.mov
인기글 전체보기 화면
- 메인화면에서 인기글이나 최신글의 전체보기 버튼을 클릭하면, 해당 정렬에 맞게 전체 게시글이 조회되는 페이지로 이동합니다.
- 맨 아래에 페이지네이션을 두어 다른 패이지로 쉽게 이동할 수 있습니다.
- 각 게시글을 클릭하여, 게시글 상세 페이지로 이동할 수 있습니다.
- 검색 기능을 통해 검색을 할 수 있습니다.
[검색 시]
내 블로그 화면
- 내 블로그 페이지로 좌측 프로필 부분은 화면을 스크롤 하더라도 같이 움직입니다.
[내 블로그 영상]
myblog_video.mov
팔로우 및 팔로워 화면
- 해당 프로필의 팔로우 목록이 조회됩니다.
- 팔로우 목록은 무한 스크롤로, 스크롤을 통해 데이터를 지속적으로 조회할 수 있습니다.
- 나의 팔로우 목록일 경우 '관리하기 버튼'이 도출되며, 클릭하면 각 팔로우를 삭제할 수 있는 버튼이 도출됩니다.
- 서로 팔로우된 관계라면, 각 팔로우 왼쪽 위에 서로 팔로우 표시가 뜹니다.
- 해당 프로필의 팔로워 목록이 조회됩니다.
- 팔로워 목록은 무한 스크롤로, 스크롤을 통해 데이터를 지속적으로 조회할 수 있습니다.
- 팔로워마다 아래 팔로우할 수 있는 버튼이 존재합니다. 해당 버튼을 클릭하여 즉각적인 팔로우 또는 팔로우 취소를 진행할 수 있습니다.
- 서로 팔로우된 관계라면, 각 팔로우 왼쪽 위에 서로 팔로우 표시가 뜹니다.
follow_follower_scroll_video.mov
- 팔로우, 팔로워는 무한 스크롤로 구현되었습니다.
알림 및 전체보기 화면
- 블로그 내의 모든 페이지에서 실시간 알림을 받을 수 있습니다.
- 알림은 새 팔로워, 내가 팔로워한 사용자가 작성한 새 게시글, 나의 게시글에 달린 댓글, 내가 쓴 댓글에 달린 답글, 내 게시글에 좋아요(당근) 일 경우 발생합니다.
- 실시간 알림은 최상단 우측에 뜹니다.
- 헤더에 벨모양 버튼을 클릭하면 최신 알림 5개를 확인할 수 있습니다.
- 실시간 알림을 통해 받은 알림을 확인하면 벨모양이 다시 원상복귀 합니다.
- 삭제 버튼을 통해 삭제하면 이전 알림이 보여집니다.
- 모든 알림을 확인할 수 있습니다.
- 알림의 종류별로 확인할 수 있습니다.
- 하단의 페이지네이션을 통해 원하는 페이지로 쉽게 이동할 수 있습니다.
- 알림을 삭제할 수 있습니다.
- 각 알림을 클릭하면, 해당 알림에 해당하는 내용으로 이동합니다. 팔로워 알림은 해당 유저의 블로그로, 새 게시글일 경우 해당 게시글로, 댓글일 경우 해당 댓글로 이동합니다.
[알림 영상]
notification_video.mov
글 작성 및 수정 화면
- 게시글을 작성할 수 있는 페이지로, 카테고리 / 태그 / 공개여부 / 제목 / 내용을 설정 및 작성할 수 있습니다.
- 게시글은 30초마다 자동 임시저장 됩니다.
- 임시저장 목록에서 지금까지 임시 저장된 글들을 확인하고 이어서 작성할 수 있습니다.
- 처음 게시글 작성 페이지에 들어가면 마지막으로 임시저장된 글을 이어서 작성할 것인지 묻습니다.
[게시글 작성 영상]
write_post_video.mov
[임시저장]
글 상세보기 화면
- 게시글 목록에서 특정 게시글을 클릭하면 상세 페이지로 이동합니다.
- 게시글의 제목, 내용, 카테고리, 작성자, 작성일자, 수정일자, 공감 수(당근 수), 조회수, 댓글 수 등이 조회됩니다.
- 게시글의 끝에는 해당 게시글의 태그들이 보여집니다.
- 자신의 게시글일 경우, 수정/삭제 버튼이 도출됩니다.
- 이때, 태그를 클릭하면 해당 태그를 사용한 게시글들을 보여주는 페이지로 이동합니다.
- 로그인한 사용자는 공감(당근)을 클릭하여 공감하거나 취소할 수 있습니다.
- 댓글은 등록순 또는 인기순으로 조회할 수 있습니다.
- 댓글을 작성하거나 답글을 작성할 수 있습니다.
- 댓글/답글은 로그인한 사용자만 작성할 수 있습니다.
- 자신의 댓글이나 답글일 경우 수정 또는 삭제할 수 있습니다.
글 관리 / 카테고리 관리 화면
category_manage.mov
- 카테고리 추가, 수정 및 삭제
- 카테고리는 0, 1레벨로 2가지 레벨이 존재하며, 1레벨일 경우 드래그 엔 드롭으로 다른 0레벨로 이동할 수 있습니다.
프로필 설정 화면
- 프로필 이미지, 닉네임, 비밀번호(로컬 로그인일 경우에만), 상태 메시지를 설정할 수 있습니다.
[프로필 설정 영상]
profile_setting_video.mov
회원탈퇴 화면
[로컬 로그인 사용자일 경우]
user_delete_video.mov
[구글 로그인 사용자일 경우]
user_delete_google_video.mov
</aside>