<aside>

가천대학교 코코네스쿨 도슨트 팀에서 프론트엔드 개발자로 참여하게 된 AI 기록 비서 ‘Looi’입니다. 일기, 꿈, 일정, 메모까지 모든 기록을 한 곳에서 자동으로 분류 및 저장해 주고, 이 기록을 토대로 한 주 돌아보기 등의 인사이트와 콘텐츠를 제공해 주는 서비스입니다.

</aside>

프로젝트 구조

• 웹앱패키징: 기획 변경이 잦은 환경에서 앱 배포 사이클을 최소화하기 위해 웹 기반으로 구현하고, 푸시·위젯 등 네이티브 기능 확장을 고려하여 WebView 기반 네이티브 앱 패키징을 적용했습니다. Android에서 PWA로 푸시를 구현했으며, 이후 iOS의 Web Push UX 제약을 고려해 iOS 네이티브 패키징을 추가로 도입했습니다. • Vue: 초기 프론트엔드 1인 개발 환경에서 빠른 구현과 유지보수를 위해 의사결정 비용이 낮은 Vue를 선택했습니다. • Nuxt: SNS 공유 시 미리보기(OG 태그)가 필요하여, 동적 메타 태그 설정과 SSR을 지원하는 Nuxt를 도입했습니다.

담당 업무

• 프로젝트 초기 세팅 및 CI/CD 구축

  • Docker 기반 CI/CD 구축

    

  • Axios 인스턴스 composable화 및 interceptor 처리, TypeScript로 BaseResponse 정의

• 로그인 및 회원가입 로직 구현
  • middleware + cookie를 이용하여 자동 로그인 로직 구현
  • Kakao ∙ Apple 소셜 로그인
• 동적 메타 태그 설정을 위한 SSR 전환 (관련 글)
• 웹앱패키징 진행
  • iOS는 네이티브로 WKWebview 이용하여 세팅 및 푸시 기능 구현

트러블슈팅

[Problem]

마이페이지 탭 전환 시 아래 문제로 콘텐츠 탐색 흐름이 끊기며, 서비스 사용 경험이 저하되는 문제가 있었습니다.

• ① 데이터 재요청으로 인해 빈 리스트가 노출되며 깜빡임 발생
• ② 다수의 고해상도 이미지 로딩으로 Layout Shift가 극대화