Front-End Developer
개발 2021.11 ~ 2021.12
🔗 Links
Github
📜 서비스 내용
동아리 운영진을 위한 동아리 공지/정보 제공 및 동아리 운영 관리 서비스입니다.
현재 위 서비스에서 제공하는 핵심 기능 3가지입니다.
- (운영진) 해당 공지가 필요한 동아리원에게만 공지하기 (동아리원) 내게 필요한 공지만 모아보기
- 동아리 내의 정보 공유 커뮤니티
- 회원 리스트 한 번에 모아보기
현재는 [우리 동아리만을 위한 모바일 공간]을 개발 중이며,
[동아리 내 커뮤니티 서비스 확대]을 거쳐 [모든 동아리의 연결 동아리 포털 서비스]를 최종 목표로 계획을 세우고 있습니다.
🛠 기술 스택
- React Native, TypeScript
- Redux-toolkit, RTK query
🖥 개발 내용
Screen Navigation 구조 설계
웹 환경과 달리 모바일에서는 네비게이터가 존재하고, 여러 종류의 네비게이터를 함께 사용할 수 있었습니다. 좋은 사용자 경험을 제공하기 위해서 Flow Chart를 분석하고 Screen Navigation 구조를 설계하였습니다.
커스텀 애니메이션
디자이너가 의도한 애니메이션에 맞는 라이브러리가 존재하지 않아 직접 구현하였습니다.
- 메인 화면의 커버 사진 하단으로 스크롤 시, 헤더가 올라가며 사진은 흰색으로 변환
- 커뮤니티와 공지 탭의 헤더 헤더 누를 시, 커뮤니티와 공지의 게시글 카테고리 리스트가 dropdown 형태로 내려옵니다. 내비게이션 구조 상 해당 스크린의 헤더를 직접 사용하지 못하고, RootNavigation의 헤더를 커스텀하여 전역 store에서 데이터를 받아 렌더링하였습니다.
- 스페이스 전환 메인 화면에서 스페이스를 누를 시 사용자의 스페이스 리스트가 왼쪽에서 오른쪽으로 노출됩니다. drawer을 사용하지 않은 이유는 스크린 전환이 아닌 스크린은 유지한 채 데이터 변경만 발생하기 때문입니다.
💡 성장 경험
모바일 환경에 대한 이해
네비게이션 설계 및 사용자 인터렉션에 대해 학습하면서 모바일 환경에 대한 이해도를 높였습니다. 특히 화면 전환과 관련한 정보를 중점으로 학습하였습니다.
비개발 직군과의 협업
spacer 팀은 기획1, 디자인1, 백엔드1, 프론트엔드1 로 총 4명으로 구성되어 있습니다. 이 4명 모두 기획 단계부터 함께 참여했으며, 개발 과정에서도 끊임없는 대화를 나누었습니다. 기술적으로 해결할 수 있는 문제와 그렇지 않은 문제에 대해 함께 논의하며 서비스를 발전시켰습니다.
단순히 기능만 구현하는 것이 아닌, 서비스의 비즈니스를 이해하고 코드에 가치를 담으려 노력하였습니다.
👀 서비스 화면
🏆 수상
- 원티드가 주관한 대규모 해커톤 [해, 커리어] 3등 수상