About Me
함께 : 사람들과 협업을 할 때 더 성장했던 것 같습니다.
성장 : 성장을 위해 다음과 같은 요소가 중요하다고 생각합니다.
- 개인의 의지보다 시스템이 중요하다고 생각합니다.
시스템을 조성하기 위해 스터디 등을 운영하고는 합니다. (2024 첫 스터디 회고 링크)
- 재미를 추구하는 것 또한 지속적으로 개발을 해나가는데 중요한 요소라고 생각하고 이를 위해 작은 프로그램을 만들어 보려는 노력도 하고 있습니다.(크롬 확장 프로그램 개발)
Projects
2023.10.10 ~ 2023.12.05
**당신의 플레이어를 선택하세요!
픽플(pick your player, pickple)**
프론트엔드와 백엔드간의 협업 경헙을 쌓고, 기존 농구 경기 게스트 모집 및 크루 관리의 문제점을 개선하기 위한 프로젝트였습니다.
Team
프론트엔드 4명, 백엔드 4명
Skills
TypeScript, React, Axios, Mock Service Worker, Tanstack Query, Zustand, Emotion, ESLint, Prettier
Links
Contributions
- 깃허브 액션을 통한 배포 자동화 구현
- 기존에는 Vercel의 자동배포를 활용하기 위해 Forked 레포지토리에서 수동으로 원본 레포지토리의 Sync를 맞춰줘야했음
- Github Actions을 통해 이를 자동화함으로써 하루 최대 8번 정도로 진행하던 수동 배포 비용을 절약함
- 메인페이지 담당
- 백엔드의 restful api에 대한 요청 및 kakao auth api 각각의 엣지케이스들에 대한 분기처리 진행
- 페이지 구조 개선
- 컴포넌트가 거대해질수록 코드의 가독성이 떨어지는 문제 발생
- 페이지의 렌더링 로직을 커스텀 훅으로 분리함으로써 가독성 개선
- MSW 사용
- 백엔드와 개발 속도가 초반에 맞지 않아 api에 의존적인 기능들에 대한 개발이 지연되었음
- MSW를 사용해 백엔드 api 일정에 의존하지 않은 병렬적 개발 일정 진행
- 지도 페이지 담당
- Chromium 브라우저에서 GeoLocation Api의 속도 이슈 및 백엔드 api 호출 대기 시간 이슈를 해결하기 위해 css를 활용한 애니메이션 활용
- 웹 랜딩페이지 구현
- PWA를 사용하지 않았기 때문에 모바일 뷰에서는 서비스를 이용할 수 있도록 하고 웹에서는 프로젝트 소개페이지를 볼 수 있게 반응형으로 서비스 개선
- 페이지를 최대한 가볍게 하기 위해 스크롤 위치를 감지하는 코드를 제외하고 순수 css로 코드를 작성
- 퍼실리테이터의 롤을 맡아 회의 시간을 절감
- 팀원들간의 발언권이 치우지지 않도록 회의를 진행하여 내향적인 팀원들도 의견을 내기 쉽게함
- 일정 수준 이상 논의가 진행되지 않을 경우, 업무 데드라인을 고려해 타협점을 제시하고 팀원들의 합의를 이끌어 냄
2024.01.01~
진행 중
개인블로그
SSG 학습과, Next.js 14버전에 대해 공부하고, 개인적으로 공부하거나 회고한 내용에 대한 기록을 하기 위해 만들고 있는 개인 블로그 입니다.
Team
개인 프로젝트
Skills
Next.js, TypeScript, Tailwind CSS
Links
Contributions
- Next.js 14 를 활용하여 아티클을 정적으로 빌드하여 제공
- md 파일의 문법을 활용하여 아티클을 작성할 수 있게 만듦
- Next.js의 Static Exports를 사용해서 아티클 로딩 속도 개선
2023.09.01~
2023.09.27
FTA
프로그래머스 데브코스에서 협업 경험을 쌓고, 리액트 및 라이브러리들의 학습을 위해 진행했던 커뮤니티 사이트 제작 프로젝트입니다.