2주 프로젝트 발표 대본

Jaemin Jung·2021년 9월 6일

2주 Project

목록 보기
10/10

안녕하십니까 코든램지팀의 발표를 맡은 정재민입니다.

저희의 프로젝트 명은 옷장을 부탁해입니다.
발표를 시작 하도록 하겠습니다.

첫번째 서비스 소개 및 기획 의도입니다.

옷장을 부탁해는 패션에 관심이 많은 유저들을 타겟으로 한 패션 커뮤니티 서비스입니다.

여러분들은 갑자기 소개팅이나 중요한 약속이 잡혔을때 어떻게 코디해야 할지 몰라서 옷장을 뒤져본 적이 있으신가요?

아니면 코디를 확인받고 싶은데 주변 지인에게 물어보기는 부끄러우신가요?

저희 옷장을 부탁해에서는 수많은 회원분들이 당신의 코디를 평가 해줍니다.

유저는 이미지를 첨부한 게시물의 좋아요와 싫어요를 통해 본의 코디를 평가 받을 수 있습니다.

또한 댓글을 통해 피드백을 받을 수 있습니다.

그리고 여러 패션 고수들의 게시물로 코디를 참고 하실수 있습니다.

패션에 관심있는 유저들의 커뮤니케이션으로 유저가 이용하면서 패션 센스를 키울 수 있는 커뮤니티를 만들었습니다.

저희 코든램지 팀을 소개하겠습니다.

저희 코든램지의 팀장이신 이윤근 팀장님은 Backend를 맡아주셨습니다.
저희 서비스의 핵심 기능인 이미지 업로드 기능을 구현해주셨고,
토큰 인증을 통한 보안기능을 구현해주셨습니다.
이외에도 스키마구성과 유저 정보 게시물에 대한 컨트롤러를 구현 해주셨습니다.

frontend 담당이신 강주현님은
전반적으로 와이어 프레임 구성 및 구현과 UI, UX디자인을 맡아주셨고,
네비게이션바, mypage, 회원 정보 수정 페이지
게시글 작성 / 수정 페이지를 구현 해주셨습니다.

마찬가지로 frontend 담당이신 위석량님은
상태관리 및 컴포넌트 에러 핸들링을 맡아주셨고,
좋아요 싫어요, 유효성검사, 회원가입 페이지 유효성 검사 기능을 구현 해주셨습니다.

마지막으로 Full Stack을 맡은 저는,
프론트엔드에서는 로그인페이지와, SPA 환경을 세팅하였고,
백엔드에서는 sequelize와 기초데이터 구축 및 게시물 컨트롤러 구현,
aws 배포를 담당하였습니다.

각자 맡은 역할 이외에도 팀원이 어려운 상황을 겪었을때에는 서로 힘을 합하여 해결해나갔습니다.

다음으로 옷장을 부탁해에서 사용된 스택입니다.

프론트엔드는 리액트를 바탕으로 진행 되었습니다. 상태 관리를 위해 리액트 훅스를 사용하였고,

로그인 유지 기능을 위해 리액트 쿠키를 사용하였습니다.

스타일드 컴포넌트로 ux와 ui디자인을 작성하였습니다.

서버는 노드js를 기반으로 express를 통해 구축하였고,

시퀄라이즈를 이용해 mvc 패턴으로 구현하였습니다.

그리고 json 웹토큰을 이용해 토큰 인증을 구현하였습니다.

마지막으로 배포는 aws 라우트53과 클라우드 프론트를 이용해 https 환경을 구축했습니다.

다음으로 시연 영상입니다.

옷장을 부탁해에 최초 접속시 메인페이지에서 유저가 올린 게시물을 확이할 수 있습니다.

저희의 첫번째 기능은 유저 권한입니다.

비로그인 상태에서 좋아요 싫어요 기능과 댓글기능을 이용할때 로그인 후 이용하세요 라는 경고창이 뜹니다.

로그인을 하기위해 회원가입을 해보겠습니다.

회원가입을 할때에는 유효성 검사를 실시하고, 프로필 이미지 첨부가 가능합니다.

다음은 로그인을 진행하겠습니다.

로그인 상태에서는 네비게이션 바 새글작성, 유저 버튼으로 변경됩니다.

로그인을 하였으니 다른 게시글에 댓글과 좋아요 버튼을 누를수 있습니다.

게시글을 작성 해보겠습니다.

게시글을 수정도 가능합니다.

마이컨텐츠에서는 유저 본인이 작성한 게시글을 확인할 수 있습니다.

마이페이지에서는 회원 정보 수정이 가능합니다.

마지막으로 로그아웃을 해보겠습니다.

옷장을 부탁해 서비스의 개선할점은 시간내에 구현 못한 어드벤스드 기능 입니다.

소셜 로그인 기능 추가와 모달 창 구현

게시글 평점 기능과 해시태그 기능 구현을 이루지 못했습니다.

끝까지 들어주셔서 감사합니다.

시연 순서

1.비로그인 -> 게시글
2.게시글 수정 이나 댓글 안되는 것 확인
3.로그인 -> 회원가입(유효성검사, 이미지 파일, 중복검사)->메인페이지
4.메인페이지 ->게시글(댓글, 좋아요) -> 게시글 작성 -> 수정 -> 게시글 -> 로고 -메인페이지
5.메인페이지에서 게시글 작성한거 잘들어왔는지 확인
6.다른 게시글 들어가기
7.마이 컨텐츠페이지 들어가서 내 그 들어왔는지 확인
8.회원정보 수정 하기(중복검사 이미지 업로드 등등. .. ) ->메인페이지
9.메인페이지에서 로그아웃

profile
내가 보려고 쓰는 블로그

0개의 댓글