About

Lofo's portfolio

이주영 이력서

소개.

안녕하세요, 3년 차 프론트엔드 엔지니어 이주영입니다.

재사용성과 확장성을 고려한 컴포넌트 설계를 통해 안정적인 프로덕트를 구축하는 데 강점이 있습니다.

기술을 통해 뛰어난 사용자 경험을 제공하고 비즈니스 성장에 직접적으로 기여하는 것을 목표로 삼으며,

실제로 SEO 최적화를 통해 마케팅 비용을 0원으로 절감하는 등의 의미 있는 비즈니스 임팩트를 만들어왔습니다.

Contact.

Email. lkj49864@ajou.ac.kr

Phone. 010-4683-2022

Channel.

Blog. https://velog.io/@jylee9937

GitHub. https://github.com/jylee9937

업무 경험.

맞추다(MACHUDA)

  • MAU 10만, 60여개의 자격증 문제 풀이 서비스 운영 | 맞추다 서비스
  • ATS 채용 관리 시스템 운영 | 맞추다 채용 사이트
  • 디캠프 후원(22.12) 및 팁스 투자 (23.10) | 2025년 BEP 달성 예정

Frontend Developer

2022.07.01 ~

  • 첫 투자 전 입사하여 BEP 달성하는 과정까지에 필요했던 모든 프론트엔드 관련 업무 리드 및 담당하고 있습니다.
  • 문제 풀이 서비스, ATS 등등 4개의 서비스를 zero to one으로 개발하고 운영하고 있습니다.
  • 클라이언트 개발 뿐만 아니라 인프라 설정 및 모바일 앱 유지보수 업무를 담당하고 있습니다.
  • 디자인 시스템을 적극적으로 도입하여 코드 재사용성을 높이고, 비지니스 성장에 필요한 기술적 역량을 책임지고 있습니다.

프로젝트

ATS 커스텀 지원 항목 컴포넌트 구현

B2B ATS 시스템에서 고객사별로 상이한 양식 요구사항에 신속하게 대응하기 위해 Server-Driven UI(SDUI) 아키텍처를 설계하고 도입했습니다.

(2025.06)

  • 주요 내용
    • 고객사별로 상이한 지원서 양식 요구사항에 대응하기 위해 Server-Driven UI(SDUI) 아키텍처를 도입했습니다.
    • JSON 스키마 정의만으로 프론트엔드 코드 수정 및 배포 없이 커스텀 입력 필드를 동적으로 생성하는 시스템을 구축했습니다.
  • 해결 과정
    • 백엔드 개발자와 협업하여 UI 컴포넌트(Input, Checkbox 등)와 동적 액션(유효성 검사, 조건부 노출 등)을 사전에 정의하고, 이를 조합할 수 있는 JSON 스키마를 설계했습니다.
    • 설계된 스키마를 기반으로, 전달받은 JSON을 해석하여 동적으로 폼을 렌더링하는 재사용 가능한 렌더링 기능을 개발했습니다.
  • 결과
    • PM과 백엔드 개발자가 프론트엔드 배포 없이 직접 입력 필드를 생성하고 수정할 수 있도록 개발 프로세스를 개선했습니다.
    • 신규 필드 추가에 소요되던 시간을 평균 1일에서 1시간 이내로 단축하여 개발 생산성을 크게 향상시키고, 비즈니스 요구에 대한 대응 속도를 높였습니다.

ATS 백오피스 및 지원 클라이언트 구현

B2B ATS 시스템의 관리자용 백오피스와 지원자용 클라이언트를 개발했습니다. (2024.10 ~ 2025.02)

  • 주요 내용
    • 관리자 설정에 따라 지원서 양식이 동적으로 생성되는 시스템을 구축했습니다.
    • 실시간 양식 미리보기 기능 및 지원자 데이터 관리, 대용량 엑셀 다운로드 기능을 개발했습니다.
  • 해결 과정
    • react-hook-form과 zod를 조합하여, JSON 스키마만으로 폼 렌더링과 유효성 검사가 동적으로 처리되도록 설계했습니다.
    • 백오피스와 지원 클라이언트 간의 중복 코드 문제를 해결하기 위해 모노레포(Monorepo) 아키텍처를 도입했습니다. 공통 로직과 UI 컴포넌트를 공유 패키지로 분리하여 개발 효율성과 코드 일관성을 확보했습니다.
    • react-query의 캐싱 기능으로 중복 API 호출을 방지하고, 페이지네이션을 적용하여 대용량 데이터 조회 시 서버 부하를 최소화했습니다.
  • 결과
    • 모노레포 도입을 통해 중복 코드를 제거하여 두 애플리케이션의 개발 및 유지보수 리소스를 줄였습니다.
    • 캐싱과 페이지네이션 적용으로 불필요한 네트워크 요청을 줄여 서버 부하를 효과적으로 낮추고, 사용자에게 빠르고 안정적인 경험을 제공했습니다.

문제풀이 서비스 AppEngine → CloudRun 마이그레이션

(2024.08)

  • 주요 내용
    • 서버 비용 절감 및 기술적 제약 해결을 위해 기존 App Engine 기반 서비스를 Cloud Run으로 이전했습니다.
    • Cloud Run 환경의 이점을 활용하여 Next.js의 이미지 최적화 기능을 활성화하고 CDN을 연동하여 성능과 개발 생산성을 개선했습니다.
  • 해결 과정
    • 인스턴스 기반 과금 방식의 App Engine에서 요청 기반 과금 방식인 Cloud Run으로 전환하여 서버 비용을 절감했습니다. 또한, App Engine의 파일 시스템 쓰기 제한으로 사용하지 못했던 Next.js의 On-demand 이미지 최적화(next/image) 기능을 도입했습니다.
    • 기존에는 디자이너에게 이미지를 받아 수동으로 최적화 후 코드에 삽입하는 번거로운 과정이 있었으나, next/image 컴포넌트를 적극 활용하여 이 프로세스를 자동화하고 개발 시간을 단축했습니다.
    • 이미지 최적화 요청으로 인한 서버 부하를 해결하기 위해, 파일 해시 기반으로 고유 URL을 생성하는 Next.js의 특징을 활용하여 CDN을 도입하고 캐싱 전략을 구축했습니다.
  • 결과
    • 유휴 상태의 고정 비용을 제거하고 요청 기반 과금 체계로 전환하여 비용을 획기적으로 줄였습니다.
    • 수동 이미지 처리 과정을 자동화하여 핵심 기능 개발에 더 집중할 수 있는 환경을 만들었습니다.
    • 57% 이상의 높은 CDN 캐시 적중률을 달성하여 원본 서버의 부하를 크게 줄이고, 안정적인 서비스 운영이 가능해졌습니다.

문제풀이 서비스 NextJS 마이그레이션

(2023.11 ~ 2024.02)

  • 주요 내용
    • 오가닉 트래픽 증대를 목표로, 기존 React(CSR) 서비스를 Next.js 기반으로 마이그레이션했습니다.
    • 수만 개에 달하는 개별 문제 페이지를 생성하는 롱테일 SEO 전략을 실행하여 검색 엔진 노출을 극대화했습니다.
  • 해결 과정
    • 데이터 규모에 따른 렌더링 전략 분리:
      • 컨텐츠 변경 빈도가 낮은 자격증 학습 페이지는 SSG와 ISR을 적용하여 빠른 로딩 속도와 컨텐츠 최신성을 동시에 확보했습니다.
      • 수만 개의 문제 페이지 전체를 SSG로 빌드할 시 발생하는 빌드 시간 및 서버 과부하 문제를 해결하기 위해, 해당 페이지들은 SSR 방식으로 구현했습니다.
    • 모든 동적 페이지가 누락 없이 검색 엔진에 수집되도록 동적 sitemap.xml 생성 로직을 구현하여 SEO 효율을 높였습니다.
  • 결과
    • Google Search Console 기준, 월간 총 노출 수를 8만에서 25.5만으로 약 218% 증가시켜 오가닉 트래픽 유입 기반을 성공적으로 마련했습니다.
    • 주요 키워드 '맞추다' 검색 시, 국어사전 결과보다 상위에 노출됩니다.
    • 안정적인 오가닉 트래픽 채널을 확보한 결과, 기존에 집행하던 유료 마케팅 예산을 전액 절감하는 데 결정적으로 기여했습니다.

문제풀이 서비스 컨텐츠 블로그 SEO 최적화

(2023.08)

  • 주요 내용
    • 검색 엔진 노출 증대를 목표로, 기존 CSR방식으로 렌더링되던 블로그를 SSG(Static Site Generation) 방식으로 전환하여 SEO 최적화했습니다.
    • 시맨틱 HTML 적용 및 콘텐츠 작성 가이드라인을 제작하여 컨텐츠 SEO 프로세스를 정립했습니다.
  • 해결 과정
    • 검색 엔진 크롤러가 컨텐츠를 원활히 수집할 수 있도록, 초기 렌더링 방식이 CSR이었던 블로그를 SSG로 전환했습니다. 또한, 컨텐츠의 최신성을 유지하기 위해 ISR을 함께 도입했습니다.
    • <h1>, <article>, <aside> 등 시맨틱 태그를 적극적으로 활용하여 페이지의 구조적 의미를 명확히 하고 검색 엔진의 이해도를 높였습니다.
    • 비개발 직군인 컨텐츠 매니저도 SEO를 고려하여 글을 작성할 수 있도록, 효과적인 <title>, <meta name="description"> 내용 작성법과 키워드 전략을 담은 가이드를 제작하고 공유했습니다.
  • 결과
    • Google 서치 콘솔 기준, 월간 총 노출 수를 4천에서 5만으로 약 1000%의 노출율을 증가시키는 성과를 달성했습니다.

Other Experience.

블랙커피 스터디 13기

(2022.02)

  • FE 작업에 필요한 요구사항을 정리하고, 기능 구현하는 프로세스를 배웠습니다.
  • 코드리뷰를 통해 더 좋은 코드를 구현하고, 피드백 및 반영하는 법을 배웠습니다.

부스트코스 서포터즈 3기

(2021.01, 02)

  • 자바스크립트 기초 내용 및 CS 기초 내용을 정리하여 블로그에 포스팅했습니다.

Skill.

  • Frontend: Javascript, TypeScript, React.js, Next.js, HTML/CSS, React-Query, Recoil, React-hook-form
  • Infra: Google Cloud Run, Google Cloud CDN, Google Cloud Build
  • Monitoring: Sentry

Education.

2018.03 ~ 2023.02 아주대학교 사이버보안학과

2023.09 ~ 숭실대학교 정보과학대학원 IT경영학과