1. 공통 요구사항
기본
- 사용자는 회원가입과 로그인을 할 수 있습니다.
- 가입, 로그인, 인증 검사
- 사용자는 채널에 올라온 글을 볼 수 있습니다.
- 사용자는 가입자 목록을 볼 수 있습니다.
- 사용자는 가입자를 이름으로 검색을 할 수 있습니다.
- 사용자는 가입자의 정보를 볼 수 있습니다.
- 사용자는 포스트 혹은 가입자를 검색할 수 있습니다.
- 인증된 사용자는 자신의 정보를 변경할 수 있습니다.
- 인증된 사용자는 채널에 올라온 글을 볼 수 있습니다.
- 인증된 사용자는 채널에 포스트를 남길 수 있습니다.
- 인증된 사용자는 포스트를 좋아요 할 수 있습니다.
- 인증된 사용자는 포스트에 댓글을 남길 수 있습니다.
- 인증된 사용자는 자신의 알림 목록을 확인 할 수 있습니다.
- SPA 형태로 만들어주세요.
- 엉뚱한 페이지에 접속하면 404 페이지를 보여주세요.
보너스
- 사용자는 현재 접속 중인 사용자를 볼 수 있습니다.
- 인증된 사용자는 다른 가입자에게 메시지를 보낼 수 있습니다.
- 인증된 사용자는 자신에게 온 메시지 목록을 확인 할 수 있습니다.
- 인증된 사용자는 특정 사용자와의 메시지 대화 내역을 확인 할 수 있습니다.
- 인증된 사용자는 프로필 이미지 변경 및 포스트를 작성할 때 이미지를 첨부할 수 있습니다. 파일 업로드를 구현해보세요.
- 다크 모드를 적용해보세요.
2. 페이지 별 요구사항
메인 페이지 (검색 결과 페이지)
- 사용자는 메인 페이지에 접근할 수 있다.
- 인증되지 않은 사용자: 로그인 버튼을 클릭하여 로그인 페이지에 접근할 수 있다.
- 인증된 사용자: 프로필 사진을 볼 수 있다. 등록하지 않은 경우 기본 이미지.
- 검색창에서 (채널) 검색을 통해 해당 (채널)의 전체 포스트 목록을 조회할 수 있다.
- 검색창에서 포스트 제목 또는 가입자의 닉네임을 검색하여 포스트 목록을 조회할 수 있다.
- 사용자는 조회된 포스트 목록을 세로방향으로 무한 스크롤하면서 볼 수 있다.
- 포스트 이미지를 클릭하면 포스트 상세 페이지로 이동한다.
- 각 포스트 하단에서 좋아요 버튼과 개수를 볼 수 있다.
- 인증된 사용자: 각 포스트 하단에서 좋아요 버튼을 토글할 수 있다.
좋아요 ON: 해당 포스트를 개인 좋아요 리스트에 저장한다.
좋아요 OFF: 해당 포스트를 개인 좋아요 리스트에서 제거한다.
- 인증된 사용자는 포스트 작성 버튼을 볼 수 있다.
포스트 작성 버튼 클릭 시 작성 페이지로 이동한다.
사용자 페이지
- 모든 사용자는 사용자 페이지에 접근할 수 있다.
- 모든 사용자는 해당 페이지 사용자의 정보를 확인할 수 있다.
- 사용자 이름을 확인할 수 있다.
- 팔로워 수를 확인할 수 있다.
- 팔로잉 수를 확인할 수 있다.
- 사용자 페이지에 접근한 경우
- 인증된 사용자
- 인증되지 않은 사용자
- 사용자는 탭을 클릭해 해당 사용자가 등록한 포스트를 확인할 수 있다.
- 사용자는 포스트를 클릭해 해당 포스트의 상세 페이지로 이동할 수 있다.
로그인 페이지
- 사용자는 로고를 확인할 수 있다. 로고를 클릭하면 메인 페이지로 이동
- 사용자는 아이디를 입력할 수 있다.
입력한 아이디가 이메일 형식인지 유효성을 검사한다.
- 사용자는 비밀번호를 입력할 수 있다.
- 사용자는 로그인 버튼을 클릭하여 로그인을 완료할 수 있다.
- 로그인 실패
- 아이디를 입력하지 않은 경우: “아이디를 입력하세요” 문구를 확인할 수 있다.
- 비밀번호를 입력하지 않은 경우: “비밀번호를 입력하세요” 문구를 확인할 수 있다.
- 가입된 사용자가 아닌 경우: “아이디와 비밀번호를 확인하세요” 문구를 확인할 수 있다.
- 사용자는 회원가입 버튼을 클릭하여 회원가입 페이지로 이동할 수 있다.
회원가입 페이지
- 모든 사용자는 회원가입 페이지에 접근할 수 있다.
- 모든 사용자는 회원가입에 필요한 정보를 입력할 수 있다.
- email을 입력할 수 있다.
- password를 입력할 수 있다.
- name을 입력할 수 있다.
- 필수 정보를 입력하지 않고 작성 완료 버튼을 누를 시, 문구를 확인할 수 있다.
ex) 비밀번호를 입력하지 않은 경우, “비밀번호를 입력해주세요” 문구를 볼 수 있다.
- 작성 완료 버튼 클릭 시, 중복된 email이 있는 경우
“이미 존재하는 email 입니다.” 라는 문구를 알림창(alert)로 보여준다.
- 사용자는 작성완료 버튼을 클릭해 회원가입을 요청할 수 있다.
- 사용자는 취소 버튼을 클릭해 회원가입을 취소할 수 있다.
- 클릭 시, “회원가입을 취소하시겠습니까”라는 문구를 보여준다.
- “예”를 클릭 시, 로그인 페이지로 이동한다.
- “아니오”를 클릭 시, 페이지는 유지된다.
- 회원 가입 완료 시, 자동으로 로그인을 진행한 뒤, 메인 페이지로 이동한다.
포스트 상세 페이지
- 사용자는 자신이 작성한 게시글일 경우 수정, 삭제 버튼을 확인할 수 있다.
- 사용자는 수정 버튼을 클릭하여 게시글 작성 페이지에서 게시글을 수정할 수 있다.
- 사용자는 삭제 버튼을 클릭하여 “정말로 삭제하시겠습니까?”에 대한 질문을 받은 뒤,
예 혹은 아니오로 해당 게시글을 삭제하거나 취소할 수 있다.
- 사용자는 좋아요 버튼을 클릭하여 개인 페이지에 해당 포스트를 저장할 수 있다.
- 사용자는 해당 포스트의 제목, 글, 이미지를 확인할 수 있다.
- 로그인한 사용자:
자신의 프로필 사진과 이름, 댓글 작성 요소가 있는 박스 내에서 댓글을 입력할 수 있다.
- 사용자는 가장 오래된 댓글을 단 사용자의 프로필 사진, 이름, 댓글을 단 시간,
댓글 내용을 확인할 수 있다.
- 사용자는 자신이 단 댓글에서 수정 버튼을 클릭하여 댓글 내용을 수정할 수 있다.
- 사용자는 자신이 단 댓글에서 삭제 버튼을 클릭하여 해당 댓글을 삭제할 수 있다.
- 사용자는 뒤로가기 버튼을 클릭하여 결과 페이지 또는 개인 페이지로 이동할 수 있다.
포스트 작성 및 수정 페이지
- 인증된 사용자만 작성 및 수정 페이지에 접근할 수 있다.
- 사용자는 이미지 파일을 포스트에 업로드할 수 있다.
- 사용자는 드래그 앤 드랍으로 파일을 업로드 할 수 있다.
- 파일을 2개 이상 선택해 드래그 앤 드랍 시, 경고 문구를 보여준다.
- 사용자는 파일 선택 버튼을 클릭해 파일을 업로드할 수 있다.
- 파일을 2개 이상 선택 시, 경고 문구를 보여준다.
- 사용자는 업로드한 이미지 파일을 제거할 수 있다.
- 사용자는 이미지 파일 업로드 도중에 취소할 수 있다.
- 사용자는 포스트의 제목과 내용을 입력할 수 있다.
- 사용자는 포스트의 제목과 내용을 수정할 수 있다.
- 사용자는 채널을 반드시 선택해야만 한다.
- 작성 완료 버튼을 클릭하면 포스트가 선택한 채널에 등록된다.
- 필수 작성 요소를 미완료한 상태로 작성완료 버튼을 클릭하면 경고 문구가 보인다.
- 제목(또는 내용)을 입력하지 않은 경우 “제목(또는 내용)을 입력해 주세요”
- 채널을 선택하지 않은 경우 “채널을 선택해주세요”
- 이미지를 업로드 하지 않은 경우, “업로드할 이미지가 없습니다”