# 안녕하세요, 조현우입니다

안녕하세요! 8년차 풀스택 엔지니어 조현우입니다. 아래 이력서와 포트폴리오 버튼을 눌러 저에 대해 더 알아보세요. ### 이력서 {% content-ref url="/pages/PEeV37pXTm4X6EJvELNE" %} [이력서](/about/resume) {% endcontent-ref %} {% file src="/files/JfHXdTU760mByaWNVCz4" %} PDF 이력서 (Wanted 서식) {% endfile %} ### 2012년부터 현재까지! 개발 연혁을 살펴보세요 {% content-ref url="/pages/T4xGiBnOwZoFlQB2X3vU" %} [개발 연혁](/about/history) {% endcontent-ref %} ### 포트폴리오 {% content-ref url="/pages/w8wH2SaRTxqeF8tZRhlX" %} [포트폴리오 (경력기술)](/about/portfolio) {% endcontent-ref %} {% content-ref url="/pages/JPGms3RGvKmbCID7Y9FQ" %} [외부 발표/강연](/about/speech) {% endcontent-ref %} {% content-ref url="/pages/ETlzOU7xGhXqp5ptRRMZ" %} [사이드 프로젝트](/about/side) {% endcontent-ref %} {% content-ref url="/pages/AXnGa2FlrV6VDII4hR5a" %} [사이드 프로젝트 (그 외)](/about/side-etc) {% endcontent-ref %} ### 기타 링크 * GitHub : * Blog : # 이력서 {% hint style="info" %} 기업의 복잡한 업무와 사용자의 문제를 AI와 소프트웨어로 풀고, 문제 정의부터 풀스택 구현·출시·운영·성장까지 책임지는 8년차 AI-native Product Engineer 조현우입니다. {% endhint %} ## 조현우 (Hyeon Woo Jo) * 이메일 : * 깃허브 : * 블로그 :[ https://blog.haenu.com](https://blog.haenu.com) ## 경력 {% hint style="warning" %} 각 회사에서 진행한 세부 프로젝트는 [포트폴리오 (경력기술)](/about/portfolio) 메뉴에서 살펴보실 수 있습니다 {% endhint %}

디와이랩스(창업) → 2026.03 ~ 2026.08 (6개월)

* CEO (창업) * Side Project (2024.08 \~ 2026.03) * Full Time (2026.03 \~ 2026.08) * 스트리머와 팬, 커미션 작가를 연결하는 올인원 플랫폼 '멜로밍' 개발 및 운영 * 1년만에 MAU 6만, 거래액 1억 달성으로 0 to 1 성장 * 한국 버추얼 스트리머 3명 중 1명이 사용하는 라이브 스트리밍 보조 도구로 성장 * 버추얼 스트리머 전문 커미션(외주 중개) 플랫폼으로 출시 5개월만에 누적 중개 1천건 및 거래액 1억 달성

HYPERCONNECT → 2024.01 ~ 2026.03 (2년 3개월)

* Internal Platform Engineer, DevOps Team * 주요 업무 * Internal Platform Unit의 첫 멤버로 합류해, 불명확한 팀의 R\&R을 정해나가고, 정해지지 않은 업무를 정의하며 팀을 만들어나가기 * 사내 비개발 직군 생산성 개선을 위한 툴 제작 및 통합 플랫폼 구축 * 내부 개발자 플랫폼 설계 및 구축 지원

(주)이제이엔 → 2022.04 ~ 2023.12 (1년 9개월)

* Backend Developer, Backend Team (2022.04 \~ 2023.08) * DevOps Engineer, DevOps Team (2023.08 \~ 2013.12) * 주요 업무 : 트윕, 트게더 신규기능 개발 및 유지보수 * AWS 인프라 및 쿠버네티스 클러스터 관리 * 트윕 모바일 (트게더 앱) 백엔드 담당 * 트윕 신규 후원 '빙빙도네' 백엔드 담당 * [트윕 클립](https://vod.twip.kr) 서비스 Product Owner, 전체 개발(FE + BE) 담당 * 주요 기술 스택 * DevOps : * BackEnd : NestJS, PHP CodeIgniter 3, Kubernetes, MySQL/MariaDB, Redis, AWS * FrontEnd : Next.js, React.js

(주)엠에이치큐 → 2021.10 ~ 2022.04 (7개월)

* Web Developer, Web Team * 주요 업무 : [i.M 택시](https://www.imforyou.co.kr/) 서비스 개발 및 유지보수 * i.M 택시 백오피스 제작 및 유지보수 * i.M 택시 애플리케이션 내 웹뷰 개발 * i.M 택시 홈페이지 유지보수 * 주요 기술 스택 : PHP CodeIgniter 4, MySQL/MariaDB

(주)미래직업전망연구원 → 2019.09 ~ 2021.08 (2년)

* Web Developer, 플랫폼개발사업본부 * 주요 업무 : 신규 플랫폼 개발 * 개발자가 혼자인 회사에서 PHP로 신규 플랫폼을 만들어 런칭까지 진행 * 기존에 ASP.Net으로 만들어진 서비스의 유지보수 * 주요 기술 스택 : PHP CodeIgniter 3, Python Flask, AWS

## 스킬 {% tabs %} {% tab title="AI Native" %} * Claude Code Max, ChatGPT Pro 계정을 최대 4개씩 직접 구독하며 {% endtab %} {% tab title="Frontend" %} * **React.js** 및 기반 기술들을 이용해 API로 연동되어 동작하는 웹사이트를 제작할 수 있습니다. * **Next.js** 를 이용해 React.js 기반으로 서버사이드렌더링이 가능하도록 웹페이지를 제작할 수 있습니다. * 여러 UI Library들을 이용해본 경험이 있습니다. (Chakra UI, Mantine, MUI, Ant Design 등) * React 환경에서 Tailwind CSS를 이용해 스타일링을 적용할 수 있습니다. * SWR이나 Tanstack Query와 같은 Data fething 라이브러리를 사용할 수 있습니다. * Jotai, Recoil과 같은 상태관리 툴을 사용해본 경험이 있습니다. * **HTML5 / CSS3 / Javascript** 를 이용해 기본적인 퍼블리싱을 무리 없이 할 수 있습니다. * **jQuery**와 **Bootstrap**을 이용해 자유롭게 원하는 레이아웃을 구성할 수 있습니다. * **타입스크립트**와 모던 자바스크립트 문법 (**ES6+**) 사용에 익숙합니다. * PWA(Progressive Web App)를 Next 앱에서 세팅하여 배포해본 경험이 있습니다. * Vue.js (Vue2, Vue3, Nuxt.js) 기반으로 제작되어있는 프로젝트를 유지보수해본 경험이 있습니다. {% endtab %} {% tab title="Backend" %} * **Node.js 백엔드**를 주력으로 합니다 * NestJS, Express 등을 이용해 REST API 서버를 개발합니다. * Sequelize, TypeORM 등 Node.js 기반 ORM 라이브러리를 활용해 데이터베이스를 연동합니다. * Redis 등 서버사이드 캐시를 적용해 API를 최적화합니다. * Kafka, SQS 등 이벤트 브로커를 이용해 분산환경에 적합한 백엔드를 설계할 수 있습니다. * 그 외 PHP와 Python을 이용해서 서비스를 개발한 경험도 많습니다. (신규 및 유지보수) * **PHP 기반 CodeIgniter 프레임워크**를 활용해 자유자재로 서비스를 구축할 수 있으며, **MVC 패턴**에 대해 이해하고 있습니다. (버전 3 & 4) * **Python Flask, FastAPI 프레임워크** 기반으로 **RESTFul API**를 설계할 수 있습니다. * VB ASP.Net과 C# ASP.Net, PHP 5.x 기반의 레거시 프로젝트 유지보수 및 신규개발 경험이 있습니다. * **MySQL, MariaDB, Postgresql** 등 RDBMS를 이용할 수 있으며 요구사항에 맞춰 스키마를 설계하고, 필요에 따라 Stored Procedure과 Scheduling 기능도 이용할 수 있습니다. * EXPLAIN 문으로 실행계획을 살펴보고, 쿼리 성능 개선을 한 경험이 있습니다. * **Redis**를 캐시, 세션, Event PubSub 용도로 활용할 수 있습니다. * 주로 ElastiCache를 이용해왔습니다. * 쿠버네티스 클러스터 내에 HA로 설치된 Redis를 이용한 경험도 있습니다. {% endtab %} {% tab title="Infra & Devops" %} * **AWS** 클라우드 환경에서 프로덕션 환경의 인프라를 구성하고 운영할 수 있습니다. * Terraform을 이용해 IaC와 GitOps 기반으로 인프라를 프로비저닝하고 관리할 수 있습니다. * **쿠버네티스** 클러스터를 프로덕션 환경에서 운영할 수 있습니다. * 배포가 필요한 앱의 구성과 구조를 파악하고 적절한 형태로 매니페스트를 작성할 수 있습니다. * Helm을 이용해 필요한 앱을 설치하고 운영에 활용할 수 있습니다. * Grafana, Prometheus, Jaeger와 Opentelemetry 등 다양한 모니터링 툴을 이용해 서비스의 가시성을 확보하고 안정적인 운영이 가능하도록 지원합니다. * Linkerd와 같은 서비스메시를 도입해 활용한 경험이 있습니다. * Vault와 같은 시크릿 관리 툴을 이용해 환경변수를 관리하도록 구성할 수 있습니다. * Jenkins, ArgoCD, GitHub Actions 등 툴을 이용해 CI/CD 파이프라인을 구축할 수 있습니다. * Cloudflare에서 제공하는 다양한 기능들을 활용해 서비스 보안 강화, 성능 개선 등 구성을 할 수 있습니다. {% endtab %} {% tab title="Etc skills" %} * 비개발직군과의 협업시 강력한 소프트 스킬을 보유하고 있다고 자신합니다. (투명한 일정 관리와 공유부터, 비개발 직군이 이해할 수 있는 용어로의 설명 등) * **Git**을 활용하여 소스코드 버전을 관리하고 협업할 수 있습니다. (GitHub, Gitlab 등) * **Jira, Confluence, Notion, Slack** 등의 협업 툴을 이용하여 타 펑션과 협업할 수 있습니다. * 문서화에 관심이 많아 담당했던 부분은 최대한 디테일하고 구조적인 기술문서를 작성하여, 추후 유지보수나 인수인계 과정에서 도움을 많이 받기도 하였습니다. * **Swagger UI**를 이용하여 프론트엔드 작업을 하거나, 백엔드에서 Swagger 문서를 생성할 수 있습니다. * **Sentry, Bugsnag** 등 에러 모니터링툴을 활용하고, **Datadog, Grafana** 등 툴을 이용해 서비스를 모니터링하고 로그를 관리할 수 있습니다. * 복잡한 데이터 처리나 간단한 반복 작업들을 Python으로 작성해 처리하는 걸 즐겨합니다. * 개발 툴은 주로 VS Code와 Jetbrains 사의 제품을 이용합니다. {% endtab %} {% endtabs %} ## 학력

[석사 과정 재학] 한국외국어대학교 대학원

* 교육대학원 (컴퓨터교육전공) 재학 * 2024.03 \~ (휴학)

[학사 졸업] 세종사이버대학교

* IT학부 컴퓨터·AI 공학과 졸업 * 2021.03 (2학년 편입) \~ 2024.02

[학사 중퇴] 가톨릭대학교

* ICT공학계열 컴퓨터정보공학부 중퇴 * 2019.03 \~ 2021.02 (중퇴)

## 수상 및 기타

가톨릭대학교 Programming 대회 동상 수상 (2019.10)

ACM-ICPC 인터넷 예선과 함께 치러진 교내 알고리즘 대회에서 동상 수상. C++ 이용해 알고리즘 문제 해결

# 개발 연혁 {% hint style="info" %} 본 페이지에서는 처음 개발에 관심을 가지기 시작했던 2012년부터 가장 최근의 현황까지 나열해서 보여줍니다. 개발자가 되기 위해 지수적인 성장을 추구해왔던 그 발자취를 공유합니다. {% endhint %} ### 2012 (13세, 초6) * C언어 책을 처음 접하고 프로그래밍에 관심을 가지기 시작함 ### 2013 (14세, 중1) * 부산광역시교육청 정보영재교육원 중등과정 1학년 수료 (C언어, 플래시 등) ### 2014 (15세, 중2) * 부산광역시교육청 정보영재교육원 중등과정 2학년 수료 (C언어, 자료구조/알고리즘 등) * 제4회 e-ICON 세계대회 참여하여 3등 입상 (앱 개발 - Flash Air, AS3.0) ### 2015 (16세, 중3) * 부산광역시교육청 정보영재교육원 중등과정 3학년 수료 (C언어, 자료구조/알고리즘, 이산수학 등) * 산수 연습 앱 개발하여 플레이스토어 출시 (Flash Air, AS3.0) ### 2016 (17세, 고1) * 부산광역시교육청 정보영재교육원 고등과정 수료 (C/C++, 자료구조/알고리즘 등) * [부산국제고등학교 야간자율학습 통합관리시스템 '야자타임' 프로젝트](/about/side/yajatime) 개발 및 운영 (PHP) : 1개 학년 실사용 ### 2017 (18세, 고2) * [부산국제고등학교 야간자율학습 통합관리시스템 '야자타임' 프로젝트 개발 및 운영](/about/side/yajatime) (PHP) : 2개 학년 실사용 * 부산국제고등학교 축제 실시간 투표 시스템 개발 및 운영 (PHP) ### 2018 (19세, 고3) * [온라인 학습 플래너 웹사이트 '해누플래너'](/about/side/haenu-planner) 개발 및 운영 (PHP, App Inventor) ### 2019 (20세, 대1, 개발자 1년차) * 가톨릭대학교 컴퓨터정보공학부 입학 (2019.03) * 가톨릭대학교 학식봇 프로젝트 개발 및 운영 (카카오톡 봇, JS) * 미래직업전망연구원 입사 (2019.09) * 가톨릭대학교 Programming 대회 동상 수상 (C++, 알고리즘) * [한국직업상담협회 공동훈련센터 웹사이트 개발 (PHP)](/about/portfolio/hrd-kvoca-org) ### 2020 (21세, 대2, 개발자 2년차) * [트리니티 헬퍼(가톨릭대학교 수강정정 도우미) 프로젝트 운영](/about/side/trinity-helper) (PHP, Python) * [직업카드심리검사 웹, 앱 유지보수 프로젝트 참여](/about/portfolio/jobcard) (ASP.Net) * [JDC 일자리데이터센터 프로젝트 개발](/about/portfolio/job-data-center) (PHP) ### 2021 (22세, 대2, 개발자 3년차) * 가톨릭대학교 중퇴 (2021.02) * 세종사이버대학교 컴퓨터AI공학과 편입 (2021.03) * [Easy LMS 프로젝트 개발](/about/portfolio/easy-lms) (PHP) * [HR Platform 프로젝트 개발](/about/portfolio/hr-platform) (PHP) * 미래직업전망연구원 퇴사 (2021.08) * 엠에이치큐 입사 (2021.10) * [i.M 택시 백오피스 개발](/about/portfolio/imtaxi-backoffice) (PHP) * [i.M 택시 예약서비스 웹뷰 개발](/about/portfolio/imtaxi-reservation-webview) (PHP, JS) ### 2022 (23세, 대3, 개발자 4년차) * 사이드 프로젝트 - [포도당 노래책 프로젝트 개발](/about/side/music-c6h12o6-kr) (React.js, FastAPI) * 엠에이치큐 퇴사 (2022.04) * 이제이엔 입사 (2022.04) * 사이드 프로젝트 - [레븐 멀티트위치 개발](/about/side/leaven-multi) (React.js) * 사이드 프로젝트 - [gellgell 게임 개발](/about/side/gellgell) (React.js, FastAPI) * [TWIP/TGD APP 프로젝트 백엔드 개발](/about/portfolio/twip-tgd-app) (NestJS) * 산업기능요원 복무 시작 (2022.06) * 사이드 프로젝트 - [나와 가장 잘 맞는 레븐 멤버는? 개발](/about/side/leaven-minigame) (Next.js) * 사이드 프로젝트 - [전해리 방송일정 개발](/about/side/junharry) (React.js, FastAPI) * 사이드 프로젝트 - [해리배치고사 개발](/about/side/test-junharry) (Next.js, FastAPI) * 사이드 프로젝트 - [Clippy 개발](/about/side/clippy) (Next.js, NestJS) ### 2023 (24세, 대4, 개발자 5년차) * [TWIP VOD & CLIP 프로젝트 개발](/about/portfolio/twip-vod-clip) (Next.js, NestJS) * [TWIP CLIP 프로젝트 개발](/about/portfolio/twip-clip) (Next.js, NestJS) * [TWIP 빙빙도네 프로젝트 백엔드 개발](/about/portfolio/twip-bingbing) (NestJS, Socket.io) * 사이드 프로젝트 - [레븐 Portal 개발](/about/side/leaven-portal) (Next.js, NestJS) * [TWIP 핀볼게임 프로젝트 개발](/about/portfolio/twip-pinball) (Next.js) * 사이드 프로젝트 - [아카이버스 개발](/about/side/archivers) (Next.js, NestJS, Kubernetes) * 이제이엔 퇴사 (2023.12) ### 2024 (25세, 대학원1, 개발자 6년차) * 하이퍼커넥트 입사 (2024.01) * [크리에이터 관리 내부 툴 개발](/about/portfolio/hpcnt-hakuna-backstage) (React.js) * 세종사이버대학교 졸업 (공학사, 2024.02) * 한국외국어대학교 교육대학원 입학 (2024.03) * 산업기능요원 복무 만료 (2024.05) * [INFCON 2024](/about/speech/infcon-2024) 발표 (2024.08) * [UbuCon Korea 2024](/about/speech/ubucon-korea-2024) 발표 (2024.08) * [전사 내부 플랫폼 개발 및 운영](/about/portfolio/hpcnt-internal-platform) (Next.js, NestJS) ### 2025 (26세, 개발자 7년차) * [재무데이터 파이프라인 및 대시보드 개발](/about/portfolio/hpcnt-finance-dashboard) (Databricks, Tableau) * [내부 데이터베이스 스키마 관리 플랫폼 개발](/about/portfolio/hpcnt-hurricane) (Next.js, NestJS, Kafka, Python) * 사이드 프로젝트 멜로밍 출시 (2025.08) ### 2026 (27세, 개발자 8년차) * [사내 AX TF 운영 및 AI 개발도구 도입](/about/portfolio/hpcnt-ax-tf) (Cursor, Claude Code) * 하이퍼커넥트 퇴사 (2026.03) * 디와이랩스 풀타임 창업 (2026.03) # 포트폴리오 (경력기술) 포트폴리오 메뉴에서는 회사 내에서 진행한 프로젝트를 기술합니다. # 멜로밍 커미션 스트리머와 팬, 커미션 작가를 연결하는 거래형 크리에이터 플랫폼 ## 개요 버추얼 스트리머와 팬, 커미션 작가를 연결하는 거래형 크리에이터 플랫폼입니다. 멜로밍의 노래책과 콘텐츠 기능을 기반으로 실제 창작물의 의뢰와 거래가 이루어지는 영역까지 제품을 확장했습니다.\ 기간 : 2025년 6월 \~ 2026년 8월 중 운영\ 회사 : 디와이랩스\ 담당 범위 : 제품 기획, Frontend, Backend, 결제·정산, Infrastructure ## 주요 기술 스택 ### Frontend TypeScript, React, Next.js ### Backend & Infrastructure Node.js, NestJS, Prisma, PostgreSQL, Redis, AWS, Kubernetes, Cloudflare ## 상세 설명 ### 프로젝트 설명 2인 팀으로 커미션의 의뢰와 거래가 실제로 이루어지는 제품을 기획하고 개발했습니다. 제품 개발뿐 아니라 결제 심사, 지급대행, 세무, 배송과 고객 대응까지 실제 사업 운영에 필요한 절차를 함께 설계했습니다. ### 주요 기능과 운영 주문부터 결제, 정산, 환불까지 이어지는 거래 흐름을 설계했습니다. 커미션에서 시작해 선물하기, 스토어, 렌탈 등 다양한 거래형 제품으로 확장했습니다. 이용자와 창작자가 거래 상태를 함께 확인하고 운영자가 필요한 조치를 할 수 있도록 하나의 제품 안에서 관리했습니다. ### 기술적 챌린지 창작물 의뢰처럼 단계가 긴 거래에서 주문, 결제, 정산, 환불의 상태 흐름을 일관되게 설계했습니다. 결제 시스템뿐 아니라 지급대행, 세무, 배송과 고객 응대까지 연결되는 운영 프로세스를 제품에 반영했습니다. 작은 팀에서도 거래 서비스의 안정성을 유지할 수 있도록 핵심 서비스의 테스트와 CI 통과를 병합 조건으로 운영했습니다. # 멜로밍 랭킹 여러 방송 플랫폼의 실시간 데이터를 수집·분석하는 스트리머 랭킹 서비스 ## 개요 치지직, SOOP, 씨미 등 여러 방송 플랫폼의 실시간 방송과 채팅 데이터를 수집·분석해 스트리머 랭킹과 통계를 제공하는 서비스입니다.\ 기간 : 2025년 6월 \~ 2026년 8월 중 운영\ 회사 : 디와이랩스\ 담당 범위 : 제품 기획, Backend, Data Platform, Infrastructure ## 주요 기술 스택 ### Backend & Data Go, PostgreSQL, Redis Streams, ClickHouse ### Frontend Next.js, TypeScript ### Infrastructure Kubernetes, KEDA, Prometheus, Grafana, Loki ## 상세 설명 ### 프로젝트 설명 방송 플랫폼마다 서로 다른 실시간 데이터 수집 방식을 하나의 파이프라인으로 통합하고, 수집한 방송과 채팅 데이터를 랭킹과 분석에 활용할 수 있도록 분산 데이터 플랫폼을 구축했습니다. ### 운영 규모 최대 11,400개 채널을 동시에 수집하고 일평균 1,700만 건, 피크 2,100 msg/s의 채팅을 처리했습니다. 평상시 14\~16개 Pod에서 피크 32개 Pod까지 자동 확장하도록 운영했습니다. ### 기술적 챌린지 Discovery, Coordinator, Worker로 역할을 분리해 플랫폼별 채널 탐색과 작업 분배, 실제 수집 워크로드를 독립적으로 확장할 수 있게 설계했습니다. Redis Streams는 실시간 이벤트 전달에, PostgreSQL은 제어 상태 관리에, ClickHouse는 대규모 분석에 사용했습니다. KEDA와 Kubernetes를 이용해 트래픽 변화에 따라 수집 Worker가 자동으로 확장되도록 구성하고 관측 환경을 함께 구축했습니다. # 멜로밍 2인 팀으로 개발·운영한 버추얼 스트리머 올인원 플랫폼 ## 개요 버추얼 스트리머와 팬, 커미션 작가를 연결하는 크리에이터 플랫폼입니다. 노래책 기능에서 시작해 콘텐츠, 커미션, 선물, 스토어로 제품을 확장하고 웹과 모바일 앱, 방송 도구까지 하나의 서비스로 운영했습니다.\ 기간 : 2025년 6월 \~ 2026년 8월\ 회사 : 디와이랩스\ 담당 범위 : 제품 방향 결정, 웹·모바일 개발, 결제·정산, 인프라 운영, 고객 대응 ## 주요 기술 스택 ### Product Engineering TypeScript, React, Next.js, Node.js, NestJS, Python, FastAPI ### Data & Infrastructure Go, PostgreSQL, Redis, ClickHouse, AWS, Kubernetes, Cloudflare ### Mobile & Tools SwiftUI, Kotlin, Chrome Extension, Stream Deck ## 상세 설명 ### 프로젝트 설명 2인 팀으로 버추얼 스트리머가 방송 전·중·후에 사용할 수 있는 올인원 플랫폼을 개발하고 운영했습니다. 제품 기획과 개발뿐 아니라 결제, 정산, 고객 대응을 포함한 사업 운영 전반을 담당했습니다. ### 주요 성과 출시 1년 만에 회원 16,000명, MAU 6만, 누적 거래액 1억 원을 달성했습니다. 국내 버추얼 스트리머 약 3명 중 1명이 사용하고, 스트리머 채널 3,600여 개가 사용하는 서비스로 성장했습니다. 웹, iOS, Android, 크롬 확장프로그램, Stream Deck을 2인 팀으로 개발하고 운영했습니다. ### 기술적 챌린지 실시간 방송과 채팅을 수집하는 분산 데이터 플랫폼을 구축해 최대 11,400개 채널과 일평균 1,700만 건의 채팅을 처리했습니다. 웹·모바일·OBS가 공유하는 재생 상태를 상태 수렴 구조로 재설계해 동기화 트래픽을 80% 이상 줄였습니다. AI 에이전트를 개발 전 과정에 활용하고 테스트, CI, 저장소별 가드레일을 통해 품질 기준을 운영했습니다. # 사내 AX TF 운영 및 AI 개발도구 도입 AI 개발 도구 도입부터 사내 활용 환경과 교육까지 연결 ## 개요 사내 AX 활동을 통해 생성형 AI 개발 도구를 검토하고, 보안·개인정보·법무 요구사항을 충족하는 도입 절차와 활용 환경을 만들었습니다. 도구 도입에 그치지 않고 구성원이 실제 업무에서 사용할 수 있도록 공통 플랫폼과 교육까지 연결했습니다.\ 기간 : 2024년 1월 \~ 2026년 3월 재직 중 수행\ 회사 : 하이퍼커넥트 (Match Group)\ 담당 범위 : PoC, Vendor 협의, Enterprise 도입, 사내 AI Platform 개발 및 교육 ## 주요 기술 스택 ### AI Development Tools Cursor, Claude Code, Sourcegraph, MCP ### Platform & RAG LibreChat, Amazon Bedrock, pgvector, OpenSearch ## 상세 설명 ### 프로젝트 설명 여러 생성형 AI 개발 도구를 검토하고 실제 업무에서 안전하게 사용할 수 있도록 도입 절차와 공통 활용 환경을 구축했습니다. 도구의 품질과 사용성을 검증하는 것부터 보안, 개인정보, 법무 검토와 계약 협의, 도입 이후의 운영과 교육까지 연결했습니다. ### 주요 업무 여러 AI 개발 도구의 PoC를 수행하고 품질과 사용성을 검토했습니다. 해외 공급사와 계약 조건을 협의하고 Privacy, Security, Legal 검토를 조율했습니다. 사내 공통 MCP Gateway와 여러 LLM을 사용할 수 있는 공통 환경을 구축하고 활용법 교육을 진행했습니다. ### 대표 프로젝트 여러 모델과 프롬프트를 같은 조건에서 비교할 수 있는 번역 에이전트 테스트베드를 구축하고, 검증된 에이전트를 API와 스프레드시트 도구로 제공했습니다. 사내 인프라 정보를 기반으로 장애 리서치와 트러블슈팅을 지원하는 RAG·Agent PoC를 개발했습니다. # 전사 내부 플랫폼 개발 및 운영 개발 우선순위 밖에 있던 사내 업무를 제품과 플랫폼으로 전환 ## 개요 하이퍼커넥트에서 새롭게 만들어진 Internal Platform Unit의 첫 엔지니어로 합류했습니다. 약 1년 동안 1인 조직으로 일했고, 이후 엔지니어 1명이 합류해 2인 체제로 운영했습니다.\ 기간 : 2024년 1월 \~ 2026년 3월\ 회사 : 하이퍼커넥트 (Match Group)\ 담당 범위 : 사용자 인터뷰, 기획, 시스템 설계, Frontend, Backend, 배포 및 운영 ## 주요 기술 스택 ### Product Engineering TypeScript, React, Next.js, Node.js, NestJS, Python ### Platform & Data Kafka, BigQuery, Databricks, AWS, Kubernetes, Okta, Slack ## 상세 설명 ### 프로젝트 설명 기존에는 각 조직에 필요한 내부 도구를 전담해서 개발하는 역할이 없었습니다. 필요한 기능은 다른 엔지니어가 본업 사이에 지원하거나 개인적인 요청을 통해 단발성으로 만들어지는 경우가 많았습니다. Internal Platform Unit은 개발 인력과 우선순위를 확보하지 못해 해결되지 않던 사내 업무를 제품과 플랫폼으로 전환하기 위해 만들어졌습니다. ### 주요 업무 반복적인 사내 요청과 담당자 배정을 연결하는 업무 자동화 도구를 개발했습니다. 구성원의 일정 정보를 정해진 시점에 공유하는 협업 도구를 개발했습니다. 중앙 관리자 권한을 직접 배포하지 않고도 역할 기반 권한 관리가 가능하도록 중간 계층을 만들었습니다. 데이터 거버넌스, 재무, AI Enablement 영역의 내부 플랫폼을 설계하고 운영했습니다. ### 문제 해결 방식 사용자 인터뷰와 기존 업무 관찰을 통해 문제를 발굴하고, 전용 Slack 채널에서 첫 시안의 윤곽을 함께 정했습니다. 시안을 공유한 뒤 반복적인 피드백으로 제품을 개선하고, 효과가 검증된 도구는 전사에 공유하거나 공통 플랫폼으로 확장했습니다. # 내부 데이터베이스 스키마 관리 플랫폼 데이터 스키마 변경과 개인정보 처리 정책을 연결한 거버넌스 플랫폼 ## 개요 대규모 데이터 환경에서 데이터 스키마 변경과 개인정보 처리 정책을 일관되게 관리하기 위한 내부 플랫폼을 개발했습니다. 스프레드시트와 개별 담당자의 수작업에 의존하던 절차를 반복 가능한 리뷰와 승인 흐름으로 전환했습니다.\ 기간 : 2024년 1월 \~ 2026년 3월 재직 중 수행\ 회사 : 하이퍼커넥트 (Match Group)\ 담당 범위 : 기획, 시스템 설계, Frontend, Backend, Data Pipeline 연동 ## 주요 기술 스택 ### Frontend & Backend Next.js, NestJS, Python ### Data & Integration Kafka, BigQuery, Slack ## 상세 설명 ### 프로젝트 설명 데이터 스키마 변경과 개인정보 익명화, 삭제, 보존 정책을 하나의 흐름으로 연결한 사내 데이터 거버넌스 플랫폼을 개발했습니다. 개발자가 일상적으로 수행하는 스키마 변경 과정 안에 담당자 리뷰와 승인 절차가 자연스럽게 포함되도록 설계했습니다. ### 주요 업무 신규·변경 스키마를 자동으로 탐지하고 담당자 리뷰 태스크를 생성했습니다. 복잡한 중첩 데이터와 문자열 형태의 JSON 필드까지 분석해 정책 적용 범위에 포함했습니다. 개인정보 처리 정책과 데이터 파이프라인을 연계하고, 담당자 알림과 기한 기반 리마인더를 자동화했습니다. ### 기술적 챌린지 스키마 변경 이벤트를 비동기 메시지로 전달하고 중복 이벤트를 안전하게 처리했습니다. 정형 스키마뿐 아니라 레거시 형태의 중첩·문자열 데이터까지 일관된 정책을 적용했습니다. 담당자의 반복 작업을 줄이면서도 검토와 승인 책임은 명확하게 유지할 수 있도록 워크플로를 설계했습니다. # 재무데이터 파이프라인 및 대시보드 개발 조직별 재무 데이터를 안전하게 조회하는 셀프서비스 분석 환경 ## 개요 여러 조직이 필요한 재무 정보를 직접 조회할 수 있도록 데이터 파이프라인과 대시보드를 구축했습니다. 담당 조직이 요청마다 원장 데이터를 수작업으로 추출해 전달하던 방식을 셀프서비스 분석 환경으로 전환했습니다.\ 기간 : 2024년 1월 \~ 2026년 3월 재직 중 수행\ 회사 : 하이퍼커넥트 (Match Group)\ 담당 범위 : 요구사항 분석, Data Pipeline, Dashboard, 접근 제어 및 운영 자동화 ## 주요 기술 스택 ### Data Platform Databricks, Delta Lake, S3 ### Dashboard & Access Control Tableau, RBAC, Audit Log ## 상세 설명 ### 프로젝트 설명 원장, 환율, 예산, 조직 데이터를 결합한 재무 데이터 파이프라인을 구축하고, 여러 조직이 필요한 Expense·Revenue 정보를 직접 조회할 수 있는 대시보드를 제공했습니다. 데이터 제공 요청마다 담당자가 수작업으로 추출하던 흐름을 조직별 셀프서비스 분석 환경으로 전환했습니다. ### 주요 업무 그룹 공통 원장 데이터의 정기 적재 흐름을 확보했습니다. 기존 조회 계층을 분석과 운영에 적합한 데이터 레이크 구조로 이전했습니다. 조직별 데이터 소스 연결과 대시보드 권한 설정을 자동화했습니다. ### 기술적 챌린지 서로 다른 기준의 원장, 환율, 예산, 조직 데이터를 일관된 분석 모델로 통합했습니다. 각 조직이 소속 조직의 재무 정보만 조회하도록 데이터와 대시보드 권한을 함께 격리했습니다. 감사 로그와 이상 접근 알림을 구성해 셀프서비스 환경에서도 접근 이력을 확인할 수 있도록 했습니다. * # 크리에이터 관리 내부 툴 개발 ## 개요 크리에이터 영입과 관리를 원활히 하기 위해 내부와 관련 인원들이 사용할 내부 툴 개발 * 기간 : 2024년 2월 \~ 2024년 5월 (약 3개월) * 회사 : 하이퍼커넥트 * 담당 범위 : Frontend ## 주요 기술 스택 ### Frontend * React.js (Vite), Typescript * Data Fetching : Relay (GraphQL) * Styling : Material UI * Auth0, i18n (react-i18next) ## 상세 설명 ### 프로젝트 설명 Hakuna Live 서비스의 Host 영입을 위해 내부적으로 사용할 툴을 개발했습니다. DevOps 팀 소속이지만 프로젝트 TF에 Frontend 인력으로 참여하여, 기존 Hakuna Web 팀과의 협업을 통해 프로젝트의 출시까지 마쳤습니다. ### 기술적 챌린지 * GraphQL을 처음 써봤는데, 특히 프론트에서 사용한 Relay 라이브러리의 러닝커브가 꽤 있어서 초반에 어려움을 겪었습니다. 나중에 적응되었을 때 보니 GraphQL의 장점이 많이 보였습니다. 특히 메인 서비스의 도메인과, 관리 툴 내부적인 도메인이 섞여있다보니 필요에 따라 데이터를 꺼내올 수 있다는 장점이 크게 다가왔습니다. 그리고 이 기회를 통해 GraphQL 경험도 얻을 수 있게 되었습니다. # TWIP 핀볼게임 2주만에 출시한 오픈소스 기반 핀볼게임 후원 ## 개요 {% embed url="" %} pinball.twip.kr {% endembed %}

후원액수에 따라 핀볼 구조물 내에 구슬을 만들고, 시작을 누르면 구슬이 떨어지며 가장 먼저 결승선을 통과한 구슬이 1등을 차지하는 웹 게임 * 기간 : 2023년 8월 3일 \~ 2023년 8월 18일 * 회사 : 이제이엔 * 담당 범위 : 전체 ## 주요 기술 스택 ### Frontend * Next.js * Chakra UI * Socket.io ## 상세 개발 과정 ### 프로젝트 진행 과정 프로젝트를 처음 시작한 계기는 직원분들과 점심시간에 아프리카TV에서 유행하고 있는 '핀볼게임'이라는 컨텐츠를 이야기하다가, 그걸 가져와서 후원시스템을 붙여보면 재밌겠다고 아이디어가 떠올랐습니다. 그래서 퇴근 이후 저녁시간을 들여 이틀정도만에 빠르게 PoC 수준의 제품을 만들고 사내에 공유했습니다.

반응이 꽤 괜찮았고, 그 다음 주에 이틀정도 작업할 수 있는 시간을 받아서 피드백을 반영하고, 공개 가능한 수준까지 완성도를 끌어올렸습니다. 이후 내부 검토 과정과 홍보물 준비 과정을 거쳐 최초 공유 2주만인 8월 18일에 제품을 출시했습니다! :tada: {% embed url="" %} 홍보 게시물 (유튜브 쇼츠 + 홍보채널 게시물 + SNS) {% endembed %} ### 개발 과정 > 원본 게임 레포 : MIT 라이센스 오픈소스 게임을 바탕으로, 기존 HTML + Typescript 구조를 Next.js 기반으로 포팅하고, Chakra UI로 디자인을 씌우고, 트위치 로그인을 붙여서 내부 API 호출을 통해 스트리머의 토큰을 받아올 수 있도록 구성했습니다. 이를 통해 스트리머는 한 번의 트위치 로그인만 거치면, 자동으로 후원금이 구슬로 생성되는 모습을 볼 수 있게 되었습니다. ## 성과 * 따로 프로모션이나 이벤트를 진행하지 않았음에도 출시 첫 달 핀볼게임을 통한 **후원액 500만원**을 달성했습니다. * 아무런 기획도 없이 아이디어를 가볍게 구현해보고, 이를 제품화시켜 출시까지 해본 재미난 경험이었습니다. 투입한 리소스 대비 효율이 좋았고, 앞으로 꾸준히 맵 추가나 기능 개선 등이 이뤄진다면 지속적으로 매출을 발생시킬 수 있을 것으로 예상합니다. # TWIP 빙빙도네 트윕 신규 돌림판 후원 기능 '빙빙도네' ## 개요 {% embed url="" %} 출시 공지 {% endembed %}

{% embed url="" %} 빙빙도네 잭팟 이벤트 {% endembed %} 시청자가 돌림판 항목을 정해 후원을 보내면 스트리머가 돌림판에서 당첨된 금액만큼 받아가는 신규 후원 '빙빙도네' * 기간 : 2023년 4월 \~ 2023년 6월 * 회사 : 이제이엔 * 담당 범위 : 백엔드 전체 (스트리머 대시보드, 시청자 후원 API, 위젯 웹소켓) ## 주요 기술 스택 * NestJS * Sequelize * MySQL, Redis * socket.io * CodeIgniter 3 ## 상세 개발 과정 회사 로드맵에 따라 신규 후원기능 프로젝트에 백엔드 개발자로 투입되어 백엔드 전체를 담당했습니다. 초기 기획 단계부터 프로젝트의 성공을 위해 기술적인 부분과 고객 관점에서의 의견 제시, 아이디어 제시를 많이 했습니다. 그렇게 기획 리뷰 -> 디자인 리뷰 -> 개발 -> QA 과정을 거쳐 2개월 가량만에 신규 후원기능을 출시했습니다. 백엔드에서는 기존 후원시스템 대비 프로세스가 복잡하여 체계적인 설계가 필요했으며, 설계 단계부터 문서화를 진행하여 개발 과정에 포함되어있던 대부분의 기술적인 내용이 컨플루언스 문서로 남게 되었습니다. 이 덕분에 추후 트러블슈팅 상황에서 도움을 많이 받았고 인수인계도 원활히 이루어질 수 있었습니다. 사내 기술스택에 맞춰 기존 레포에 NestJS 기반으로 필요한 API를 개발했습니다. 특히 후원 API의 경우 검증 로직과 후원 과정을 분리하였고, 트랜잭션을 적절히 적용하여 안정적인 후원 과정이 이뤄지도록 했습니다. 이외 크론성 작업은 Redis Lock을 이용하여 여러 대의 파드로 구동되는 상황에서도 한 대에서만 로직이 동작하도록 중복 방어를 수행했습니다. 스트리머 대시보드의 경우 레거시(PHP) 위에서 작업해야해서 FE 리소스 없이 제가 Bootstrap + jQuery 기반으로 프론트 작업, 백엔드 작업을 함께 진행했습니다. 이외 오버레이(위젯)에서 연결되는 소켓 서버쪽 코드까지 작성했습니다. 현재는 후원 페이지 코드가 신규로 완전히 개편되었는데, 개발 당시에는 레거시/신규가 공존하던 상황이라서 PHP와 NestJS 코드 간 동일한 Redis cache를 공유하며 여러 문제가 발생하였습니다. 가령 PHP와 JS가 JSON을 다루는 방식이 달라서 Redis에 저장되는 Cache Value가 노드 환경에서 이상하게 인식되는 문제가 있었는데, 이는 신규 캐시 키를 v2로 분리하고, 레거시/신규 각각의 invalidate 코드에 v2도 함께 invalidate하는 방식으로 대응했습니다. ## 성과 * 출시 5개월만에 누적 후원액 2억원을 달성했습니다. * 출시 이전 체계적인 구조 설계와 꼼꼼한 QA 덕분에 출시 이후 장애나 중대한 버그가 발생하지 않았습니다. * 모바일 프로덕트팀 소속때는 iOS/AOS 개발자와 커뮤니케이션을 했는데, 이번에 처음으로 FE 개발자와 함께 프로젝트에서 호흡을 맞춰보게 되었습니다. 이전에 TWIP VOD\&CLIP과 TWIP CLIP 작업을 하면서 프로덕션 레벨에서 FE를 다뤄봐서 그런지 커뮤니케이션이 수월했고 큰 문제 없이 개발을 마쳤습니다. # TWIP CLIP 트위치 실시간 클립 생성/시청이 가능한 영상 기반 커뮤니티 ## 개요 {% embed url="" %} 트윕 클립 웹사이트 (vod.twip.kr) {% endembed %} {% embed url="" %} 트윕 클립 리뉴얼 업데이트 공지 {% endembed %}

트위치 생방송 중에 1분 이내의 클립을 따고, 이를 시청/공유/다운로드할 수 있는 클립 서비스 * 기간 : 2023년 3월 \~ 2023년 4월 * 회사 : 이제이엔 * 담당 범위 : Product Owner (프로덕트 로드맵 설계, 프로젝트 관리), 프론트엔드 전체, 백엔드 일부 ## 주요 기술 스택 ### Frontend * Next.js * Mantine UI * Tailwind CSS * SWR ### Backend * NestJS * Sequelize * MariaDB, Redis * Cloudflare R2 * ffmpeg ## 상세 개발 과정 ### 배경 기존에 다시보기 서비스로 운영하던 [TWIP VOD & CLIP](/about/portfolio/twip-vod-clip)가 다시보기 기능을 포기하고 클립 기능을 확대, 개선하여 TWIP CLIP 서비스로 리뉴얼 출시하였습니다. TWIP CLIP 서비스로의 전환 이전 준비 과정에서, 프로덕트를 제일 잘 이해하고 있는 제가 직접 제품의 방향성을 결정하고, 프로젝트의 주도권을 쥐고 진행할 수 있도록 Product Owner 역할을 경험할 기회를 제공받았습니다. ### 리뉴얼 프로젝트 설계 우선 아직 정식 프로덕트는 아니었기 때문에 많은 리소스를 투입할 수 없었고, 대신 신입급 백엔드개발자 한 명 리소스를 지원받아 프로젝트를 시작하였습니다. 먼저 기존 코드에서 리팩토링이 필요한 부분과 해결해야 할 각종 버그들이 많이 남아있었고, 클립 서비스로의 전환을 위해 백엔드의 많은 부분도 변경이 필요했습니다. 여기에 다양한 아이디어와 VoC들까지. 그냥 봐도 요구사항이 너무 많아서, 일단 하나의 문서에 모든 요구사항들을 나열하고 그 중에 우선순위를 정하는 과정을 진행했습니다. 그렇게 정해진 우선순위와 요구사항들을 바탕으로 2\~4분기가 포함된 연간 로드맵, 2분기 내에 진행할 3차례 스프린트, 마지막으로 이를 위한 첫번째 스프린트 계획까지. 총 3개의 로드맵 문서를 만들고 디렉터급 이상의 리뷰를 받았습니다. 그렇게 3주짜리 첫 번째 스프린트를 시작했습니다. ### 첫 번째이자 마지막 스프린트 정말 3주간 미친듯이 달렸던 것 같습니다. 백엔드에서 변경되어야 할 주요 API와 DB구조 등 수정을 진행하고, 그 중 일부 작업은 백엔드개발자분과 함께 진행했습니다. (일종의 온보딩 프로젝트 역할까지 겸해서 진행) 이 과정에서 백엔드 개발자분이 코드를 이해하고 개선해나가는 과정에서 발전이 느껴져 기쁘기도 했습니다. Frontend쪽도 많은 개선을 이뤘습니다. 일단 전체 페이지의 UI 구조를 모두 변경했습니다. 기존에도 디자이너 리소스 없이 프로젝트를 진행했지만, 이번에는 회사에서 예전에 핫클립 관련하여 기획해뒀던 디자인 리소스가 있어 이를 일부 참고하여 UI 구조를 짰습니다. 다행히 레퍼런스가 있었기 때문에 UI 짜는 건 어렵지 않았으나, 리팩토링 과정에서의 시간은 예상보다 꽤 오래 걸렸습니다. 기존에는 useEffect 내에서 api 호출을 하는 부분이 많았으나, 이를 모두 SWR 기반으로 변경하여 data fetching 시의 여러 문제들을 개선하였습니다. 이외에도 컴포넌트 분리, 누락된 타입 보충 등 리팩토링에 필요한 주요 작업들을 진행했습니다. 기능적인 면에서도 다크모드, PWA 지원, SEO 개선 등 다양한 발전이 이뤄졌습니다. 특히 다크모드는 VoC 가운데 1위를 차지할 정도로 유저의 요구도가 높은 부분이었는데, 디자인 시스템에서 제공하는 기능을 이용해 빠르게 구현했습니다. 이외에도 마이페이지 전면 개선, 트위치 채팅봇 '싹둑이'로 클립 생성하기 기능 등 다양한 피쳐를 스프린트 기간 내에 진행된 3번의 스프린트에서 모두 소화해냈습니다. ### 스프린트 종료 이후 비록 모든 기능을 출시해내기 위해 1주의 시간이 추가되어 총 4주가 들어갔지만, 산적했던 코드상의 문제점들을 리팩토링을 통해 일시에 해소했고, UI적인 개선도 대폭 이뤄냈으며, 비용 역시 크게 절감할 수 있었습니다. (신입 개발자의 실력 성장은 덤) 안타깝게도 회사 내의 리소스 분배와 여러 사정으로 인해, 스프린트 종료 이후 저는 PO의 자리를 다른 전문 PM분께 넘기고 [TWIP 빙빙도네](/about/portfolio/twip-bingbing) 프로젝트에 투입되었습니다. ## 성과 * MAU 최대 4.2만명 달성 * 지표가 매월 최소 20\~30% 이상씩 성장 중 * 4월 28일 출시 이후, 5월 클립 생성 수 2,000여개에서, 매월 꾸준히 성장하여 10월에는 25,000여개까지 급성장 (5개월만에 1250% 성장) * 클립 조회수 역시 5월 대비 10월에 5배 이상 성장 * 2023년 10월 기준 매일 평균 800\~1,000여개의 클립 생성 * 클립을 이용한 영상 후원 사용금액도 지속적으로 성장 중 # TWIP VOD & CLIP 트위치 다시보기와 클립 생성이 가능한 영상 기반 커뮤니티 ## 개요 {% embed url="" %} TWIP VOD & CLIP 베타 출시 공지 {% endembed %}

트위치 라이브 스트리밍 다시보기를 녹화해주는 서비스 'TWIP VOD & CLIP' * 기간 : 2023년 1월 \~ 2023년 2월 * 회사 : 이제이엔 * 담당 범위 : 프론트엔드 일부, 백엔드 전체 ## 주요 기술 스택 ### Frontend * Next.js * Mantine UI * Tailwind CSS * Recoil ### Backend * NestJS * Sequelize * MariaDB, Redis * Cloudflare Stream * ffmpeg ## 상세 개발 과정 ### 배경 기존에 팀 단위 사이드 프로젝트로 [Clippy - MAU 4만 달성! (2022.11)](/about/side/clippy) 프로젝트를 운영 중이었습니다. 서비스가 커지면서 비용부담이 커지기 시작했고, 이에 회사로 프로덕트를 들여오는 논의를 시작했습니다. Clippy 서비스는 클립 위주의 서비스였지만, 서비스 통합 논의가 진행된 사업부에서는 다시보기 위주의 서비스를 희망했습니다. 이에 기존에 Clippy에서 사용하던 Cloudflare Stream을 활용하여 다시보기 프로덕트로 피봇하는 쪽으로 결정을 내렸습니다. 다만 프로덕트를 회사 내부로 가져오는 과정 속에서 몇몇 이슈들이 발생하였고 (자세한 내용은 Clippy 문서에서), Clippy 서비스 종료와 TWIP VOD & CLIP 서비스 출시를 동시에 진행하는 방향으로 계획이 잡혔습니다. ### 베타 서비스 오픈 - PoC 진행 기본적으로 회사에서 진행하는 주요 로드맵 프로젝트에 포함되지 않았기 때문에 업무 외 시간을 주로 이용해서 작업을 진행했습니다. 회사 내 프론트엔드 개발자 한 분이 도와주셔서, 그 분 주도로 프론트 구조개선과 트윕 서비스로의 전환 과정이 이뤄졌습니다. 다만 백엔드와 Cloudflare쪽 컨택 등 다른 작업들은 모두 제가 맡아서 진행했습니다. 약 한달여간의 추가개발 및 오픈준비와 함께 2월 중순경 TWIP VOD & CLIP 서비스를 베타로 오픈했습니다. ### Cloudflare Stream 서비스에서의 이슈 지속적 발생 TWIP VOD & CLIP 서비스는 Cloudflare Stream이라는 스트리밍 서비스를 적극적으로 활용 중이었습니다. Cloudflare가 제공하는 RTMP 서버와 secret key를 스트리머에게 제공하고, 스트리머는 Cloudflare 서버쪽으로 방송을 진행합니다. 그러면 Cloudflare가 트위치로 재송출하고, 이 과정에서 중간에 남은 다시보기 영상을 취하는 방식입니다. 그런데 Cloudflare Stream 서비스가 예상보다 안정적으로 동작하지 않았고, 생방송 송출이 끊기거나 다운로드가 잘 안되는 등 문제가 많았습니다. 이런 이유로 다운로드가 안되는 영상의 보관기간을 늘리는 등 필요한 조치를 취하다보니 예상보다 비용이 많이 발생하였습니다. 종합적인 검토 결과 비용, CS 인입건수, 개발인력 등 문제로 다시보기 서비스는 점진적으로 축소&종료하고, 기존 Clippy처럼 클립 위주의 서비스로 다시 방향을 틀게 됩니다. 이후 [TWIP CLIP](/about/portfolio/twip-clip) 서비스로 리뉴얼되었습니다. ## 성과 * TWIP 유료 구독서비스 'TWIP Pro' 서비스 단기 무료체험유저가 출시 이전 대비 300% 이상 증가 * TWIP 유료 구독서비스 'TWIP Pro' 서비스 정기 구독자수가 출시 이전 대비 23% 증가 * 정기구독으로의 전환율은 다소 낮으나, TWIP Pro에서 제공하는 다른 기능들도 체험하며 서비스 종료 이후에도 출시 이전 대비 높은 가입자수 유지 중 # TWIP/TGD APP 모바일 TWIP 후원 기능 개발 및 인터넷 방송 커뮤니티 트게더 앱 유지보수 ## 개요 {% embed url="" %} 출시 공지 {% endembed %}

![](https://1684734951-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmimrGhfjYz2ryftsgeEa%2Fuploads%2FwMwHAQckkjdJ6a3G0NW1%2Ftwip-app-2.png?alt=media\&token=1e1e123c-fefd-4dc3-8afc-2c9ff7c25c77) 안드로이드 '트게더' 앱 내에서 TWIP 후원이 가능하도록 하는 프로젝트 * 기간 : 2022년 5월 \~ 2022년 12월 * 회사 : 이제이엔 * 담당 범위 : 백엔드 전체 ## 주요 기술 스택 * NestJS * MySQL / Redis * Swagger UI * PHP CodeIgniter 3 ## 상세 개발 과정 ### 모바일 프로덕트팀 합류 모바일 프로덕트팀 소속 전임 백엔드분 퇴사로 어쩌다보니 입사 2개월차에 바로 프로젝트를 맡아서 진행하게 되었습니다. 원래 입사 초기에는 Node.js쪽 숙련도가 낮아 레거시 PHP 위주로 유지보수성 작업들을 하며 코드에 익숙해지고, 차차 NestJS쪽에도 익숙해져가며 신규 프로젝트에도 투입될 것을 기대했는데, 어쩌다보니 빠르게 프로젝트에 투입되었습니다. 이제는 더이상 레거시에 신규 기능을 추가하고 있지 않았기 때문에 신규 NestJS API에 기능들을 붙여야했고, 준비가 많이 되지 않은 상황이었지만 빠르게 개인시간에도 공부를 해가며 NestJS에 익숙해졌습니다. 이 때문에 프로젝트 초반에 백엔드 일정에 다소 지연이 생겼고, 첫 스프린트에는 일부 기능을 PHP로 구현했습니다. 하지만 그 이후에는 백엔드로 인해 일정이 지연된 경우가 거의 없었고, 모든 기능을 신규 코드베이스 위에 만들면서 성공적으로 팀에 온보딩을 마쳤습니다. ### 프로젝트 진행 팀 구성은 Product Manager 1명, Product Designer 1명, Android/iOS 개발자 각 1명, 그리고 Backend 개발자 1명으로 총 5명으로 구성되었습니다. Agile 방법론에 따라 3주 단위의 스프린트를 진행하고, 매일 스탠드업 미팅, 매주 화요일에 위클리 미팅, 매 스프린트가 마치면 회고미팅을 하는 등 빠른 주기로 개발사이클을 가져가고자 노력했습니다. 주로 이번 스프린트에 개발할 큰 아이템이 정해지면 기획/디자인 진행, 디자인 리뷰를 거치며 필요한 API와 화면 기능을 구체화하고, 이 때 정해진대로 남은 기간동안 개발을 진행합니다. 중간중간에 비는 구간이 생기면 PM 재량 하에 백로그 작업이나 리팩토링을 수행했습니다. AOS/iOS 개발자와는 주로 Swagger로 명세를 공유했으며, 필요에 따라 특이사항은 컨플루언스 문서에 기록하여 공유하기도 했습니다. 특히 각 개발과정에서 문서화를 철저히 진행하여 차후 유지보수와 인수인계 등 작업에 문제가 없도록 하였습니다. # EJN 사내 프로덕트 개발 필요에 따라 개발한 사내 프로덕트 ## 사내 슬랙봇 개발 (2023.07)

* 주요 기능 * TWIP 개발서버 캐시 충전, 트위치 유저 조회, 사무실 에어컨 조종, CloudFront Cache invalidate 등 다양한 유틸리티 기능 제공 * 슬랙 ID 기반 기능별 권한 제어 (ex. 개발자만 Cache invalidate 가능) * 모든 요청에 대해 Google Drive 스프레드시트에 Audit log 기록 * 개발 배경 : 기존에 파이썬 슬랙봇이 있었는데 개발했던 직원 퇴사 후 관리도 되지 않고 있고 기능도 제한적이어서, 현재 회사 기술스택에 맞춰 NestJS로 신규 개발 진행. * 개발 기간 : 2일 (주말) * 사용 기술 : NestJS, Zod, Google Drive API, Ngrok * 특이 사항 : 문서화도 함께 진행하여 다른 개발자들도 쉽게 기여할 수 있고, 실제로 쓰고 싶은 기능을 만들어 PR로 올려주기도 하였음. 로컬 개발시에는 Ngrok을 적극 활용하여 슬랙 연동을 하였음. ## EJN GPT (2023.03)

* 주요 기능 : OpenAI와 여러 생성형 AI 제공 업체의 API를 통해 여러 AI 모델들을 사용해볼 수 있음. * 개발 배경 : ChatGPT Plus를 유료 결제해서 사용하는 직원들이 평상시 사용하는 만큼을 API 호출로 사용한다면 $20 가격 대비 훨씬 저렴하게 이용할 수 있다는 점에 착안, 공통 API 키로 사용하면 전체적으로 비용을 아낄 수 있을 것 같아서 개발하였음. * 개발 기간 : 1일 * 사용 기술 : Next.js, Chakra UI, NestJS, Cloudflare Pages, Cloudflare Access * 특이 사항 : Cloudflare Pages에 배포하여 따로 CI/CD 파이프라인을 구축하지 않아도 자동으로 배포가 되고, Cloudflare Access를 이용하여 회사 직원들만 구글 계정으로 인증하여 들어와서 사용할 수 있음 (접근제어) ## EJN Meal (2022.10)

* 주요 기능 : 회사 위치(삼성동) 근처의 배달 음식점을 웹상에서 검색해서 보여주고, 음식점별 메뉴와 가격까지 볼 수 있음 * 개발 배경 : 원래 예전에 있던 개발자분이 배민API를 우회해서 웹상에서 배민 음식점을 검색하고 메뉴를 볼 수 있는 웹페이지를 만들어주셨는데, 퇴사하신 이후에도 잘 쓰다가 어느 순간 접속이 안 되어 빠르게 대체 서비스를 만들어보았습니다. * 개발 기간 : 11시간 * 담당 분야 : Frontend 일부, Backend API 전체 * 사용 기술 : Next.js, Mantine UI, NestJS * 내부 구조 : 공개되어 있는 비공식 요기요 API를 우회하여 요기요 음식점 기준으로 데이터 표시. 현재는 요기요가 Cloudflare를 적용하여 서버에서 호출하면 봇 체크가 떠서 사용하지 못하는 중 # i.M 택시 예약서비스 웹뷰 개발 프리미엄 택시 호출 서비스 i.M 택시 예약기능 웹뷰 페이지 개발 ## 개요 * 기간 : 2021년 11월 1일 \~ 2021년 12월 31일 * 회사 : 엠에이치큐 (아이엠택시) * 담당 범위 : 웹 풀스택 (Backend, Frontend) ## 주요 기술 스택 ### Frontend * Bootstrap + jQuery * (Webview) Vanilla Javascript & jQuery ### Backend & Infrastructure * PHP CodeIgniter 4 (PHP 7.2) * MySQL 5.7 * Linux, Tencent Cloud ## 상세 개발 내용 * 웹뷰 신규 기능 (예약 서비스) 스크립트 개발 (퍼블 제외) # i.M 택시 백오피스 개발 프리미엄 택시 호출 서비스 i.M 택시 백오피스 ## 개요 * 기간 : 2021년 10월 1일 \~ 2022년 4월 15일 * 회사 : 엠에이치큐 (아이엠택시) * 담당 범위 : 웹 풀스택 (Backend, Frontend) ## 주요 기술 스택 ### Frontend * Bootstrap + jQuery ### Backend & Infrastructure * PHP CodeIgniter 4 (PHP 7.2) * MySQL 5.7 * Linux, Tencent Cloud ### Etc. * Python (Cronjob) ## 상세 개발 내용 * 백오피스 기존 기능 유지보수 * Cronjob 소스 작성 (휴면회원 이메일 발송, Python) * i.M 택시 홈페이지 유지보수 (마케팅 상세페이지 추가 등) # HR Platform 직무분석 및 교육과정 개발을 위한 설문 플랫폼 ## 개요 * 기간 : 2021년 4월 1일 \~ 2021년 6월 30일 * 회사 : 미래직업전망연구원 * 담당 범위 : 전체 (Backend, Frontend, Infrastructure) ## 주요 기술 스택 ### Frontend * Bootstrap + jQuery 기반으로 반응형 설계 ### Backend & Infrastructure * PHP CodeIgniter 3 (PHP 7.4) * MariaDB 10.4 (AWS RDS) * AWS EC2 (Linux Debian, Apache, php-fpm) ### Etc. * Github에서 버전 관리 * 소스 커밋시 Jenkins를 통해 EC2 서버에 자동 배포 ## 상세 개발 내용

* 이용자 페이지 전체 개발 (프론트 & 백엔드 & DB) * 관리자 페이지 전체 개발 (프론트 & 백엔드 & DB) 다른 팀의 업무 중 직무분석을 통해 적합한 교육과정을 개발하는 연구용역을 수주하여 수행하는 업무가 있습니다. 비록 다른 팀이긴 하지만 각자 어떤 일을 하고 있는지 업무 공유가 원활히 이뤄져 애로사항을 알고 있었습니다. 직무분석을 위한 기초 설문조사를 받는데, 기존 업무 프로세스는 엑셀이나 워드 파일을 보내서 응답을 기재해서 다시 회신받고, 회신받은 파일을 하나씩 수기로 엑셀에 정리하는 방식으로 되어 있었습니다. 이를 듣고 제가 먼저 플랫폼으로 만들어보자고 제안하였고, 양식을 받아서 개발을 진행했습니다. 핵심 개발은 3주정도 소요되었으나, 여러 요구사항에 대응하고 기능들이 조금씩 추가되면서 2\~3달 가량 다른 프로젝트와 병행하며 프로젝트를 마무리했습니다. 실제로 이후 어느 정도 작업량이 줄었냐는 질문에 데이터를 분류하고 정리하는 프로세스의 경우 90% 이상 단축되었다는 답을 들었습니다. ## 성장 기존 업무 프로세스의 비효율성을 개선하기 위해 직접 프로젝트를 제안하였고, 받아들여져 저의 주도로 실제 업무효율 개선을 이뤄낼 수 있어서 좋은 경험이 된 것 같습니다. # Easy LMS 간편하게 등록하여 사용하는 완전관리형 LMS 서비스 ## 개요 * 기간 : 2021년 3월 1일 \~ 2021년 8월 31일 * 회사 : 미래직업전망연구원 * 담당 범위 : 전체 (Backend, Frontend, Infrastructure) ## 주요 기술 스택 ### Frontend * UIkit Framework 3 + jQuery (어드민 페이지 제외 전체) * Bootstrap + jQuery (어드민 페이지) * 반응형 설계 ### Backend & Infrastructure * PHP CodeIgniter 3 (PHP 7.4) * MariaDB 10.4 (AWS RDS) * AWS EC2 (Linux Debian, Apache, php-fpm) * AWS S3, CloudFront CDN : 동영상 업로드 및 스트리밍 * Cloudflare DNS : 사이트 생성, 삭제시 DNS 처리 ### Etc. * Github에서 버전 관리 * 소스 커밋시 Jenkins를 통해 EC2 서버에 자동 배포 * Youtube Data API 연동 : 유튜브 영상의 메타 데이터와 썸네일 추출 목적 * 결제 연동 (아임포트, KG이니시스) ## 상세 개발 내용

* 수강생용 페이지 전체 개발 (프론트 & 백엔드 & DB) * 강사용 페이지 전체 개발 (프론트 & 백엔드 & DB) * 메인 랜딩 페이지 전체 개발 (프론트 & 백엔드 & DB) * 어드민 페이지 전체 개발 (프론트 & 백엔드 & DB) ## 주요 개발 이슈 및 해결 사례 ### 1) Youtube Upload API의 Quota 문제로 인한 기획 변경 LMS 특성상 영상 업로드가 이뤄져야 하는데, 트래픽과 저장공간 등 비용 부담이 커질 것을 우려해 업로드받은 파일을 유튜브에 올린 후, 별도 플레이어에 유튜브 영상을 씌워 진도관리 등을 하려 하였습니다. 하지만 이후 서칭 중 유튜브 업로드 API에 일일 Quota 제한으로 인해 다이렉트로 유튜브 업로드를 하기 어렵다고 판단하고 기획 수정을 위해 팀에서 논의를 했습니다. 이에 이용자가 직접 유튜브에 영상을 업로드한 뒤 영상의 링크만 제공하는 방식, 영상을 우선 업로드해 이용하고 이후에 유튜브로의 업로드는 관리자가 직접 하는 2가지 방식을 이용하는 방향으로 결론을 냈습니다. 이에 따라 유튜브 링크를 제공할 경우 Youtube Data API로 영상의 메타데이터와 썸네일 등의 정보만 가져오고, 파일을 직접 업로드하는 경우는 영상 파일을 S3에 업로드한 후 관리자가 주기적으로 영상을 유튜브에 올린 후 링크를 교체해주고, S3에 업로드된 파일을 지우는 방식으로 하는 것으로 방향을 잡고 개발을 진행했습니다. 비용 부담으로 인해 여러 선택지들을 놓고 고민했고, 비록 개발자지만 직접 기획에도 참여하며 아이디어를 제공하고 의사 결정에 있어 역할을 했습니다. ## 성장 교육 관련 서비스, 특히 LMS가 요구하는 다양한 기능들을 구현하며 관련 도메인 지식을 갖게 되었습니다. # JDC 일자리데이터센터 243개 지자체의 인구, 고용, 산업 통계 데이터를 시각화 / 시각화된 통계 데이터와 해석을 문서 파일로 제공 ## 개요 * 기간 : 2020년 8월 1일 \~ 2021년 4월 30일 * 회사 : 미래직업전망연구원 * 담당 범위 : 전체 (Backend, Frontend, Infrastructure) ## 주요 기술 스택 ### Frontend * HTML5, CSS3 기본 퍼블리싱 * Bootstrap + jQuery * Javascript 차트 시각화 라이브러리 amCharts 활용 * Naver Maps API Pin Clustering * Wordpress (랜딩 페이지) ### Backend & Infrastructure * PHP CodeIgniter 3 (PHP 7.4) * MariaDB 10.4 (AWS RDS) * AWS EC2 (Linux Debian, Apache, php-fpm) * AWS Lightsail, PHP 7.4 (랜딩 페이지) * Python Flask 프레임워크 (Python 3.7) with AWS EC2 Ubuntu 20.04 ### Etc. * Github에서 버전 관리 * Git-Flow를 적용해 각 브랜치별로 역할 분리, 브랜치별로 배포 서버 다르게 지정하여 Jenkins에서 각각 서버에 자동 배포. * Google Drive, Docs API 연동 : 유튜브 영상의 메타 데이터와 썸네일 추출 목적 * 결제 연동 (아임포트, KG이니시스) ## 상세 개발 내용

* 수동 입력 필요한 데이터들 전체 수집 및 정리 * 랜딩 페이지 (워드프레스) 제작 * 메인 페이지 전체 개발 - 프론트엔드 & 백엔드 & 데이터베이스 * 관리자 페이지 전체 개발 - 프론트엔드 & 백엔드 & 데이터베이스 * 문서 생성 서버 개발 - 백엔드 (Python Flask) ## 주요 개발 이슈 및 해결 사례 ### 1) 통계 데이터의 표준화 문제 인원이 부족해 초반에는 고용, 노동, 산업 통계 데이터와 지자체별 데이터를 수집하는데 많은 시간을 할애했습니다. 통계청 국가통계포털과 통계청 Open Api를 활용해 주로 데이터를 수집하였습니다. 당시에 이용하기로 한 Gapminder라는 시각화 툴은 csv 형태로 데이터가 import 되어야해서 국가통계포털에서 여러 종류의 데이터를 csv 파일로 다운받은 후, 엑셀로 후처리 작업을 거쳐 수치를 정리했습니다. 또한 지자체별로 hwp, pdf, xlsx 등 파일 형태로 제공되는 통계 항목은 수작업으로 데이터를 정리해줘야 했습니다. 통계청 API는 JSON 형태로 데이터를 제공해주어 편하나, 통계표별로 지역코드와 단위가 표준화가 되어있지 않아 케이스를 모두 파악하고 인자를 주어 별도로 처리해줘야 했습니다. 약 2\~3달동안 243개 지자체, 최장 20년에 걸친 30여종의 통계 항목과 지역일자리 목표 공시제의 각종 데이터를 모두 정리했습니다. 지금 되돌아보면 참 힘들고 고된 작업이었던 것 같지만 이 활동이 데이터 처리, 통계 관련 도메인에 대해 깊이 이해할 수 있는 계기가 되었습니다. 향후에 본 경험과 데이터 사이언스에 대한 학습, 그리고 파이썬을 함께 연계하면 해당 분야(데이터 사이언스)에서도 역량을 발휘할 수 있을 것 같습니다. ### 2) Git과 Jenkins의 도입 처음으로 회사 자체 플랫폼을 개발하며 비록 지금은 혼자 개발을 하고 있지만, 향후 개발 인력이 충원되고 팀이 형성될 때를 대비해 개발 체계와 시스템을 구축하고자 하였습니다. 그 일환으로 Git과 Jenkins를 도입했습니다. Github Private Repository에서 작업하고, Develop 브랜치와 Main 브랜치를 나눠서 개발 서버와 메인 서버별로 배포 자동화를 했습니다. 비단 개발의 편의성을 향상시키는 것 뿐 아니라, 반복적인 작업에 인적 요인의 개입을 줄여 리스크를 줄이는 효과도 얻었습니다. 이 때 구축된 파이프라인을 기반으로 향후 진행되는 프로젝트에도 동일하게 본 체계를 적용했습니다. ### 3) 문서 파일 생성 기능 개발 * **요구사항 파악** 기관에서는 주요 고용, 노동, 산업 통계 데이터에 대해 기초 데이터(표)와 시각화 데이터(차트), 그리고 해석을 주로 필요로 하기에 해당 내용을 담은 리포트를 제작하기로 결정하였습니다. 실제로 주요 수익 모델이 될 서비스이기에 신중하게 개발 방향을 잡아야 했습니다. * **HWP 파일로 생성 도전... 그리고 보류** 공공기관이 서비스의 주요 타겟층 중 하나이기에 한글 파일로의 생성을 제일 먼저 고려했습니다. 하지만 몇 가지 문제점이 있었습니다. hwp 파일 포맷 공개로 한글 파일을 읽는 라이브러리들은 몇 가지 존재했지만, 한글 파일을 생성하고 작성하는 라이브러리는 대부분 찾기가 어려웠습니다. 자바로 만든 라이브러리가 있어 intellij를 설치하고 테스트를 해봤는데 자바에 익숙하지 않아 추가 개발을 하기가 어려웠습니다. 물론 스터디를 하고 시간을 투자하면 구현 자체는 가능할 것으로 보였으나, 일정과 업무량, 그리고 향후 유지보수 여력 등을 고려했을 때 잠시 보류하고 다른 방안을 먼저 탐색해보기로 결정했습니다. * **WISIWYG 에디터의 문서 출력 기능 검토.. 그리고 반려** hwp 파일 외에 다른 포맷으로 파일을 만들기 위해서 제일 먼저 생각했던게 WYSIWYG 에디터의 문서 출력 기능이었습니다. 실제로 구현은 가장 간단하게 이뤄지는데 라이센스와 가격이 가장 큰 문제였습니다. CKEditor 5와 Fraola Editor를 두고 고민을 했는데, CKEditor는 연간 약 $780로 아직 수입이 없는 상황에서 조금 부담스러운 금액으로 작용하였습니다. Fraola 에디터의 경우 영구 구독시 $1299에 기능을 이용할 수 있지만, 생성된 문서 파일을 고객에게 판매하는 것이기 때문에 라이센스 상 상위인 Enterprise가 적용돼 $2999까지 가격이 올라가서 도입이 반려되었습니다. 완전 오픈소스로 관리되는 에디터들보다 기능이 풍부하고 지원이 안정적이어서 서비스 내에 에디터가 필요한 여러 곳에도 사용할 수 있었겠지만 가격과 예산 문제로 인해 다른 방안을 찾아야 했습니다. * **Google Docs와 Drive API 이용으로 최종 결정!** 그러던 중 Google Docs와 Google Drive 를 이용해 문서 틀을 만들고, 거기에 값을 치환해서 문서로 출력하는 건 어떨까 하는 아이디어를 떠올렸고 Python을 이용해 바로 테스트해봤습니다. 먼저 구글쪽 매뉴얼을 보고 예제 코드를 가져와 인증을 하고, 문서에서 `{{TEXT-1}}` 과 같이 영역을 만들어두고 값을 치환하는데 성공했습니다. 마지막으로 해당 파일을 API를 통해 다운로드 하는것까지 테스트에 성공해 바로 메인 코드 작성에 들어갔습니다. > **Flask** vs **AWS Lambda** 구현 방식에 있어 고민이 좀 있었습니다. Flask와 람다 모두 사용해본 경험이 있고, 각각의 장단점이 뚜렷해서 어느 한 쪽이 좋고 안 좋고를 논하기가 어려웠습니다. 다만 람다의 경우 서버리스 특성상 클라우드 서비스 제공업체에 따라 코드가 종속적이게 되어 향후 관리 측면에서는 Flask가 조금 더 유리하다고 판단했습니다. 또한 람다로 테스트를 하던 중 액세스 토큰이 만료되어 리프레시 토큰으로 새로 액세스 토큰을 발급받아 저장하더라도, 람다 자체에서 파일을 저장하지 않아 인증을 위한 절차가 복잡해진다는 문제가 있었습니다. 이외에도 향후 기능 확장을 고려했을 때 Flask가 비교우위에 있다고 판단, Flask를 이용하기로 결정하였습니다. * **실제 코드 구동은 다음과 같은 방식으로 이뤄집니다.** 1. 프론트에서 데이터(이미지 : base64 인코딩, 수치 데이터와 해석문 : json)를 담아 Flask 서버로 POST 요청을 보냄 2. 요청이 유효한지 확인 : 웹서비스 프론트에서 넘어온 토큰이 유효한지, 이용자의 권한이 충분한지, 필요한 파라미터가 모두 넘어왔는지 체크 3. 문서 형식에 따라 기존에 구글 드라이브에 생성되어있던 템플릿을 복사해서 새 파일로 생성 (Google Drive API) 4. 문서에 데이터 삽입 : Google Docs API로 지정된 위치에 데이터 치환 5. 이미지의 경우 base64 Decode하여 이미지 파일로 생성해 서버의 임시위치에 저장, AWS S3 SDK를 이용해 S3에 이미지 파일 업로드 한 후 해당 링크를 받아와 Google Docs API로 이미지 삽입 (이미지가 바로 삽입되지 않고 링크로만 넣을 수 있음). 이후 S3에 업로드한 이미지 삭제, 서버의 임시파일 삭제 처리 6. 지정한 형식으로 파일 저장 : Google Drive API를 통해 docx, pdf, odt 등 7가지 종류의 형식으로 임시폴더에 파일 저장 7. S3에 파일 업로드 후 링크 받아온 후 임시폴더 파일 삭제, S3 링크 반환 8. 프론트에서 반환된 링크값을 통해 사용자가 파일을 다운로드받을 수 있도록 함 ### 4) 메인 페이지 로딩 속도 개선 * **문제점 파악** 기본적으로 메인 페이지에 로딩 속도에 영향을 끼치는 무거운 컴포넌트가 많습니다. Gapminder 그래프 16개가 iframe 형식으로 호출되어야하는 특성상 호출에 소요되는 시간이 길고, Naver Maps API로 그리는 지도의 개수가 9개, amCharts로 호출되는 Map Chart 2개 등 전체적으로 자바스크립트쪽 부하가 많습니다. 따라서 기존에는 화면이 처음 보이는데까지 걸리는 시간이 5초 이상으로 길고, 페이지가 완전히 로딩되는 데는 30초 이상이 소요되었습니다. 분명 개선이 필요했고 시간을 조금 들여 여러 최적화 과정을 거쳤습니다. * **소스코드 최적화** 우선 자바스크립트 로딩 순위를 다르게 설정하여 첫 화면이 뜨는데까지 걸리는 소요시간을 1초 이내로 줄이고, 대부분의 자바스크립트 파일을 minify했습니다. 네이버 지도의 경우 처음 화면에 뜨는 1개만 먼저 로딩하고, 지도 관련 다른 버튼 조작이 발생할 경우 나머지 8개의 지도를 로딩시켰습니다. amCharts의 Map Chart도 동일하게 1개만 먼저 로딩하고, 다른 지도를 선택하면 로딩되도록 수정하였습니다. 이 외에 Gapminder 차트의 경우, 기존에 화면에 보이는 iframe 6개는 모두 lazy loading을 걸어주었고, 버튼을 클릭해야 볼 수 있는 나머지 10개의 차트의 경우 버튼 선택시 iframe이 로딩되도록 작업해주었습니다. * **로딩속도 개선** 작업 결과 첫 화면이 뜨는데까지는 1초 미만, 5초정도면 모든 요소들이 다 로딩될 수 있도록 개선에 성공했습니다. 이 외에도 사이트 내에 로딩이 오래 걸리는 페이지들에 대한 리팩토링도 진행하였습니다. ## 성장 * 스타트업 특성상 지속적으로 기획 방향이 바뀔 수 있음을 이해하고, 변경된 기획에 대해 다방면의 기술적 검토를 거쳐 프로젝트가 더 나은 방향으로 나아갈 수 있도록 참여하는 경험을 갖게 되었습니다 * 사이드 프로젝트로 코드이그나이터를 한 번 써보고 바로 실제 프로젝트에서 이용하며 보안이나 개발 편의성 면에서 확실한 개선점을 얻었고 코드 컨벤션 유지도 용이해졌습니다. 초반에 MVC 패턴을 이해하는데 약간 어려움이 있었으나 금방 이해하고 적응하여 실제 이용상 불편함은 없었습니다. # 직업카드심리검사 모바일 기반 직업카드 심리검사 플랫폼 ## 개요 {% embed url="" %} jobcard.jobmap.kr {% endembed %} * 기간 : 2020년 5월 1일 \~ 2020년 8월 31일 * 회사 : 미래직업전망연구원 * 담당 범위 : 유지보수 (Backend, Frontend) ## 주요 기술 스택 ### Frontend * Bootstrap + jQuery ### Backend & Infrastructure * ASP.Net (C#), MSSQL * 카페24 윈도우호스팅 환경에서 서비스 (기존 : Azure) ### Android Application * 자바로 개발된 안드로이드 하이브리드 앱 * 로그인/로그아웃, 햄버거 메뉴만 네이티브로 구현하고 이외의 부분은 웹뷰로 처리해서 서버와 통신 ## 상세 개발 내용 * 버그픽스, 서버 모니터링 등 유지보수 * 어드민 페이지 신규 기능 추가 및 일부 페이지 디자인, 로직 수정

인수인계 받기 전에는 Azure에서 운영 중이던 프로젝트였습니다. 하지만 운영비 절감과 관리의 용이성때문에 카페24 윈도우 호스팅으로 이전한 뒤 인수인계를 받았습니다. C# 언어 자체는 그렇게 어렵지 않았으나, 닷넷과 MSSQL이 처음이라 구조를 파악하고 익히는데 1\~2주정도 시간이 소요되었습니다. 인수인계 후 특정 상황에서 서버가 계속 죽는 문제를 발견해 해결하였습니다. (자세한 내용은 아래에) 심리검사 특성상 이용자로부터 설문 데이터를 받아서 로직에 의해 결과가 도출되게 되는데, 해당 로직의 변경사항이 있어 이를 반영하고, 특정 상황에서 잘못된 결과가 나오는 버그를 수정하였습니다. 또한 일부 페이지에서 디자인 변경, 기능 수정 등 일반적인 유지보수 작업을 진행했습니다. 검사 중간에 페이지를 이탈할 경우 검사 결과가 이상하게 나오는 오류가 일부 보고되어, 어드민 페이지에서 특정 이용자의 검사 결과를 초기화하고 다시 검사를 시행할 수 있도록 하는 기능을 추가하였습니다. ## 주요 개발 이슈 및 해결 사례 ### 1) 여러 명이 동시에 접속할 경우 간헐적으로 서버가 죽는 문제 발 * **문제 발견** 테스트 과정에서는 별 문제가 없었으나, 여러 명이 동시에 접속하여 테스트를 진행할 경우 간헐적으로 서버가 죽는 문제가 발생하였습니다. * **원인 확인** 첫 메인 랜딩 페이지는 정상적으로 접속되는 것에 반해 DB 커넥션이 필요한 페이지가 작동하지 않는 것으로 보아 DB쪽 문제임을 먼저 확인하였습니다. 이에 에러 메세지 설정을 켜고 오류를 확인, 커넥션 풀이 꽉 차서 연결이 되지 않는 오류 메세지를 발견하였습니다. 이어서 DB쪽에서 connection 관련 모니터링을 하려 했으나 카페24 호스팅을 사용하는 특성상 권한이 부족해 대부분의 모니터링 기능을 사용할 수 없었습니다. * **임시 조치** 당시에는 Connection Pool 관련 지식이 없어서 해결방법을 찾는데까지 시간이 좀 걸릴 것이라 판단했습니다. 따라서 Connection Pool 관련 오류임을 확인하고 원격에서 Connection Pool을 초기화할 수 있도록 링크를 만들어서, 해당 링크로 접속하면 `SqlConnection.ClearAllPools();` 구문이 실행되도록 해놓고, 해결책을 찾기 전까지 모니터링을 하며 문제 발생시마다 풀을 초기화시켜줬습니다. * **문제 해결** 심리 검사의 문항 각각에 답변할 때마다 DB Update가 이뤄지는 구조인데, 150개 문항으로 문항 수가 많아서 잦은 연결이 이뤄질 수밖에 없습니다. 다만 호스팅 특성상 DB 서버의 설정을 변경할 수가 없기에 코드 레벨에서 문제를 해결해야 했고, 테스트를 거쳐 Connection Pool이 주는 성능상의 이점을 포기함에도 불구하고 큰 성능 저하가 발생하지 않아 연결문에 `Pooling=false` 를 넣어 사용하지 않는 방향으로 문제를 해결했습니다. ### 2) 카페24 호스팅 트래픽 초과 알림 개발 이용할 트래픽에 따라 요금제가 정해지고, 해당 트래픽을 모두 소진하면 사이트 접속이 당일 자정까지 차단되는 호스팅의 특성상 이용 트래픽에 대한 관리가 필요했습니다. 아쉽게도 트래픽 알림 기능은 따로 존재하지 않았고, 결제 카드를 연결해두면 자동 초기화도 가능했으나 선택적으로 초기화가 필요할 때에만 초기화를 하고 싶었기에 트래픽 모니터링 코드를 파이썬으로 간단하게 작성하여 활용했습니다. {% @github-files/github-code-block %} ## 성장 * 닷넷과 C# 관련 지식을 얻게 되었습니다. 닷넷으로 개발된 웹사이트의 구조를 이해하게 되었습니다. * MSSQL을 운용할 수 있게 되었습니다. 특히 이 프로젝트에는 Stored Procedure가 많이 이용되었는데, 프로시저의 개념을 알고 어떤 형태로 사용되는지 알게 되었습니다. 트러블슈팅을 하며 Connection Pool에 대해서도 알게 되었습니다. # (사)한국직업상담협회 공동훈련센터 온라인으로 훈련과정 신청 및 관리 서비스 ## 개요 {% embed url="" %} hrd.kvoca.org {% endembed %} * 기간 : 2019년 11월 1일 \~ 2020년 4월 30일 * 회사 : 미래직업전망연구원 * 담당 범위 : 전체 (Backend, Frontend, Infrastructure) ## 주요 기술 스택 ### Frontend * HTML5 + CSS3 * Bootstrap + jQuery ### Backend & Infrastructure * Legacy PHP (PHP 7.0) * MySQL 5.7 * 카페24 호스팅 환경에서 개발 & 운영 ## 상세 개발 내용 메인 페이지 전체 및 어드민 페이지 전체 (프론트엔드, 백엔드, DB)

Adobe XD로 만들어진 기획(SB)을 바탕으로 구현하였습니다. 프론트 개발시에는 기존에 만들어져있는 템플릿을 사용하지 않고 모든 부분을 직접 개발하였습니다. 화면의 각 구성요소를 중심으로 먼저 HTML 구조를 잡고, CSS로 기획서와 동일하게 잡아갔습니다. 백엔드로는 레거시 PHP를 사용했으며 7.0 버전에 대응되도록 하였습니다. 현재는 하자보수 기간 종료, 유지보수 계약 만료로 인해 다른 업체로 유지보수가 넘어간 관계로 어드민 페이지는 캡쳐를 못 했습니다.

## 성장 * 첫 프로젝트로 백엔드 개발은 무리 없이 진행했으나, HTML과 CSS, JS의 기초지식이 부족해 퍼블리싱 및 프론트엔드 개발에 어려움이 있었습니다. 이에 제가 먼저 회사에 교육비 지원을 요청해서 하루정도 퍼블리싱 기초 교육을 받고 왔습니다. 이후 2주정도 CSS와 jQuery쪽 추가 스터디를 하며 실제 프로젝트에 사용할 수 있을 정도까지 실력을 끌어올렸습니다. * 기획서와 스토리보드 바탕으로 요구사항을 구현하는 경험을 갖게 되었습니다. * 주도적으로 일정을 관리하고 작업 진척사항을 공유하며 일정 계획 관리 요령을 습득할 수 있었습니다. # 외부 발표/강연 # INFCON 2024 사이드 프로젝트로 커리어 레벨업! {% file src="/files/tI4kbgvhIvqbzZy6mrp9" %} 발표 자료 {% endfile %} ### 발표 개요 * 주제 : 사이드 프로젝트로 커리어 레벨업! * 발표일시 : 2024년 8월 2일 (금) / 12:15 \~ 12:35 (20분) ### 발표 영상 {% embed url="" %} # UbuCon Korea 2024 LXD-UI를 이용해 웹에서 VM, 컨테이너 프로비저닝하기 {% embed url="" %} 발표 자료 {% endembed %} ### 발표 개요 * 주제 : LXD-UI를 이용해 웹에서 VM, 컨테이너 프로비저닝하기 * 발표일시 : 2024년 8월 10일 (토) / 14:00 \~ 14:30 (30분) ### 발표 영상 {% embed url="" %} # 사이드 프로젝트 지금까지 진행했던 주요 사이드 프로젝트를 엄선해서 기술했습니다. # ARCHIVERS (2023.10) 오픈소스 트위치 다시보기 녹화 서비스 {% hint style="warning" %} \[Draft] 아직 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} ## 개요 {% embed url="" %} 웹사이트 (archivers.app) {% endembed %}

### 깃허브 {% embed url="" %} GitHub Repo (Frontend) {% endembed %} {% embed url="" %} GitHub Repo (Backend) {% endembed %} {% embed url="" %} GitHub Repo (Listener Module) {% endembed %} {% embed url="" %} GitHub Repo (Pipeline Module) {% endembed %} {% embed url="" %} GitHub Repo (Worker Module) {% endembed %} # KAMY (2023.09) 해커톤(Unithon 10기) 참여작품 - 영업사원 인맥 관리 서비스 ## 개요 {% embed url="" %} KAMY (front.haenu.dev) {% endembed %} {% embed url="" %} Swagger UI (api.haenu.dev/docs) {% endembed %}

## 기술스택

## 세부 개발 과정 ### 내가 맡았던 부분 * DevOps 전체 * Backend NestJS 파트 전체 (Cronjob) * Backend FastAPI 파트 인증부분 (Google OAuth) ### DevOps 관련 블로그 포스팅 {% embed url="" %} ## 성장 포인트 * 이정도로 빠르게 효과적으로 인프라를 구성한 적은 처음이었는데, 쿠버네티스와 그 생태계에 대한 이해도가 한층 높아졌습니다. 또한 소규모 프로젝트에 DevOps 방법론이 결합되면 그 시너지 효과가 굉장히 크다는 걸 느꼈습니다. * NestJS Standalone 모드를 처음으로 사용해보았는데 Cronjob과 같은 Batch 스타일의 작업을 위한 용도로 사용하기 적합하다고 느꼈습니다. * FastAPI를 가볍게 사용해본 적은 많았지만, 실제 실무에서 사용하시는 분과 같은 팀을 이루며 FastAPI를 이용한 백엔드 아키텍쳐 설계, Sqlalchemy ORM 체험, Alembic을 통한 DB 버전 관리까지 다양한 새로운 경험을 할 수 있어서 좋았습니다. # 레븐 Portal (2023.08) 아프리카TV 버츄얼 크루 '레븐' 멤버들의 다시보기와 클립을 모아 보기 위한 웹서비스 {% hint style="warning" %} \[Draft] 아직 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} {% embed url="" %} 레븐 Portal (leaven.team) {% endembed %} {% embed url="" %} GitHub (FE+BE) {% endembed %} # dotenv-to-sealed-secrets (2023.06) .env 파일을 Sealed Secrets manifest로 변환해주는 오픈소스 CLI 툴 {% hint style="warning" %} \[Draft] 아직 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} {% embed url="" %} GitHub {% endembed %} # gongik-ars (2023.04) 산업기능요원 퇴근 기록을 위한 ARS 스크립트 ## 개요 {% embed url="" %} GitHub {% endembed %} ## 기술스택 * Express.js * Twilio ## 주요 기능 * Twilio를 이용해 정해진 시나리오대로 전화를 걸 수 있음 > \[Twilio] 산업기능요원 퇴근 기록은 하셨나요? 기록했다면 1번, 찍는 날이 아니라면 2번, 잠시 후 찍겠다면 3번을 눌러주세요. > > \[User] 1번 / 2번 / 3번 입력 > > \[Twilio] 1번, 2번 - 확인되었습니다 / 3번 - 잠시 후에 다시 확인하겠습니다 (5분 후 다시 전화) / 그 외 - 잠시 후에 다시 확인하겠습니다 (3분 후 다시 전화) * 쿠버네티스 클러스터 위에 Express.js로 파드를 띄워두고, 쿠버네티스 크론잡으로 정해진 시간에 전화 트리거 (평일 저녁 7시) ## 세부 개발 과정 산업기능요원 근무를 하면서 퇴근기록(지문 찍기)을 깜빡하고 집에 가는 경우가 종종 발생했다. 이 때문에 나중에 CCTV를 다시 돌려 퇴근시간을 확인하는 등 불편함이 있어서, 이런 문제를 방지하고자 매일 저녁 퇴근시간에 전화를 걸어 퇴근기록을 했냐고 확인하면 어떨까? 하는 생각이 들어 바로 만들어보았다. Twilio는 한국 번호는 지원하지 않기 때문에 미국 번호로 생성하고, 국제전화로 들어오게 만들었다. 국제전화이더라도 번호 등록만 해두고 따로 차단만 하지 않는다면 수신 비용은 없기 때문에 문제는 없다. 지금까지 총 3명이 사용하였고 (2023년 10월 현재도 사용 중), 매월 $3\~4 정도가 나오는데 이건 한번씩 동료분이 커피를 사주는걸로 비용은 처리하고 있다. ## 성장 포인트 * Twilio를 처음 써봤고, 코드로 전화를 걸고 입력에 따라 응답을 다르게 만들 수 있는 경험을 했다. * 향후 온콜 관련된 기능을 만들어야 할 상황이 있다면 써먹어볼 수도 있을 것 같다. # Clippy - MAU 4만 달성! (2022.11) 트위치의 한국 내 VOD 서비스 중단에 따른 '클립' 기능 대체 서비스 {% hint style="warning" %} \[Draft] 아직 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} ## 개요 {% embed url="" %} CLIPPY 서비스 종료 전 동작하는 모습 녹화 {% endembed %}

# 해리배치고사 (2022.07) 트위치 스트리머 '전해리' 방송 1주년 기념 퀴즈 응시 웹사이트 ## 개요 {% embed url="" %} 서비스 (test.junharry.com) {% endembed %} {% embed url="" %} Swagger (api-v1.leaven.team) {% endembed %} {% embed url="" %} GitHub (FE) {% endembed %}

## 기술 스택 ### Frontend * Next.js * Chakra UI ### Backend * FastAPI * MariaDB (AWS RDS) * Redis (AWS ElastiCache) ## 주요 기능 * 트위치 로그인 * 테스트 응시와 결과 보기 * 주요 정책 * 테스트 응시 전, 응시 후에는 테스트 페이지로 진입 불가 * 테스트 응시 후에만 결과 페이지로 진입 가능 * 응시 데이터를 기반으로 부정행위 여부 분석 가능 * 응시결과는 관리자페이지에서만 조회 가능 ## 성장 포인트 * Next.js로 API를 연동하는 앱을 처음 만들어보았다 (SSR에 대한 이해가 부족해 막히는 부분이 좀 있었다) * Twitch OAuth 연동을 FastAPI로 처음 해보았다! (짱신기) * Redis를 처음 사이드 프로젝트에 도입했다 → 응답결과를 계산해서 DB에서 내려보내줄 때 사람이 몰리면 부하가 걸릴 수 있을 것 같아서 도입했는데.. 사실 이 정도 규모에선 필요가 없긴 하다 # 전해리 방송일정 (2022.06) 트위치 스트리머 '전해리'의 방송일정/공지사항을 보여주기 위한 웹사이트 ## 개요 {% embed url="" %} 서비스 (junharry.com) {% endembed %} {% embed url="" %} Swagger (api-v1.leaven.team) {% endembed %} {% embed url="" %} GitHub (FE) {% endembed %}

## 기술 스택 ### Frontend * React.js (CRA) * Ant Design (Web) * Chakra UI (Admin) ### Backend * FastAPI * MariaDB (AWS RDS) * Redis (AWS ElastiCache) ## 주요 기능 * 메인 페이지 * (구버전) Ant Design 캘린더 기능을 이용해서 캘린더 형식으로 일정을 보여줬음 * (신버전) 아프리카 이적 이후 Ant Design 카드를 이용해서 공지사항을 보여줌 * 어드민 페이지 * 로그인 : ID/PW 방식, JWT 기반 인증 (로컬스토리지에 저장) * 일정 등록/관리, 공지 등록 등 기능 * 해리배치고사 결과 열람도 여기서 가능 * 위지윅에디터로 TinyMCE 사용 ## 성장 포인트 Ant Design을 처음 이용해봤다. 깔끔하긴 한데... 검색하면 중국어밖에 안 나와서 TroubleShooting할 때 애로사항이 있었다. # 나와 가장 잘 맞는 레븐 멤버는? (2022.06) 5개의 질문에 답하여 트위치 버츄얼 크루 '레븐' 멤버 중 나와 가장 잘 맞는 멤버를 찾는 미니게임 ## 개요 {% embed url="" %} 웹사이트 (minigame.leaven.team) {% endembed %} {% embed url="" %} GitHub (FE) {% endembed %}

## 기술스택 * Framework : Next.js * UI Library : Daisy UI (Tailwind CSS) * Error monitoring : Sentry * 과거 배포 : Vercel * 현재 배포 : 개인 쿠버네티스 클러스터 (SSG + Nginx) ## 주요 기능 * 5개의 질문에 답변을 하여 나와 가장 잘 맞는 레븐 멤버를 알 수 있는 미니게임 * 응답결과는 로컬스토리지에 저장되어 이전 번호로 돌아가서 응답값을 바꿀 수 있음 * 결과 페이지에서 '공유하기' 버튼을 누르면 결과 정보와 사이트 링크가 클립보드에 복사됨 ## 세부 개발 과정 간단한 설문형 게임이나 유사 mbti 검사들이 netlify 등으로 배포되어 많은 호응을 얻고 있는 것에 착안해, 간단하게 질문형 미니게임을 만들어보고자 계획하였다. 기술적으로는 이전에 사용해본 적이 없던 Next.js와 Vercel을 통한 배포과정, 그리고 Tailwind CSS 기반의 Daisy UI를 적용하였다. 우선 질문과 답변을 만들고, 각 답변에 대한 멤버별 가중치를 설계하였다. (멤버별 MBTI 반영) {% embed url="" %} 이후 최대한 빠르게 주요 기능을 개발하였다. ## 성장 포인트 * Next.js를 처음 사용해보았다. 기술이 궁금해서도 있지만 React를 사용할 때 라우팅 처리가 많이 복잡했어서, Next.js의 편리한 라우팅 기능을 사용해보고싶은 마음이 컸다. * Tailwind CSS와 함께 Daisy UI를 처음 써봤다. 이후 Tailwind를 이용하는 프로젝트가 많아졌는데 이 때 좋은 경험을 받은 덕이 크다. * 회사에서 Bugsnag을 사용하는 걸 보고 에러 모니터링 툴에 관심이 생겨 Sentry를 처음 도입해보았다. * 배포를 위해 Vercel을 처음 사용해보았다. 대만족! # gellgell (2022.05) 트위치 스트리머 '구슬요' 팬게임 (현 아프리카TV BJ) ## 개요 {% embed url="" %} 웹사이트 (gell.leaven.team) {% endembed %} {% embed url="" %} GitHub (FE) {% endembed %}

## 기술스택 * Frontend : React.js, Chakra UI * Backend : Python FastAPI, MariaDB (AWS RDS) * 현재 배포 : [개인 쿠버네티스 클러스터](/about/side-etc/haenu-cluster) ## 주요 기능 ## 세부 개발 과정 ## 성장 포인트 * 나름 웹게임이라는 걸 처음 만들어봤다 * * 어떻게 많은 수의 요청을 처리할 것인지 생각하기 시작했다 (gellgell은 폴링으로 처리) # 레븐 멀티트위치 (2022.04) 트위치 버츄얼 크루 '레븐' 합방 시청을 위한 멀티트위치 웹서비스 {% hint style="warning" %} Coming Soon! {% endhint %} {% embed url="" %} {% embed url="" %}

합방 중일 때 사용하고 있는 모습 (실제 생방송 캡쳐 - 2023.05)

# 포도당 노래책 (2022.02) 트위치 스트리머 '\_포도당\_' 노래책 웹서비스 (현 아프리카TV BJ) {% hint style="warning" %} Coming Soon! {% endhint %} {% embed url="" %} 웹사이트 (music.c6h12o6.kr) {% endembed %} {% embed url="" %} GitHub (FE) {% endembed %} {% embed url="" %} Swagger {% endembed %} # 트리니티 헬퍼 (2020.08) 수강신청 정정기간 도우미 웹서비스 ## 개요 {% embed url="" %} 트리니티 헬퍼 {% endembed %} {% embed url="" %} GitHub (Web) {% endembed %} {% embed url="" %} 수강신청 인원조회 API 문서 (서비스 종료 이후 공개) {% endembed %} 가톨릭대학교 수강정정기간에 '수강신청 취소' 등 사유로 자리가 생기면 미리 신청해둔 전화번호로 문자메시지를 전송해주는 서비스. 에브리타임을 통해 홍보했으며, 대학교 익명커뮤니티의 한계를 뛰어넘고 1500명의 유저에게 서비스를 제공하였습니다. 자퇴로 인해 이후 추가로 서비스를 운영하지 못했으나, 당시 만들었던 코드와 API를 모두 공개하여 다른 학우들이 활용할 수 있도록 여러 지원을 제공하였습니다.

## 기술스택 * 코어 : Python (수강신청 API 호출 모듈, 문자메시지 전송 모듈), NHN Cloud (문자 전송) * 웹 : PHP, MySQL, Bootstrap, jQuery * 서버 : 스마일서브 iwinv 클라우드, AWS Lambda & API Gateway ## 내부 구조 먼저 대학교 포털을 개발자도구로 까서 '강의별 총 신청인원과 현재 신청인원'을 불러올 수 있는 API 엔드포인트를 땄습니다. 그 다음 파이썬으로 해당 엔드포인트를 호출할 수 있도록 코드를 짜서 이를 AWS Lambda에 올리고, API Gateway를 붙입니다. 이를 통해 자연스럽게 IP Rotate가 일어나게 만들어 많은 Request로 인한 차단이 발생하지 않도록 하였습니다. 웹에서는 최초 전화번호 인증(문자메시지)을 거쳐서 확인하고 싶은 강의를 등록할 수 있게 하였습니다. (5개 제한) 그러면 등록된 강의를 주기적인 Lambda 호출로 확인하다, 만일 자리가 생기면 등록된 전화번호로 문자메시지를 전송합니다. 이 때는 iwinv 클라우드를 사용했는데, 생각보다 서버 부하가 커서 코어 모듈 구동용으로 여러 대를 사용하며 비용이 꽤 나오게 되었습니다. ## 운영 결과 운영 기간 : 2020년 8월 14일 \~ 9월 4일 (22일간) ### 이용 통계 * 트리니티 헬퍼 웹사이트 통계 (GA 기준) * 총 방문자 수 : 1,532명 * 총 페이지뷰 : 28,563회 * 트리니티 헬퍼 문자전송 서비스 통계 * 문자전송 신청 건수 : 3,415건 * 문자 발송 건수 : 24,823건 ### 수익/지출 내역 * 수익 (후원금) : 총 105,834원 * 카카오톡 후원 : 12건 / 49,333원 * 은행계좌 후원 : 8건 / 56,501원 * 지출내역 : 총 335,892원 * 문자 발송 (NHN Cloud API, 건당 9.9원, VAT 별도) : 24823 \* 9.9 \* 1.1 = 270,322원 * iwinv 클라우드 서버 (문자전송 서버) : 서버 8대 (사양 상이), 일할계산 총 24일분 = 65,570원 * 기타 서버, 도메인 비용 등은 기존 보유 자원 이용했으므로 비용 산출에서 제외 # 해누플래너 (2018.08) 고3시절을 버티게 해주었던 학습플래너 웹사이트 {% hint style="warning" %} Coming Soon! {% endhint %} {% embed url="" %} GitHub (alpha version) {% endembed %} {% embed url="" %} GitHub (v1) {% endembed %} # 야자타임 (2016.07) 부산국제고등학교 야간자율학습 통합관리 시스템 {% hint style="warning" %} Coming Soon! {% endhint %} {% embed url="" %} GitHub {% endembed %} # 사이드 프로젝트 (그 외) # VMusic (2023.07) {% hint style="warning" %} \[Draft] 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} {% embed url="" %} 웹사이트 (vmusic.kr) {% endembed %} {% embed url="" %} GitHub (Frontend Repo) {% endembed %} {% embed url="" %} GitHub (Backend Repo) {% endembed %} # 트위치 개발자문서 한글화 프로젝트 (2023.04) {% hint style="warning" %} \[Draft] 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} {% embed url="" %} Website (twitch-docs.haenu.com) {% endembed %} {% embed url="" %} GitHub {% endembed %} # 트위치/아프리카TV 뱅온알림봇 (2022.04) {% hint style="warning" %} \[Draft] 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} {% embed url="" %} {% embed url="" %} {% embed url="" %} {% embed url="" %} # 머니머니 (2022.04) 가계부 관리를 위한 지출내역 등록 웹사이트 {% hint style="warning" %} \[Draft] 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} ## 개요 {% embed url="" %} 웹사이트 (money.haenu.com) {% endembed %} {% embed url="" %} GitHub (Frontend) {% endembed %} {% embed url="" %} GitHub (Backend) {% endembed %} ## 기술스택 * Frontend : Svelte, Bootstrap 5 * Backend : Python Flask, Serverless Framework (AWS Lambda) * DB : Google Drive Spreadsheet # AfreecaTV Auto Up (2020.11) 아프리카TV 자동추천/꿀잼각 크롬 익스텐션 {% hint style="warning" %} \[Draft] 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} {% embed url="" %} Chrome Webstore {% endembed %} {% embed url="" %} GitHub {% endembed %} # 개인 쿠버네티스 클러스터 Haenu Cluster Project {% hint style="warning" %} \[Draft] 완성되지 않은 글이에요. 조금만 더 기다려주세요! {% endhint %} ## GitOps Repository {% embed url="" %} # Life Checkpoint {% hint style="warning" %} Coming Soon! {% endhint %} # 처음 개발을 접하다 (2013) {% hint style="warning" %} Coming Soon! {% endhint %} # e-ICON 세계대회에서 앱 개발로 3위 수상 (2014) {% hint style="warning" %} Coming Soon! {% endhint %}

# 산수 연습 앱 개발 (2015)

# 2016 - PHP와의 첫 만남 {% hint style="warning" %} Coming Soon! {% endhint %} # 2017 \~ 2018 - 개발의 즐거움으로 버틴 대입 수험생활 {% hint style="warning" %} Coming Soon! {% endhint %} # 2018 \~ 2019 - C++과 함께하는 알고리즘 문제해결 {% hint style="warning" %} Coming Soon! {% endhint %} # 2019.03 - 학식봇 프로젝트 {% hint style="warning" %} Coming Soon! {% endhint %} # 2019.09 - 첫 직장, 새로운 도전 {% hint style="warning" %} Coming Soon! {% endhint %} # 2020 - PHP와 함께 한 단계 업그레이드 {% hint style="warning" %} Coming Soon! {% endhint %} # 2021 - 계속해서 업그레이드, 그리고 첫 이직 {% hint style="warning" %} Coming Soon! {% endhint %} # 2022 - 산업기능요원 시작! 사이드 프로젝트에 눈을 뜬 한 해 {% hint style="warning" %} Coming Soon! {% endhint %} # 2023 {% hint style="warning" %} Coming Soon! {% endhint %}