외국인과 함께하는 커뮤니티 사이트
(회원가입 후 , 모임가입, 모임개설, 회원정보 수정 등을 하실 수 있습니다.)
프로젝트 github 주소 : https://github.com/OZ-Coding-School/oz_01_collabo-005
플로우 차트 : https://www.figma.com/design/KGIUTKtbwi9QF4FffiwRFk/Front---%EA%B3%84%ED%9A%8D?node-id=0-1&t=wGdERNGrS51pXI32-1
한국에 살고있는 외국인들과 한국인들의 소통공간을 만드는 사이트입니다. (참고사이트: 트레바리, 당근마켓)
2024년 3월 26일 ~ 2024년 4월 30일
React, css, styleComponent, TypeScript, Axios, Bootstrap
사업개발팀(기획자1명), 백엔드3명, 프론트엔드3명
- 최신 모임 10개와 모임을 카테고리별 모임을 메인화면에서 보여주는 기능
- 회원가입 및 내 정보수정 기능
- 메뉴에서 모임개설하기를 통해 모임을 만드는 기능
- 모임 가입 + 모임화면에서 게시글을 쓰고, 일정을 만드는 기능
1.mp4
- 모임 홈 화면에서 해당 모임의 최신 게시글, 일정, 멤버 보여주는 기능
- 사람모양 버튼을 눌러 가입 멤버 모두를 보여주는 기능
- 앨범에 이미지 업로드를 할 수 있는 기능
- 게시글에 댓글을 쓰는 기능(수정 및 삭제도 가능)
- 마이페이지(나의 모임)을 통해 가입한 모임과 그 모임의 게시글을 볼 수 있는 기능
- 게시판, 앨범, 일정, 홈 등을 볼 수 있는 "모임 화면” 과 내가 속한 모임과 그 속한 모임의 게시글을 볼 수 있는 "나의 모임 화면"을 만들었습니다. (페이지 2개
- 게시글을 자세히 볼수있는 페이지를 만들었습니다.
- “Navbar” 를 만들었습니다.
- 페이지의 UI를 만들고, 서버와 통신을 통해서 사용자의 정보를 가져와 화면에 보이게 만드는 부분을 수행했습니다.
- flex와 Grid를 통해 정렬을 맞추고 조화롭게 배치하였습니다.
- Media Query 적용을 통해 반응형으로 화면크기가 달라져도 화면이 깨지지 않도록 구현했습니다.
- React 실습이 많이 부족한 상태에서 React를 사용하는 경험을 통해 React가 익숙해졌고, HTTP통신을 할 수 있게 되었습니다.
- 사용자가 보기에 깔끔하고 사용하기 편한 "디자인"에 대해 관심이 높아졌습니다.
- 깃허브를 이용해 협업하는 방법과 백엔드와 기획자 분들과 소통하는 법을 배웠습니다.
- 조건부 렌더링에 익숙해졌습니다.
- 프로젝트 폴더를 구조화하는 법을 배웠습니다.