미리보기

노코드 웹사이터 빌더 인턴 프로젝트의 프론트엔드 개발자로서 참여했습니다.
해당 인턴 프로젝트 간, ci / cd 환경 구축 및 jira를 통한 애자일 학습 등 프로그래밍 외적으로도 경험을 많이 했습니다.

개발 프로젝트 소개

1. Socket을 이용한 다수의 편집자 편집 기능

2. 커스텀 drag event handler를 통한 웹사이트 편집 경험 향상

3. middleware를 통한 퍼블리싱 된 웹사이트 라우팅 및 데이터 fetching

스토어 서비스
Unity를 이용한 게임 개발을 통해 스토어 내 입점 / 검수/ 출시 프로세스 검증.
해당 검증을 통해 전사 대상 Stoveship을 통해 당해 KPI 점검.

1. 스토어 서비스 개편
   https://store.onstove.com/ko

2. 마이프로필 / 창작자 서비스 런칭
   profile: https://profile.onstove.com/ko/211972101/
   creator: https://creator.onstove.com/ko/sghooncho

3. 스튜디오 창작자 입점
   https://studio.onstove.com

4. 스토브앱v3 내 웹뷰 제공

   1. 웹 인증 -> 모바일 인증 전환 프로세스 구축

   2. 전 서비스 GNB내 배너 컴포넌트 노출 구축

5. 운영 및 개선 업무

스토어 서비스를 만들면서 다양한 국가 / 언어 별 노출 기준에 맞춰 개발하는 경험을 얻을 수 있었습니다

입점사 별 커스텀 가능한 게임 상세 페이지 구축을 위해 인턴 프로젝트에서 수행하였던 노코드 웹사이트 빌더의 경험을 빌렸습니다. 다양한 컴포넌트 제작으로 다양성을 주어 게임 색깔에 맞는 상세 페이지를 제공할 수 있었습니다.

변동 가능성이 큰 "가격"을 노출하는 서비스이다 보니 다양한 요소 및 api를 조합한 서비스 운영

1. 스토어 서비스 내 SSR 전환

2. Cloudfront 내 캐시키 조합을 통한 캐시 히트율 개선

3. 불필요한 api 호출 전수 조사 및 개선

기존 CSR 방식이던 스토어 서비스를 SSR을 섞는 방식으로 전환하는 프로젝트에 참여했습니다

캐싱 및 SSR 적용이 가능한 컴포넌트를 선별하였고 이를 토대로 작업하며 스토어 서비스 진입 경험 개선에 기여했습니다

1. 프로젝트 기획 및 동선 결정 초기 단계부터 참여

2. 프로젝트 개발

   • 창작자 설정 페이지 개발

   • 컴포넌트 다수 개발

   • 개발자 BVT 작성을 통한 품질 개선

3. 라이브 배포 후 운영 업무

스토브 앱 v3 내 스토어 웹사이트 웹뷰 게시 (2024.09 기준 앱 릴리즈 완료)

1. Js-bridge를 통해 기존 웹토큰 인증 프로세스 모바일토큰 인증 프로세스로 대체

2. GNB 내 배너 컴포넌트로 인한 설치 유도 동선 추가

   1. CDN 업로드를 통해 배포 필요 없는 배너 컨텐츠 변경

3. 크로스플랫폼 내 서비스를 고려하여 반응형 테스트 (모바일 웹뷰 디버깅 경험이 없는 조직 상대로 가이드 수행)

최초로 스토어 웹 서비스를 앱 내 웹뷰로 제공하는 프로젝트를 팀 내에서 리딩하였습니다.

Scheme 통신 및 Bridge 통신에 대한 이해를 쌓을 수 있었고 이를 서비스 로직 내 rebind하며 기존 웹 서비스에 영향 없이 작업할 수 있었습니다

GNB 내 앱 설치 유도 배너 작업 시에는 앱과 DeepLink 연동을 통해 Scheme path 기준으로 배너 클릭 위치 별 행동을 정의하였습니다. 이로 인해 사용자로 하여금 현재 보고 있는 위치를 앱(인앱 뷰 or 웹뷰)로 제공함으로써 편의성을 개선했습니다

1. 사내 Swiper 라이브러리 개선

   • legacy한 swiper 버전인 v.4의 loop 옵션 문제점 서비스에 맞게 커스텀하여 해소

   • https://github.com/nolimits4web/swiper/issues/7270

2. 다국어 적용

   • CDN을 통해 11개 언어의 다국어 파일 관리

   • properties를 통해 central dogma(형상관리 CDN)를 이용한 형상 관리 적용

3. 대량 DLC 대응

   • 대량 DLC 입점 게임들에 대한 UX 개선 및 Infinite Scroll 적용

개발자들의 사이드프로젝트를 등록하고 전시할 수 있는 공간.

프로젝트 당 유의미한 실사용자를 높이기 위해 서비스 출시 준비중

1. Server / Client 사이드 react-query 서비스 구축

   https://github.com/Exit-or-Die/Sitree-Client/pull/12/files

   
   서버사이드 환경에서 tanstack-query 사용 위한 커스텀 hydrate 훅 생성함으로써 서버사이드와 클라이언트 사이드에서 같은 api에 대한 중복 호출 리소스를 확인할 수 있었습니다

2. 프로젝트 단위 디자인 시스템 구축 -> 범용성 높고 재생산성 효율 증가

3. zod와 react-hook-form 사용한 프로젝트 등록 프로세스 로직 구축

사용 기술 스택: Next.js / tanstack-query

1. SW 개발 교육
2. 네트워크 기초 및 심화 학습
3. AWS IAM 관리 웹 프로젝트 수행

1. 중앙대학교 UMC 운영진 업무 수행
2. UMC node.js 파트장

포스트 코로나를 대비해 코로나 시대 대학생들 간 벌어진 정보의 격차 해소를 목표로 진행된 프로젝트입니다.

해당 프로젝트에서 프론트엔드 개발자로서 전체 서비스에 기여했습니다.

https://modern-corn-276.notion.site/Match-On-e552e73c6ac644569bc097622f1de0a3