본문 바로가기
홍승아 프로필 사진

홍승아

프론트엔드 개발자

프론트엔드에서 시작해 풀스택과 AI 워크플로까지 반경을 넓혀온 개발자입니다. 커머스 서비스의 레거시 현대화, 글로벌 전환, 클라우드 이전을 직접 수행했습니다.

경력
15년
재직 회사
4
기술 아티클
69

펀딩·스토어·메이커페이지 스튜디오 등 메이커 서비스 전 영역을 다년간 책임지며, 레거시(JSP)에서 모던 스택(React·Vite·pnpm)으로, 국내에서 글로벌로, IDC 환경에서 클라우드로 이어지는 세대 교체를 실제로 수행했습니다.

개발 프로세스 자체를 Claude 기반 하네스로 코드화해 팀의 개발·품질 문화를 끌어올렸습니다.

변화하는 기술에 관심을 가지고 끊임없이 배우려는 자세를 가졌습니다.

개발 공유의 중요성을 알기에 기술블로그와 Notion에 지속적으로 공유하고 있습니다.

개발 시 걸림돌이 되는 업무는 적극적으로 해결하려 노력합니다.

기술 스택

Frontend

ReactTypeScriptNext.jsGatsbyReduxRedux ToolkitRecoilZustandJotaiSWRTanstack QueryReact Hook Formi18nextMSWTailwind CSSStyled-ComponentsSCSSCSS ModulesHTML5CSS3JavaScript

Build & Tooling

ViteWebpackesbuildpnpmFSD (Feature-Sliced Design)ESLint 9 (flat config)PrettierstylelinthuskyTree Shaking

Test

VitestJestPlaywrightCypressStorybook

DevOps & Infra

AWS (EKS, S3, SES, ECR)KubernetesHelmDockerGitHub ActionsOIDC 배포 인증QdrantFastAPI

AI Tooling

Claude Code하네스 엔지니어링RAG (하이브리드 검색)MCPFastMCPFigma MCP

Monitoring

Sentry

Collaboration

GitJiraConfluenceSlackFigmaNotion

경력

4개 회사에서 쌓은 15년의 개발 경력입니다. 회사를 선택하면 상세 페이지로 이동합니다.

와디즈 로고

와디즈

프론트엔드 개발자

2020.11 ~ 2026.08

펀딩·스토어·메이커 스튜디오 전 영역을 담당하며 스토어 상세페이지와 글로벌 메이커 스튜디오를 신규 구축했고, 레거시 JSP 모놀리스의 점진적 React 전환과 AWS EKS 클라우드 이전, Claude Code 기반 AI 개발 워크플로 구축을 수행했습니다.

기술 스택

ReactTypeScriptNext.js 16SCSSReduxTanstack-queryReact-hook-formi18next
상세 보기

프로젝트

직접 만들고 운영 중인 결과물과 외부에 공개한 발표·기고입니다.

개인 프로젝트

개인 포트폴리오 스크린샷

개인 포트폴리오

2022.11 ~

하이브리드 2탭 아키텍처 — SSR 포트폴리오와 클라이언트 AI 챗을 한 화면에서 전환합니다. Next.js 16 App Router / React 19 / TypeScript 5 / Tailwind CSS 4 기반이며, Groq(Llama 3.3 70B) 스트리밍 챗봇과 키워드 감지 데이터 카드, ko/en 다국어, 다크모드, WAI-ARIA Tabs 접근성을 갖췄습니다.

Next.js 16React 19TypeScript 5Tailwind CSS 4Groq APINodemailer
개인 기술블로그 스크린샷

개인 기술블로그

2022.11 ~

Gatsby(SSG) 기반 기술블로그입니다. 69편의 아티클을 한/영 이중 언어로 작성해 총 138개 문서를 운영하며, 프론트엔드 → 빌드/번들러 → 테스트 → AI 하네스로 확장된 학습 궤적을 축적하고 있습니다.

GatsbyTypeScriptStyled-ComponentsVitestPlaywright

발표 & 기고

AI 하네스 엔지니어링 시리즈 대표 이미지

AI 하네스 엔지니어링 시리즈

2026.06 ~ 2026.07

팀 개발 프로세스를 실행 가능한 파이프라인으로 코드화한 과정과, 하네스가 스스로를 진단·개선하는 메타 루프 설계를 6편의 아티클로 정리했습니다.

아티클 6편보러 가기
와디즈 펀딩/프리오더 상세페이지 성능 개선 대표 이미지

와디즈 펀딩/프리오더 상세페이지 성능 개선

2022.08

이미지 지연 로딩, 콘텐츠 리플로우 방지, 넓은 범위의 이미지 프리로딩으로 로딩 속도와 CLS를 개선하고 사내 기술블로그에 기고했습니다.

웹 전자 문서 편집 동작 방법 특허 대표 이미지

웹 전자 문서 편집 동작 방법 특허

2020.01

모듈 간 통신을 위한 데이터/구조 모델링과 actor·updator·render 렌더링 구조에 대한 특허를 출원했습니다. (출원번호 1020674990000 입력 후 검색)

학습 아카이브

2020년부터 69편의 기술 아티클을 한/영 이중 언어로 작성해 총 138개 문서를 운영하고 있습니다. 아래 64개 링크는 주제군별로 정리한 것으로, React 17→18→19, Next.js 13→14→15, Vite 6→7→8처럼 릴리스마다 직접 검증해 기록했습니다.

기술블로그 전체 보기

자주 묻는 질문

경력·기술·연락에 대해 가장 많이 받는 질문을 정리했습니다.

홍승아는 어떤 개발자인가요?

홍승아는 15년차 프론트엔드 개발자로, 현재 와디즈에서 펀딩·스토어·메이커 스튜디오 서비스를 담당하고 있습니다. 프론트엔드에서 출발해 Spring Boot 백엔드 API, AWS EKS 클라우드 이전, Claude Code 기반 AI 개발 워크플로까지 반경을 넓혀왔습니다.

총 경력과 재직 회사는 어떻게 되나요?

총 15년의 개발 경력을 4개 회사에서 쌓았습니다. 와디즈(2020.11~현재) 프론트엔드, 한글과컴퓨터(2016.12~2020.11) 웹한글 Canvas 렌더링, 오스템임플란트(2013.04~2016.12) 치과용 윈도우 프로그램, 블루버드소프트(2010.06~2012.05) 임베디드 단말기 순입니다.

주요 기술 스택은 무엇인가요?

React·TypeScript·Next.js를 중심으로 합니다. 상태관리는 Redux Toolkit과 Tanstack Query, 테스트는 Vitest·Playwright·Storybook·MSW, 빌드는 Vite와 pnpm을 사용합니다. 백엔드는 Java·Spring Boot, 인프라는 AWS EKS·Kubernetes·Helm, AI 도구는 Claude Code와 RAG·MCP를 다룹니다.

와디즈에서 담당한 업무는 무엇인가요?

펀딩·스토어·메이커페이지 스튜디오 등 메이커 서비스 전 영역을 담당했습니다. 스토어 상세페이지와 글로벌 메이커 스튜디오를 신규 구축했고, 레거시 JSP 모놀리스를 5년 8개월간 운영하며 React로 점진 전환했으며, IDC 환경을 AWS EKS로 이전했습니다. 자세한 내용은 /career/wadiz 페이지에서 확인할 수 있습니다.

테스트 자동화는 어떻게 구축했나요?

Cypress sanity 테스트에서 출발해 Playwright E2E로 전환하고 앱별 독립 E2E 워크스페이스를 구축했습니다. MSW 모킹 데이터를 서버 모킹·스토리북·유닛테스트·E2E에서 공통으로 재사용하고, data-testid 의존 셀렉터를 role 쿼리와 로케일 무관 라벨 매처로 바꿔 다국어·다환경에서도 깨지지 않도록 만들었습니다.

AI 개발 워크플로는 어떻게 구축했나요?

개발 전 과정을 research → prd → develop → review → verify 오케스트레이터로 코드화했습니다. 정적 분석 5종을 병렬 선행하고 통과한 경우에만 비용이 큰 E2E 검증을 실행하는 비용 최적 순서를 설계했으며, 하네스 자체를 진단·개선하는 meta-harness와 기획 품질을 검증하는 product-spec 하네스를 함께 운영합니다.

성능 개선 경험이 있나요?

있습니다. 와디즈 펀딩/프리오더 상세페이지의 성능을 개선해 2022년 8월 사내 기술블로그에 기고했습니다. 이미지 지연 로딩, 콘텐츠 리플로우 방지, 넓은 범위의 이미지 프리로딩을 적용해 로딩 속도와 CLS(Cumulative Layout Shift)를 개선했고, 이후 gif→mp4 변환과 번들 분할 전략 개선으로 미디어·번들 비용을 줄였습니다.

기술 공유 활동은 어떻게 하고 있나요?

2020년부터 기술블로그에 69편의 아티클을 한/영 이중 언어로 작성해 총 138개 문서를 운영하고 있습니다. 이 포트폴리오에는 그중 64개 링크를 주제군별로 정리해 두었습니다. React 17→18→19, Next.js 13→14→15, Vite 6→7→8처럼 릴리스마다 직접 검증해 정리합니다.

연락은 어떻게 하면 되나요?

이메일 gmm117@naver.com 또는 이 페이지 하단의 연락 폼으로 문의할 수 있습니다. GitHub(https://github.com/seungahhong)과 기술블로그(https://seungahhong.github.io/)에서도 작업 내역을 확인할 수 있습니다.

연락하기

제안이나 궁금한 점이 있다면 편하게 남겨주세요.