HWANG JUNHYEOK · PORTFOLIO 2026

PORTFOLIO

사용자가 겪는 문제를 실제 제품에서 작동하는 기능으로 풀고, AI 실행과 검증 조건을 설계합니다.

CONTACT

justn.hyeok@gmail.com

WEB

justn.me

GITHUB

justn-hyeok

LINKEDIN

justn-hyeok

안녕하세요

황준혁입니다.

HWANG JUNHYEOK · JUSTN

AI-native Product Engineer

학력

2024.03 - 2027.01

부산소프트웨어마이스터고 소프트웨어개발과 졸업 예정

자격

2025.07 정보처리산업기사

2026.03 SQL 개발자 (SQLD)

2026.04 리눅스마스터 2급

다루는 영역

AI-native 제품 개발

사용자 문제를 화면·API·AI 기능으로 구현하고, 실패와 검증 조건까지 제품에 연결합니다. 개발 과정에서도 agent가 반환한 코드와 실행 결과를 다시 확인합니다.

기반 역량 · Frontend

TypeScript·React·Next.js로 사용자 흐름을 구현합니다. 입력과 제출, 편집 상태와 복원이 일치하도록 조건을 정합니다.

목차

입력과 복구에서 AI 실행·검증까지 확장합니다.

01

제품 구현의 기반

Maru의 입력 · 제출과 자갈치의 저장 · 복원

02

AI 기능의 실행과 결과 검증

자갈치플랫폼의 실행 실패 처리와 코드 버전 재검증

03

AI 작업과 산출물 재검증

에이전트가 반환한 결과를 다시 확인하고 사람이 승인하는 과정

04

조직 운영

제품 팀과 공개 프로젝트 조직의 서로 다른 책임

05

오픈소스 기여

React Flow · Gajae Code의 문제 재현과 공개 반영

구현의 기반

01 Maru

사용자가 보는 입력과 실제 제출값의 일치

02 자갈치

함께 바뀐 편집 상태를 같은 시점으로 복원

부산소프트웨어마이스터고 입학 전형 서비스

Maru

입학전형 지원서에서 사진 업로드의 단계 진입 조건과 지원 유형별 제출값을 수정했습니다. 화면에 보이는 입력과 전송 데이터가 어긋나는 두 문제를 다뤘습니다.

#입학 전형 서비스 #Frontend · DX

기간

2025.04 – 2025.11

GitHub

저장소 보기

기여

01 사진·URL 동시 검증

02 검정고시 학교 정보 제거

기술

Next.js · React · TypeScript · Recoil · TanStack Query

근거 · PR #268 · 사진·URL 검증 ↗

다음 단계 검증 기준

2개 상태

보이는 이미지와 업로드 주소를 같은 시점에 확인합니다.

이미지 미리보기

READY

AND

업로드 URL

READY

두 값이 모두 준비되면

다음 단계 진입 조건 충족

구현 조건

image && (downloadUrl || uploadUrl)

근거 · PR #287 · 학교 정보 7개 제거 ↗

BEFORE · 화면만 변경

학교 정보는 숨겨졌지만

입력 상태에는 이전 값이 남았습니다.

화면과 실제 전송 값이 서로 다른 상태였습니다.

AFTER · 제출값도 변경

지원 유형을 다시 확인하고

학교 관련 7개 값을 비웠습니다.

검정고시 전형에서는 학교 관련 값을 비웁니다.

결과

보이는 조건과 보내는 조건을 하나의 기준으로 맞췄습니다.

개발자 학습 경로를 만드는 노드 편집기

자갈치

노드와 선으로 학습 경로를 만들고 공유하는 6인 팀 프로젝트입니다. 학습 경로 편집기의 상태·저장·복구 구현을 맡았습니다.

#Team Lead · Frontend Lead · PM

기간

2025.12 – 2026.04

GitHub

저장소 보기

기여

01 변경 빈도와 역할에 따른 상태 분리

02 노드·선의 통합 실행 취소와 복원

03 노드 순서 변경도 감지하는 자동 저장

04 손상 항목만 제외하는 부분 복구

05 복사한 노드의 ID와 연결 관계 갱신

기술

Next.js · React · TypeScript · Jotai · React Flow

근거 · PR #120 · 통합 편집 이력 ↗

이전 구조

노드

선

t-1

t-2

서로 다른 시점

통합 후

실행 취소

EditorState

{ nodes, edges } snapshot

결과

한 번의 실행 취소가 하나의 그래프를 복원합니다.

구조화·검증

01 자갈치플랫폼

AI 호출·작업 실행·제출 코드 상태를 검사와 사람 승인으로 확인합니다.

자갈치플랫폼

개인 주도 제품

자갈치플랫폼

AI 호출 경로와 실패·성공 처리 흐름을 구현했습니다. 호출 전 사용량을 예약하고, 실패하면 반환하며 성공하면 확정합니다. closed-alpha에서는 생성 품질이 아닌 실행 경계와 실패 처리를 확인했습니다.

#개인 주도 제품 #AI 실행 검증

기간

2026.08.25 – 진행 중

GitHub

저장소 보기

기여

01 INPUT · 학습 목표·문서·질문

02 OUTPUT · 로드맵·설명·추천

03 FINALIZE · 실패 반환·성공 확정

기술

Next.js · NestJS · Django · PostgreSQL · GitHub App · Docker

실행 근거 · closed-alpha 새 head 무효화·재승인 / Jagalchi API ↗

실제로 확인한 코드 버전 변화

A → B

새 커밋 뒤 상태 변화를 확인했습니다.

코드 버전 A

검증·승인 완료

↓

코드 버전 B

A의 검증·승인 무효

↓

같은 버전 B

재검증·재승인 완료

검증과 승인은 같은 코드 버전에만 유효합니다

버전 B 재검증·재승인 완료

자갈치플랫폼 · 운영과 복구

복구 절차는 확인했고, 자동 복구는 아직 검증 중입니다

closed-alpha에서 계정 흐름·데이터 복원·이전 API·AI 버전 복귀를 확인했습니다. 수동 smoke check는 통과했지만, 자동 복구와 상시 가용성은 아직 검증하지 않았습니다.

deploy/smoke.sh · closed-alpha recovery check

01 deadline=$((SECONDS + 300)) 02 while ((SECONDS < deadline)); do 03 health_endpoints_ready || continue 04 healthy=$(check_services api ai ai-db minio cloudflared) 05 ((healthy == 0)) && break 06 done 07 ((SECONDS >= deadline)) && exit 1 08 echo "production smoke check passed"

✓ closed-alpha 기록 · production smoke check passed

이 코드는 복구 후 서비스 준비 상태를 확인하는 흐름입니다. 데이터 복원과 이전 버전 복귀는 closed-alpha 기록에서 별도로 확인했습니다.

근거 · Evidence lifecycle issue #13 · Jagalchi Infra ↗

확인한 범위

데이터 복구와 이전 버전 복귀를 각각 확인했습니다.

남은 조건

사람 개입 없는

5분 이내 복구는 검증 중입니다.

수동 재시작 성공을 자동 복구·상시 가용성으로 확대하지 않습니다.

에이전트 실행 방식

01 작업 계약과 산출물 재검증

작업 범위와 완료 조건을 먼저 정하고, agent가 반환한 코드·테스트·실제 화면을 다시 확인합니다.

AI 작업 방식 · 하네스 기반 작업 분할과 직접 검증

완료 보고가 돌아와도, 검증 전에는 끝난 일이 아닙니다

하네스로 작업을 나누고 실행한 뒤, 완료 보고와 실제 화면을 다시 비교했습니다.

01 작업 설계

작업 범위 정의

Codex

수정 범위와 완료 조건을 작업 단위로 나눴습니다.

→

02 분할 실행

작업 실행

하네스 기반 실행

승인된 작업을 하네스로 분할하고, 완료 상태를 전달했습니다.

→

03 최종 판단

직접 확인

황준혁

완료 보고 뒤 실제 화면을 확인해 14페이지 제목 잘림을 발견했습니다.

결과

에이전트의 완료 보고를 참고하되, 최종 완료 여부는 실제 화면을 확인한 뒤 판단했습니다.

조직 운영

01 stacking-money-forever

제품별 책임을 분리하고 자동화 개입 조건을 명시했습니다.

02 BSSM-OSS

프로젝트 선정·소개·문서·유지 기준

조직 운영 · stacking-money-forever

제품별 담당 범위와 공개 상태를 구분했습니다

자갈치플랫폼 전반과 벙개 프런트엔드·디자인을 맡았습니다.

제품별 책임 · 공개 범위 · 자동화 개입 조건

프로젝트

본인 기여

공개·개발 단계

자갈치플랫폼

기획 · 디자인 · 개발

공개 저장소 · alpha

벙개

frontend · design

비공개 협업

Watchdog

프로세스 제어 전 대상 재확인

공개 v0.2.0

Stackot

승인 기반 agent 작업

비공개 MVP

rapi-agent

승인 기반 Agent 설계

구현 완료 · 테스트 검증

Hub Organization · Watchdog v0.2.0 ↗

조직 체계 · BSSM-OSS

학생 프로젝트가 발견되고 이어질 공개 기준을 정리했습니다

외부 사람이 프로젝트를 이해하고 실행·기여할 수 있도록 공개 기준을 운영합니다.

대표 목록

대표 프로젝트를 첫 화면에서 바로 찾을 수 있게 정리했습니다.

README

목적·설치·사용법·기여 방법을 한 문서에서 확인하게 했습니다.

기여 경로

Issue·PR 양식과 maintainer 설정을 공통 기준으로 정리했습니다.

유지 기준

초기·방치 저장소는 대표 목록에서 제외했습니다.

조직 전체 공개 저장소 98개 · 2026.09.08

근거 · BSSM-OSS Organization ↗

오픈소스 기여

01 React Flow · Gajae Code

실제 사용에서 찾은 문제를 원 프로젝트로 돌려보냈습니다.

주요 작업 · 오픈소스 · React Flow

연결선 양 끝에서 둥근 모서리가 사라지는 문제를 재현했습니다

중복 좌표 때문에 두 점 사이 거리와 모서리를 둥글게 만드는 값이 0이 되는 조건을 찾았습니다.

PR #5730 제안

근거 · PR #5730 · @xyflow/system 0.0.76 ↗

PR #5730

문제 재현

꺾임 위치 0·1에서 각진 모서리를 재현했습니다.

계산 원인 분석

중복 좌표 → 두 점 사이 거리 0 → 곡률 값 0

검토·재확인

관리자의 수정 후 여러 연결점에서 둥근 모서리가 복원되는지 확인했습니다.

주요 작업 · 오픈소스 · Gajae Code

에이전트의 완료 이벤트와 모델 연결 경로를 원 프로젝트에 구현했습니다

완료 알림 연결과 Command Code GOAT Plan의 인증·요청 경로를 각각 PR로 제출했습니다.

PR #1272

작업 완료 알림

작업이 끝나면 완료 정보를 외부 명령으로 전달하는 연결 기능을 추가했습니다.

PR #5050

Command Code GOAT Plan 인증

API key 로그인과 해당 모델 제공자로 요청을 보내는 경로를 구현했습니다.

두 변경 모두 원 저장소에 병합됐습니다.

근거 · PR #1272 · PR #5050 ↗

황준혁

제품을 만들고 진행 상태를 정직하게 남깁니다

justn.hyeok@gmail.com