프론트엔드 파트

모노레포 도입 및 운영

• 개요
• 휴톰의 여러 프로젝트를 하나의 코드베이스로 통합 관리하기 위해 모노레포를 도입
• 패키지 매니저를 비교 분석하여 Turborepo를 도입하였고, 이를 통해 패키지 간의 의존성을 관리하고 빌드 시간을 단축

• Trunk Based Development + Feature Flag
• Feature Flag를 통해 각 환경(개발, 스테이징, 프로덕션)에서 기능의 제공 여부를 관리하여 Trunk 브랜치에서 항상 안정적인 배포가 가능하게 유지
• Next.js의 미들웨어를 사용해 현재 환경에 따라 동적으로 Feature Flag를 관리하였고, 이를 통해 다양한 환경에서 안정적인 기능 제공 가능한 상태 유지

지속적인 통합 및 배포(CI/CD) 시간 단축

• Cloud Remote Caching 도입
• 불필요한 빌드와 테스트에 대해 캐시를 사용하여 CI 시간을 평균 2분대로 단축하여 프론트엔드 개발자들의 작업 시간이 단축되었고, 개발 효율성을 크게 향상시키는데 기여

• E2E 테스트
• Feature Flag의 안정적인 동작(예상대로 작동하는지 검증하고, 안정적인 서비스 제공을 보장)을 확인하기 위해 Cypress를 사용하여 E2E 테스트 작성

hVAT

(협력 팀을 위한 내부 솔루션 개편)

2023.06 ~ 2024.04

프로젝트 리드 및 개발자

• 프로젝트 초기 개발 및 설계 주도
• 기존 서비스 리뉴얼을 위해 초기 설계를 진행하고 개발을 주도
• 프로젝트를 담당하는 인원이 혼자에서 3명으로 증가하면서 협업과 리딩을 맡음

• 협업 조직 및 작업 분배
• 주기적인 회의를 통해 협업 방식을 논의하고, 팀원들의 역량을 파악하여 작업을 효율적으로 할당
• 문서화 작업을 통해 프로젝트의 이해도를 높이고, 향후 유지보수를 용이하게 함

• 칸반 보드 도입 및 운영 이슈 관리
• Data Management(DM) 팀의 운영 이슈를 효율적으로 관리하기 위해 칸반 보드 도입
• 실시간 작업 상태 파악과 우선순위 관리를 지원

프론트엔드 개발

• Zustand와 React-Query를 도입하여 애플리케이션의 전역 상태 관리를 최적화 함

• Zustand로 클라이언트 상태를 효과적으로 관리하고, React-Query의 Query Key 구조화를 통해 코드 가독성과 유지보수성을 크게 향상

• OpenAPI Specification (OAS) Generator를 활용하여 API 스펙을 자동 생성하여 개발 기간을 단축하고 개발 효율성을 향상

• GCP의 Cloud Load Balancer와 Cloud Storage를 이용한 정적 웹 호스팅 방식으로 프론트엔드 배포 전략을 개선

백엔드 개발

• 도메인 객체 생성 시 발생할 수 있는 사이드 이펙트를 분석하고, 유닛 테스트 케이스를 설계하여 사이드 이펙트를 최소화

• 비즈니스 로직을 리팩토링하여 코드의 가독성과 유지보수성을 향상시켰으며, 지속적으로 테스트 자동화 도구를 활용하여 유닛 테스트를 실행

• OpenAPI Specification (OAS)를 활용하여 프로젝트 초기부터 API 엔드포인트, 요청 및 응답 형식 등을 명확히 정의하고 관리

• GCP의 Compute Engine에서 웹 애플리케이션 서버 배포 방식을 GCP Cloud Run 및 Cloud Build를 이용한 서버리스 아키텍처로 전환

인프라 서비스 관리

• 개발, 스테이징, 프로덕션 환경으로 구분하여 프론트엔드와 백엔드를 서비스 구축.

• IAM을 활용하여 수술 영상 등의 프라이빗 자원 접근을 안전하게 관리.

• 콜드스타트 문제를 해결하기위해 Cloud Scheduler를 활용하여 특정 서비스의 인스턴스를 워킹 타임에 맞춰 가동.

개발 환경 개선

• OpenAPI Specification를 도입하여 API 스펙 명세화를 통해 협업을 원활하게 진행하고, 명확하고 일관된 API 인터페이스 제공.

SurgGram

2024.06 ~ 진행중

프로젝트 회고

• WIP

인프라서비스 관리

• WIP

프론트엔드 개발

• WIP

PIIP Intranet

(특허관리 백 오피스)

2022.03 ~ 2023.05

프론트엔드 개발

• Next.js를 활용하여 클라이언트 및 어드민 프로젝트에 참여하였고 사용자 경험 개선 및 렌더링 최적화에 기여

• Lerna를 사용한 Monorepo 환경에서의 프론트엔드 개발을 주도하여 코드 공유와 관리의 효율성을 높이고, 일관성을 유지하면서 다양한 프로젝트에 참여

• Apollo Client와 GraphQL을 통한 데이터 관리에 중점을 두었고 필요한 데이터만을 효율적으로 요청하여 오버페칭과 언더페칭을 방지

• Ant Design와 styled-components를 결합하여 일관된 UI를 제공

• 클래스컴포넌트를 함수 컴포넌트로 리팩토링 업무 수행

Markiny

(온라인 상표 컨설팅 및 출원 서비스)

2022.03 ~ 2022.06

프론트엔드 개발

• Next.js를 활용하여 클라이언트 및 어드민 프로젝트에 참여하였고 주로 사용자 경험을 개선하고 효율적인 렌더링을 위해 Next.js를 활용

• Lerna를 사용한 Monorepo 환경에서의 프론트엔드 개발을 주도하여 코드 공유와 관리의 효율성을 높이고, 일관성을 유지하면서 다양한 프로젝트에 참여

• Apollo Client와 GraphQL을 통한 데이터 관리에 중점을 두었고 필요한 데이터만을 효율적으로 요청하여 오버페칭과 언더페칭을 방지

• Ant Design와 styled-components를 결합하여 일관된 UI를 제공

LTS3

(사내 구성원 전용 백 오피스)

2021.08 ~ 2021.12

백오피스 개발

• Linux Crontab을 이용하여 연차(휴가) 관리 모듈의 일정 관리 및 자동화 알림 기능 개발

• Laravel 프레임워크와 MySQL 데이터베이스를 활용하여 안정적이고 확장 가능한 서버 개발

• 프로젝트를 MVC 패턴에 기반하여 설계 및 개발하였으며 이를 통해 코드의 모듈화와 유지보수성을 강화

• 사용자 경험을 고려하여 퍼블리싱 및 클라이언트 사이드 작업을 수행하였으며 jQuery를 활용하여 동적이고 직관적인 사용자 인터페이스를 제공

Frontend Mentor

리액트 10 주 스터디 멘토

• 스터디의 멘토로 참여하여, 스터디원들의 리액트 프로젝트 및 코드에 대한 코드리뷰를 수행

• 개인적인 면담을 통해 스터디원들의 취업과 이직에 관한 상담을 진행

• 개발 경험을 바탕으로 스터디원들에게 적절한 개발 방향성을 제시하고, 기술적인 도움과 조언을 제공