내가 맡은 프로젝트 시안 SSR

조주영·2021년 10월 16일
0

메인

페이지 화면

  1. 사용자가 검색한(혹은 선택한?)지역의 결과를 filter처리하여 불러온다.

  2. (화면의 게시물수는 디자인에 따라) 해당 페이지에 게시물을 보여준다.
    방식:스크롤 or 페이지

페이지 이벤트

  1. 사용자가 제목(혹은 보러가기 버튼)을 클릭하면 게시물의 상세정보페이지로 이동한다.
    - API 호출: POST posts{postId}
    - Response: Post

    {
       "likes": Like[],
       "comments": Comment[],
       "_id": String,
         "image": Optional<String>,
         "imagePublicId": Optional<String>,
       "title": String,
       "channel": Channel,
       "author": User,
       "createdAt": String,
       "updatedAt": String
     		}	
  2. 사용자가 좋아요(하트)를 클릭하면 게시물의 좋아요가 올라간다.(다시 누르면 내려감)

    • API 호출: POST posts{postId}

    • API 요청(Request Body):

      {
          "postId": String
      }```
    • Response:like

      {
      	"_id": String,
      	"user": String, // 사용자 id
      	"post": String, // 포스트 id
      	"createdAt": String,
      	"updatedAt": String
      }
  1. 사용자가 댓글 버튼을 클릭 -> 두 가지 구현방법
    • 메인 화면에서 댓글 작성 가능? -> 메인화면에서 댓글목록 까지 처리하여 보여주고,(열고 닫는식...?) 근데 이러면 게시글도..?
    • 아니라면 상세 페이지로 넘기기. ▶post와 comment로 api는 따로 분류되어있음.

추가기능

포스팅의 프로필 클릭시 이벤트처리

  • 프로필 사진 및 상대방의 평점보기?

구현에 생각 해 볼 것

헤더 검색에서 데이터를 문자열 처리와 어떻게,어디까지 넘겨 올 것 인가?
최대 포스팅은 10개인데, 포스팅 배치는 어떻게 할 것 인가?

예외처리

비 로그인 상태에서 검색 및 쿨릭이벤트발생시

  • 애초에 첫 화면부터 로그인을 시키고 통과?
  • 댓글기능은 제한.(동행 참여엔 실명인증 필요)
  • 좋아요 기능은...?

메뉴바

페이지 이벤트

  1. 오른쪽(왼쪽) 상단의 메뉴버튼을 누르면 열고 닫는다.
  2. 내 정보 수정, 내가 쓴 글 좋아요 누른글을 누르면 각 페이지로 이동
  3. "대화 중 인 방"을 누르면 채팅 페이지로 이동
  4. 하단 로그아웃을 누르면 사용자 로그아웃
  5. 하단
    버튼 클릭시 메뉴바 닫힘

예외처리

사용자가 로그인을 안 했을 때 두 가지 방법

  • 따로 창 구현.
  • 버튼 display:none

채팅목록, 채팅방

  1. 채팅 목록을 불러온다.

  2. 해당 채팅을 누르면 채팅을 불러온다.

  3. 채팅으로 대화한다.

  4. 채팅 목록 우측 나가기 버튼을 눌러 채팅목록 에서 나간다.

  5. 채팅 목록 안 채팅방 이름 옆우측 나가기 버튼을 눌러 채팅방에서 나간다.

    고민할 것

  • 좋은 기능이나 필수기능은 아님. 구현순서 잘 정할 것
  • 구현 해 본적이 없어 견적이 잘 안나온다. WebSocket을 이용한 채팅? 따로 공부필요.
  • 구현 한다면 채팅방 생성을 어디서 해줄지? 둘 다?

    상세페이지

    • 동행이 확정된 사람들만 채팅초대
    • 댓글 단 사람에게 채팅초대
    • 좋아요 단 사람에게 채팅초대

    채팅목록

    • 내가 쓴 글을 불러오는 작업이 필요
profile
꾸준히 성장하기

0개의 댓글