# 요람일지 > 프론트엔드 개발자 준희의 기술 블로그입니다. React, Next.js, TypeScript 등 웹 개발 지식과 프로젝트 경험을 공유합니다. 요람일지(https://yoramilji.kr)는 프론트엔드 개발자 MODAC의 개인 사이트입니다. React, Next.js, TypeScript 중심의 기술 블로그 글과 웹 개발·디자인 포트폴리오 프로젝트를 소개합니다. ## 블로그 - [도커 학습 가이드](https://yoramilji.kr/blog/3ca765fe-8b67-80fb-8c53-ec9f32b4d0ca): 기술 블로그 글 - [정처기 실기 프로그래밍: SQL](https://yoramilji.kr/blog/39e765fe-8b67-81c6-8808-ca486cb0b947): 정처기 실기 카테고리의 기술 블로그 글 - [정처기 실기 프로그래밍: C언어](https://yoramilji.kr/blog/39e765fe-8b67-8139-a50a-d6dd04f734df): 정처기 실기 카테고리의 기술 블로그 글 - [정처기 실기 프로그래밍: 자바](https://yoramilji.kr/blog/39e765fe-8b67-81ea-82b4-c1aea480b8af): 정처기 실기 카테고리의 기술 블로그 글 - [정처기 실기 프로그래밍: 파이썬](https://yoramilji.kr/blog/39e765fe-8b67-811c-ba96-eae72b0a2625): 정처기 실기 카테고리의 기술 블로그 글 - [정처기 실기 이론: 보안/신기술](https://yoramilji.kr/blog/39d765fe-8b67-8034-a4b0-e443b428668e): 정처기 실기 카테고리의 기술 블로그 글 - [정처기 실기 이론: 네트워크 & OS](https://yoramilji.kr/blog/39b765fe-8b67-8006-a138-e4217085cd10): 정처기 실기 카테고리의 기술 블로그 글 - [정처기 실기 이론: 데이터베이스](https://yoramilji.kr/blog/39b765fe-8b67-80b1-abc4-cfc758cb2d87): 정처기 실기 카테고리의 기술 블로그 글 - [정처기 실기 이론: 소프트웨어 개발](https://yoramilji.kr/blog/39a765fe-8b67-80f9-9eaa-ee460b39c324): 정처기 실기 카테고리의 기술 블로그 글 - [정처기 실기 이론: 소프트웨어 설계](https://yoramilji.kr/blog/39a765fe-8b67-8022-bac6-cac185840037): 정처기 실기 카테고리의 기술 블로그 글 - [오늘수영: 리스트 앱을 '내 주변 지도' 중심으로 갈아엎](https://yoramilji.kr/blog/39a765fe-8b67-812d-a15b-d32a3b74851d): 프로젝트 카테고리의 기술 블로그 글 - [오늘수영: 전국 602곳 수영장 데이터 적재 성공/실패기](https://yoramilji.kr/blog/39a765fe-8b67-80cb-80b2-f32088d02614): 프로젝트 카테고리의 기술 블로그 글 - [요람일지: 게시물별 조회수 (GTM/GA4)](https://yoramilji.kr/blog/397765fe-8b67-81bc-b545-c74479db6125): 프로젝트 카테고리의 기술 블로그 글 - [오늘수영: 무료 백엔드 인프라 구축(Oracle Cloud)](https://yoramilji.kr/blog/394765fe-8b67-81a9-94b6-ceb34a4c353c): 프로젝트 카테고리의 기술 블로그 글 - [Playlist → MP3: 파이썬 데스크톱 앱, 설치까지 만들기](https://yoramilji.kr/blog/397765fe-8b67-817e-a0c7-f99d409bbb84): 프로젝트 카테고리의 기술 블로그 글 - [오늘수영: 디자인 시스템 활용 & 문제 해결 기록](https://yoramilji.kr/blog/372765fe-8b67-8083-899e-e8f826da9e48): 프로젝트 카테고리의 기술 블로그 글 - [[인증 설계] SSO System 구현](https://yoramilji.kr/blog/365765fe-8b67-802f-a457-c76692ff9cd7): 프로젝트 카테고리의 기술 블로그 글 - [[junui] 1인 컴포넌트 라이브러리를 시작하며 — Phase 0 회고](https://yoramilji.kr/blog/350765fe-8b67-8197-90e1-c83c0eae494b): 프로젝트 카테고리의 기술 블로그 글 - [[요람일지] 이메일 문의 기능 (Gmail SMTP)](https://yoramilji.kr/blog/2fb765fe-8b67-8098-b648-dc96a8652150): 프로젝트 카테고리의 기술 블로그 글 - [[빅데이터분석기사 필기] 제4과목](https://yoramilji.kr/blog/32c765fe-8b67-80b4-9c7c-db63920d4282): 빅분기 필기 카테고리의 기술 블로그 글 - [[빅데이터분석기사 필기] 제3과목](https://yoramilji.kr/blog/32c765fe-8b67-8018-8c9c-cecebc9d9fab): 빅분기 필기 카테고리의 기술 블로그 글 - [[빅데이터분석기사 필기] 제2과목](https://yoramilji.kr/blog/32c765fe-8b67-800a-94be-d3b581b4ec98): 빅분기 필기 카테고리의 기술 블로그 글 - [[빅데이터분석기사 필기] 제1과목](https://yoramilji.kr/blog/32c765fe-8b67-80a4-8645-f21acfa8c699): 빅분기 필기 카테고리의 기술 블로그 글 - [데스크톱 기반 다중 AI 에이전트 회의 시스템](https://yoramilji.kr/blog/325765fe-8b67-80c7-8eae-e061c05189d3): 프로젝트 카테고리의 기술 블로그 글 - [[Jenkins + React16] CI/CD 파이프라인 구축](https://yoramilji.kr/blog/2ec765fe-8b67-8051-ab57-d91e0914df47): 기술 공부 카테고리의 기술 블로그 글 - [[사내 프로젝트] B2B 온라인 교육 LMS 구축](https://yoramilji.kr/blog/2ec765fe-8b67-8062-83fd-db29b8b192f4): 프로젝트 카테고리의 기술 블로그 글 - [[정보처리기사 필기] 제5과목: 정보시스템 구축 관리](https://yoramilji.kr/blog/2fb765fe-8b67-8043-8653-ff08be5063df): 정처기 필기 카테고리의 기술 블로그 글 - [[Three.js] Web 3D 성능 최적화: GLB 압축](https://yoramilji.kr/blog/2f4765fe-8b67-807e-8f77-f5597ce68e92): 기술 공부 카테고리의 기술 블로그 글 - [[정보처리기사 필기] 제4과목: 프로그래밍 언어 활용](https://yoramilji.kr/blog/2fb765fe-8b67-8005-a777-f9ed9d2043ed): 정처기 필기 카테고리의 기술 블로그 글 - [[정보처리기사 필기] 제2과목: 소프트웨어 개발](https://yoramilji.kr/blog/2fb765fe-8b67-804e-9605-d67e0e24e73b): 정처기 필기 카테고리의 기술 블로그 글 - [[개인 프로젝트] 블로그 & 포트폴리오 사이트 구축](https://yoramilji.kr/blog/2ec765fe-8b67-8025-9e0c-f20f35cdcc0c): 프로젝트 카테고리의 기술 블로그 글 - [[Cloud] Alibaba CDN 생성 및 사용](https://yoramilji.kr/blog/2ec765fe-8b67-80ef-b6fc-f0eaa2a41b2e): 기술 공부 카테고리의 기술 블로그 글 - [[상태 관리] 라이브러리 전격 비교](https://yoramilji.kr/blog/2ec765fe-8b67-8032-aaac-e774fc513638): 기술 공부 카테고리의 기술 블로그 글 - [[정보처리기사 필기] 제1과목: 소프트웨어 설계](https://yoramilji.kr/blog/2fb765fe-8b67-807c-8f3f-d665f8d7afb3): 정처기 필기 카테고리의 기술 블로그 글 - [[인터뷰] 디자인 전공 개발자가 된 이유](https://yoramilji.kr/blog/2ec765fe-8b67-80a1-a462-fd7baa076950): 인터뷰 카테고리의 기술 블로그 글 - [[웹디자인 기능사] 합격 회고](https://yoramilji.kr/blog/2ec765fe-8b67-8044-b7ef-d9cfc725099c): 인터뷰 카테고리의 기술 블로그 글 - [[Algorithm] 뒤에 있는 큰 수 찾기](https://yoramilji.kr/blog/390765fe-8b67-81e8-adba-e188be32a726): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 스킬트리](https://yoramilji.kr/blog/390765fe-8b67-8169-9a5e-fa2cd4982d4e): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 주식 가격](https://yoramilji.kr/blog/390765fe-8b67-8187-8401-df0ea38f7b08): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 방문 길이](https://yoramilji.kr/blog/390765fe-8b67-81eb-929f-f4325700e926): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 땅따먹기](https://yoramilji.kr/blog/390765fe-8b67-8186-bd09-c5a2a36f8d3f): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 주차 요금 계산](https://yoramilji.kr/blog/390765fe-8b67-8196-b197-e43abd68b54e): 알고리즘 카테고리의 기술 블로그 글 - [[React native] Aos 빌드 및 배포하기](https://yoramilji.kr/blog/390765fe-8b67-8175-9d92-ca50fce70622): 기술 공부 카테고리의 기술 블로그 글 - [[Algorithm] 카펫](https://yoramilji.kr/blog/390765fe-8b67-8139-9232-c78cd6a8b5e4): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 더 맵게](https://yoramilji.kr/blog/390765fe-8b67-81c7-917c-ca716d9329cd): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 모음사전](https://yoramilji.kr/blog/390765fe-8b67-81d4-bf33-df516fb498e4): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 게임 맵 최단거리](https://yoramilji.kr/blog/390765fe-8b67-81d5-95a7-fbdb5d6e983b): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] [3차] n진수 게임](https://yoramilji.kr/blog/390765fe-8b67-810e-9774-f37e2be27f8b): 알고리즘 카테고리의 기술 블로그 글 - [[React native] Oauth2 (Google, KAKAO)](https://yoramilji.kr/blog/390765fe-8b67-81d0-8b7c-f3fa72fbc8dd): 프로젝트 카테고리의 기술 블로그 글 - [[Algorithm] [3차] 압축](https://yoramilji.kr/blog/390765fe-8b67-8153-879e-eef8910cf178): 알고리즘 카테고리의 기술 블로그 글 - [[Algorighm] k진수에서 소수 개수 구하기](https://yoramilji.kr/blog/390765fe-8b67-81dd-9f7d-ee5de8c01c64): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 타겟넘버](https://yoramilji.kr/blog/390765fe-8b67-813b-8eb2-cb867590ae6c): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 피로도](https://yoramilji.kr/blog/390765fe-8b67-818c-abf4-e25faf01332d): 알고리즘 카테고리의 기술 블로그 글 - [[React native] 실시간 알림](https://yoramilji.kr/blog/390765fe-8b67-813b-97be-ddd37912949d): 프로젝트 카테고리의 기술 블로그 글 - [[Algorithm] 멀리뛰기](https://yoramilji.kr/blog/390765fe-8b67-81c5-9f14-ce84c48fa082): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 기능개발](https://yoramilji.kr/blog/390765fe-8b67-817a-8998-e4cec10d8aec): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] H-index](https://yoramilji.kr/blog/390765fe-8b67-819c-ade6-ff0ae45aefd0): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] [1차] 캐시](https://yoramilji.kr/blog/390765fe-8b67-816b-86a6-e7bc8788388a): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] [1차] 뉴스 클러스터링](https://yoramilji.kr/blog/390765fe-8b67-81ec-8dc6-d44e4a854711): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 올바른 괄호](https://yoramilji.kr/blog/390765fe-8b67-8177-af39-c0db41c5ca84): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] n^2 배열 자르기](https://yoramilji.kr/blog/390765fe-8b67-8187-91f1-fe4f750edee5): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 영어 끝말잇기](https://yoramilji.kr/blog/390765fe-8b67-819b-aacf-e3046fed8344): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 네트워크](https://yoramilji.kr/blog/390765fe-8b67-815d-afa0-c7b94278c826): 알고리즘 카테고리의 기술 블로그 글 - [[Algorithm] 타겟넘버](https://yoramilji.kr/blog/390765fe-8b67-81db-9206-dcf6b9722e9e): 알고리즘 카테고리의 기술 블로그 글 - [[Javascript] Map](https://yoramilji.kr/blog/390765fe-8b67-8145-99de-d05cc47ed137): 기술 공부 카테고리의 기술 블로그 글 - [[Javascript ] BigInt](https://yoramilji.kr/blog/390765fe-8b67-8160-8a81-eac1afd89bf8): 기술 공부 카테고리의 기술 블로그 글 - [Redux Toolkit을 사용한 전역 상태 관리](https://yoramilji.kr/blog/390765fe-8b67-8109-aa7d-d7211a0327c3): 기술 공부 카테고리의 기술 블로그 글 - [Splash Screen을 활용한 자동 로그인 처리](https://yoramilji.kr/blog/390765fe-8b67-8100-b5ed-cb5f8ad63422): 프로젝트 카테고리의 기술 블로그 글 - [KnockKnock: 회원가입 로직](https://yoramilji.kr/blog/390765fe-8b67-81f1-be03-d9c50d9ee66b): 프로젝트 카테고리의 기술 블로그 글 - [Chat GPT API가 응답하지 않는다.](https://yoramilji.kr/blog/390765fe-8b67-818e-89f3-f1cfffaaa32c): 프로젝트 카테고리의 기술 블로그 글 - [React native 환경변수 설정방법](https://yoramilji.kr/blog/390765fe-8b67-81cb-9de7-c67e4e6fc689): 프로젝트 카테고리의 기술 블로그 글 - [SetState를 보냈는데 빈 객체가 왔다](https://yoramilji.kr/blog/390765fe-8b67-8172-a4a8-e9b8a8f8b25c): 프로젝트 카테고리의 기술 블로그 글 - [React native의 다양한 이슈들](https://yoramilji.kr/blog/390765fe-8b67-8133-9e3b-de356ee15d1e): 프로젝트 카테고리의 기술 블로그 글 - [React Native Calendars Agenda 사용기](https://yoramilji.kr/blog/390765fe-8b67-810f-be09-ce3930ddddff): 프로젝트 카테고리의 기술 블로그 글 - [두번째 프로젝트: KnockKnock](https://yoramilji.kr/blog/390765fe-8b67-81e7-b82d-df2eff186ea3): 프로젝트 카테고리의 기술 블로그 글 - [Helfit IntroPage 추가](https://yoramilji.kr/blog/390765fe-8b67-81d6-abce-ca7f3b5d1444): 프로젝트 카테고리의 기술 블로그 글 - [HELFIT: 회고](https://yoramilji.kr/blog/390765fe-8b67-8147-9a53-ed08406d47fd): 프로젝트 카테고리의 기술 블로그 글 - [Pre-Project: Stackoverflow Clone site](https://yoramilji.kr/blog/390765fe-8b67-8163-b0f6-e3853b094e9b): 프로젝트 카테고리의 기술 블로그 글 - [CORS 에러를 해결하는 방법](https://yoramilji.kr/blog/390765fe-8b67-8142-8ab5-f59a854d1ab5): 기술 공부 카테고리의 기술 블로그 글 - [Github Action](https://yoramilji.kr/blog/390765fe-8b67-819a-adb2-ce3940092d34): 기술 공부 카테고리의 기술 블로그 글 - [ Amazon Web Service](https://yoramilji.kr/blog/390765fe-8b67-811f-9e7a-d5cf58e099f5): 기술 공부 카테고리의 기술 블로그 글 - [웹 성능 최적화(feat.Front End)](https://yoramilji.kr/blog/390765fe-8b67-811e-b195-e450d9cb3908): 기술 공부 카테고리의 기술 블로그 글 - [Javascript: 재귀 함수](https://yoramilji.kr/blog/390765fe-8b67-8158-b9bf-e4227ce3ce42): 기술 공부 카테고리의 기술 블로그 글 - [graphQL](https://yoramilji.kr/blog/390765fe-8b67-81b4-99f1-c5f3698ac270): 기술 공부 카테고리의 기술 블로그 글 - [HOOK](https://yoramilji.kr/blog/390765fe-8b67-8163-a036-ea3d4de3ce89): 기술 공부 카테고리의 기술 블로그 글 - [Virtual DOM](https://yoramilji.kr/blog/390765fe-8b67-8199-8214-c1b745246aae): 기술 공부 카테고리의 기술 블로그 글 - [WebPack 모듈](https://yoramilji.kr/blog/390765fe-8b67-811b-9bc8-ca4c9d687f0a): 기술 공부 카테고리의 기술 블로그 글 - [SESSION3 기술면접 대비](https://yoramilji.kr/blog/390765fe-8b67-810b-bbf3-e55624af4159): 인터뷰 카테고리의 기술 블로그 글 - [OAuth](https://yoramilji.kr/blog/390765fe-8b67-81d2-9cbb-f9adedbf4e0d): 기술 공부 카테고리의 기술 블로그 글 - [SEO](https://yoramilji.kr/blog/390765fe-8b67-8183-9805-fe4f60a961e8): 기술 공부 카테고리의 기술 블로그 글 - [Token](https://yoramilji.kr/blog/390765fe-8b67-8128-a118-c490f0d4f709): 기술 공부 카테고리의 기술 블로그 글 - [Cookie & Session](https://yoramilji.kr/blog/390765fe-8b67-816b-90ce-df99d873223b): 기술 공부 카테고리의 기술 블로그 글 - [Programers: 제곱근 판별하기](https://yoramilji.kr/blog/390765fe-8b67-812e-b7f8-cacf0ca97d2f): 알고리즘 카테고리의 기술 블로그 글 - [자주 접하는 오류](https://yoramilji.kr/blog/390765fe-8b67-81fc-899c-e9cb0249994d): 기술 공부 카테고리의 기술 블로그 글 - [Semantic HTML](https://yoramilji.kr/blog/390765fe-8b67-8195-8f98-c7ab8130f8f5): 기술 공부 카테고리의 기술 블로그 글 - [REDUX](https://yoramilji.kr/blog/390765fe-8b67-8152-b2aa-f25f33480423): 기술 공부 카테고리의 기술 블로그 글 - [모달,태그,토글,탭 구현](https://yoramilji.kr/blog/390765fe-8b67-81d3-8df4-daf1d277d9ed): 기술 공부 카테고리의 기술 블로그 글 - [Storybook](https://yoramilji.kr/blog/390765fe-8b67-81b5-a65a-cb8349780cb9): 기술 공부 카테고리의 기술 블로그 글 - [UI&UX](https://yoramilji.kr/blog/390765fe-8b67-8196-9a7b-f93217115dca): 기술 공부 카테고리의 기술 블로그 글 - [기술 면접 준비](https://yoramilji.kr/blog/390765fe-8b67-8191-a6b7-fd6f6b29e8bb): 인터뷰 카테고리의 기술 블로그 글 ## 포트폴리오 - [실결제 장애 대응](https://yoramilji.kr/portfolio/voidx-payment): 서비스가 외부 행사에서 소개된 다음 날, 실사용자가 멤버십 결제에서 중복 승인(동일 금액 2회)과 멤버십 미활성화를 동시에 겪었습니다. 장애를 알린 것은 모니터링이 아니라 사용자의 문의 메일이었습니다. 당일 사과·전액 환불과 전역 결제 차단으로 피해 확산을 끊고, 프론트 사각지대 3종을 실증·수정하고 오류 응답을 전수 매핑해 같은 유형의 오류는 배포 전에 테스트가 먼저 잡는 구조로 바꿨습니다. 결제 재개는 서버측 멱등 처리가 갖춰질 때까지 3개월간 잠금을 유지했습니다. 결제·멤버십 백엔드 구현은 별도 담당자 소관입니다. - [AI 에이전트 SaaS 자사 웹서비스](https://yoramilji.kr/portfolio/voidx-main-web): 마케팅 사이트이자 회원 콘솔인 AI 에이전트 SaaS의 프로덕트 웹(voidx.ai)입니다. 유저가 프로덕트를 인지하고, 인증으로 자격을 얻고, 구독을 결제해 사용을 시작하는 핵심 동선을 설계·구현해 정식 운영에 올렸습니다. 그 기반에서 175개 API 경로 전량 이관과 실사용자 결제 장애 대응을 주도했습니다. - [임베드형 AI 에이전트 SDK](https://yoramilji.kr/portfolio/voidx-addon-sdk): AI 챗봇을 script 한 줄로 임베드하는 SDK입니다. 프레임워크·전역 CSS·업데이트 시점을 통제할 수 없는 고객사 사이트에서 충돌 없이 실행되어야 하고, 잘못된 빌드가 배포되면 안 됩니다. 이 제약을 UMD standalone · closed Shadow DOM · self-init의 3중 격리와 불변 버전 릴리즈 파이프라인으로 해결했습니다. 카페24 판은 3개월간 PM을 겸해 스토어 출시까지 완료했고, 챗봇 서버는 별도 담당자 소관입니다. - [반도체 전시 부스 3D AI 체험 웹앱](https://yoramilji.kr/portfolio/booth-3d-webapp): 반도체 전시회(SEMICON Korea 2026, 코엑스) 부스 체험용 브라우저 앱입니다. GLTF 3D 부스·제품 뷰어, 끊겨도 스스로 복구하는 실시간 AI 채팅(네이티브 WebSocket), 음성 입력, 3개 국어를 구현해 방문객이 쓰는 화면 전체를 맡았습니다. 첫날 이용이 기대보다 낮게 나오자 접속 데이터를 보고 채팅 진입 경로를 전면 배치로 바꿔, 다음 날 신규 채팅 사용자가 1.5배가 됐습니다. - [기업 이러닝 LMS 웹서비스](https://yoramilji.kr/portfolio/kma-lms): 학습자 웹·기업 교육담당자·운영 관리자 세 화면으로 구성된 기업 교육용 이러닝 LMS 모노레포입니다. 10여 명이 6개월간 붙은 대형 외주에서 운영 어드민을 주담당으로 맡아 기업·콘텐츠·교육·결제 네 도메인의 관리 화면을 구현했습니다. 실사용자가 접하는 Next.js 기반의 학습자웹에서는 6단계의 결제 상태 분기 처리와 할인이 두 겹으로 얹히는 정산 규칙을 화면에서 다뤘습니다. 또한 교육담당자 기업 교육 과정 관리 화면을 추가로 맡아 구현하였습니다. - [사주 기반 AI 대화 웹서비스](https://yoramilji.kr/portfolio/manil): 생년월일을 등록하면 사주를 기반으로 AI와 상담하고 그 내용을 리포트로 정리해 공유하는 모바일 웹 서비스입니다. 3인 팀에서 프론트엔드 메인으로 라우팅·상담 채팅·등록 폼·소셜 로그인·리포트 렌더를 맡아 짧은 기간에 서비스 전체 동선을 붙였습니다. 백엔드와 사주 해석 엔진, 어드민과 OAuth 서버 연동은 별도 담당자 소관입니다. - [ GEO·AI 챗봇·CMS 기반 한의원 웹서비스](https://yoramilji.kr/portfolio/doctor-friends): 고객사 병원 홈페이지와 자체 CMS를 PM 겸 개발자로 리뉴얼해 프로덕션에 라이브했습니다. 원고 문서가 4단계 검증을 거쳐 CMS에 적재되는 파이프라인과, dev에서 검증된 이미지를 재빌드 없이 운영에 승격하는 배포 체계를 만들었습니다. 고객사와 직접 소통하며 13개 기능 영역의 기능정의서를 작성했습니다. - [부동산 진단·계산 모바일앱](https://yoramilji.kr/portfolio/aresa-fe): 부동산 전세안전진단·DSR 계산 서비스에서 프론트엔드 신입으로 지도·대출 계산기·관리자 화면 등 데이터가 많은 화면을 다뤘습니다. React로 공부했지만 사내 스택인 Angular에 적응해 작업하며 기초를 쌓은 시기입니다. - [오늘수영](https://yoramilji.kr/portfolio/oneul-swim): "지금 자유수영 가면 되는지"를 알려주는 서비스입니다. 기획, 디자인, 프론트, 백엔드, 전국 603곳 데이터 파이프라인, 실서버 운영까지 1인으로 개발해 월 서버 비용 0원으로 운영 중입니다. "백엔드가 중단되어도 앱은 동작한다"를 원칙으로 전 계층에 폴백을 두고, 데이터는 dry-run 계획을 서버가 apply하는 2단계·멱등 적재로 관리합니다. - [Playlist → MP3](https://yoramilji.kr/portfolio/playlist-to-mp3): 유튜브 플레이리스트(또는 단일 영상) URL을 넣으면 각 곡을 태그·앨범아트가 담긴 MP3로 저장하는 크로스 플랫폼(macOS·Windows·Linux) 데스크톱 앱입니다. 필요해서 직접 만들고, 남들도 한 줄로 설치할 수 있게 다듬었습니다. - [헬스케어 대시보드](https://yoramilji.kr/portfolio/helfit): 신체정보 통계·건강관리, 커뮤니티, 위치 기반 운동시설 안내를 제공하는 헬스 종합 플랫폼입니다. 6인 팀에서 프론트엔드 팀장으로 메인·캘린더·챗봇·할 일 관리 등을 맡았습니다. - [일정관리 모바일앱](https://yoramilji.kr/portfolio/knockknock): 스케줄 보드와 달력으로 일정을 관리하는 모바일 애플리케이션입니다. 팀 프로젝트에서 프론트엔드로 참여해 iOS·Android 양 스토어 출시까지 경험했습니다. - [Ottogi Mall](https://yoramilji.kr/portfolio/ottogimall): 친숙한 브랜드 자산은 지키고, 탐색·구매 흐름은 새롭게 정리한 PC·모바일 풀 리디자인 프로젝트입니다. 로그인부터 상품 탐색·상세·장바구니·주문/결제·마이페이지·고객센터까지 전 화면을 케이스 단위로 설계하고, 하나의 디자인 시스템으로 통일했습니다. - [YOUANDUS](https://yoramilji.kr/portfolio/youandus): 패브릭·카펫·바닥재·주방·가구까지 다루는 하이엔드 인테리어 큐레이션 브랜드의 웹사이트 디자인입니다. 제품군이 많아 구조가 흩어지기 쉬워, 카테고리 체계부터 정리하고 여백과 타이포 위계로 '큐레이션'이라는 정체성을 표현했습니다. - [ANNE KLEIN Promotion](https://yoramilji.kr/portfolio/anneklein): 2021 시즌 룩북 촬영 현장을 보조하고, 선별한 컷으로 프로모션 페이지를 디자인했습니다. - [ANDBAG](https://yoramilji.kr/portfolio/andbag): 여러 수입 가방 브랜드를 한 사이트에 통합하면서, 브랜드별로 분산되지 않도록 카테고리와 사이트맵을 먼저 설계한 신규 브랜드 웹사이트입니다. 자체 서버 대신 호스팅 템플릿을 활용해 적은 비용으로 안정적인 운영이 가능하도록 구성했습니다. ## 주요 페이지 - [홈](https://yoramilji.kr): 소개와 대표 작업 모음 - [블로그](https://yoramilji.kr/blog): 기술 블로그 글 목록 - [포트폴리오](https://yoramilji.kr/portfolio): 프로젝트 포트폴리오 목록 - [프로필](https://yoramilji.kr/profile): 개발자 프로필과 경력 소개