ReactNext CentralReactNext Central
New · 인터랙티브 데모

AI가 코드를 쓰는 시대,
판단과 취향을 기록합니다.

튜토리얼이 아니라, 무엇을 왜 골랐는지. 만들며 내린 결정들과, 제 생각으로 쓴 글들.

쇼케이스 둘러보기 에세이 읽기
핀테크 실전 경험 · 직접 내린 결정들
RNC Assistantonline
안녕하세요 👋 이 사이트가 궁금하신가요? 아래 버튼을 눌러보세요.

개인적인 글

제 생각으로 쓴 판단·취향·실패의 기록.

결정의 해부

만들며 내린 결정과 과정의 기록.

실험

최신 웹과 AI로 만든 인터랙티브 데모.

출간한 책

Next.js 실전 가이드, 그리고 『AI 시대, 판단하는 개발자』.

Essays

개인적인 생각과 의견

AI가 아닌, 제 생각으로 쓴 글.

판단을 AI에게 외주화하지 않기

2026.06

에세이 작성 시 AI에게 글을 쓰게 시키지 않는 이유

2026.06

왜 나는 내 기술 블로그를 다시 생각하게 되었는가

2026.06
Anatomy

판단의 기록

튜토리얼이 아니라, 무엇을 왜 골랐는지 — 이 사이트를 만들며 내린 결정들.

전시 21

검색을, 정적에서 런타임으로 바꿨다

검색 범위를 에세이와 해부까지 넓히려 했다. 그런데 발행된 에세이는 DB에서 오고(force-dynamic), 빌드 시점엔 그 내용을 알 수 없다 — 정적 search.json을 만들 수가 없다. 빌드타임 인덱스라는 익숙한 방식을 고수할 것인가, 아니면 런타임 API로 갈아탈 것인가.

읽어 보기 →전시 20

잘 만든 mock 셋을, 갤러리에서 지웠다

처음 쇼케이스를 채운 세 데모 — AI 어시스턴트 UI, 커머스 스토어프런트, 랜딩 — 는 정직하게 'mock'이라 표시돼 있었다. 동작하는 척이 아니라, 페어 프로그래밍으로 만든 인터랙티브 목업이라고. 그런데 실험 틀에 의도가 분명한 데모 열둘이 쌓이자, 이 셋이 거슬리기 시작했다. 'AI 어시스턴트 UI'도 '스토어프런트'도 '랜딩'도, 어디에나 있는 것들이다. 무엇을 왜 골랐는지가 없다. 남겨서 갤러리를 채울 것인가, 지워서 기준을 지킬 것인가.

읽어 보기 →전시 19

챗봇에게 본문을 주지 않았다 — 안내자이지, 대독자가 아니다

사이트 챗봇이 해부 글의 본문(rationale)까지 읽어주면 더 '친절'해 보인다. 하지만 그러면 챗봇이 원문을 대체하고, 방문자는 글을 직접 읽지 않게 된다. 챗봇을 '다 답해주는 비서'로 만들 것인가, 아니면 '이런 글이 있다'고 안내만 하는 도슨트로 둘 것인가.

읽어 보기 →전시 18

프롬프트를 강화하는 대신, 함수를 고쳤다

챗봇에게 '쇼케이스 보여줘'라고 하면 실험만 나오고 해부가 빠졌다. system prompt에 '해부도 함께 보여줘'라고 더 세게 쓸 수 있다 — 하지만 그건 여전히 모델의 선의에 기대는 확률적 방법이라, 또 빠질 수 있다. 프롬프트를 강화할 것인가, 아니면 함수가 해부를 반드시 반환하게 코드로 보장할 것인가.

읽어 보기 →전시 17

AI에게, '모르면 모른다'고 답하게 했다

docent 데모는 긴 문서에 대해 질문을 받는다. AI가 매끄럽게 다 답해주는 게 친절해 보인다 — 하지만 문서에 없는 내용을 그럴듯하게 지어내면 그건 환각이고, 이 사이트가 비판해 온 바로 그것이다. '항상 답을 주는' 챗봇으로 만들 것인가, 아니면 '근거가 있을 때만, 없으면 없다고' 답하게 할 것인가.

읽어 보기 →전시 16

에이전트에게, 승인 게이트를 달았다

relay 데모는 자연어 목표('노트북 담고 쿠폰 적용해서 결제 직전까지')를 받아 여러 단계를 스스로 실행하는 에이전트다. AI가 알아서 끝까지 처리하게 두는 게 '똑똑해' 보인다. 하지만 그게 옳은가 — AI가 사람 대신 결정을 내리며 자동으로 흘러가는 것이. 매끄러움을 위해 자율에 맡길 것인가, 아니면 각 단계를 사람이 승인하게 할 것인가.

읽어 보기 →
Experiments

실험

최신 웹과 AI로 만든 인터랙티브 실험.

PilotAI×웹

Pilot

자연어가 UI를 조작 — Gemini function calling으로 테마·정렬·필터·스크롤을 실제로 바꿉니다. 샘플 모드 기본, 키 BYOA.

데모 보기 →RelayAI×웹

Relay

승인받고 움직이는 에이전트 — 목표를 단계로 쪼개 [실행]을 눌러야 진행. 6스텝·루프 가드, 결제 직전까지. 샘플 모드 기본, 키 BYOA.

데모 보기 →CanvaslyAI×웹

Canvasly

스트리밍 Generative UI — AI의 structured output을 카드·타임라인·체크리스트로 점진 조립. 샘플 모드 기본, 키 BYOA.

데모 보기 →DocentAI×웹

Docent

답에 근거를 붙인다 — 제품 문서 Q&A, 근거 문단 하이라이트. 없으면 솔직하게 “없습니다”. 샘플 모드 기본, 키 BYOA.

데모 보기 →FormigAI×웹

Formig

자연어 한 줄이 폼을 채운다 — AI 구조화 추출로 예약 폼 필드를 순차 채움. 샘플 모드 기본, 키 BYOA.

데모 보기 →SemaAI×웹

Sema

키워드 말고 의미로 찾는다 — 임베딩+코사인 유사도 검색 팔레트(⌘K). 단어가 안 겹쳐도 매칭. 샘플 모드 기본, 키 BYOA.

데모 보기 →
Book

출간한 책

레벨업 리액트 프로그래밍 with Next.js웹앱의 작동 원리부터 SSR 방식을 적용한 현대적 접근까지.AI 시대, 판단하는 개발자출간 예정 — 무엇을 왜 선택하는가, 판단의 기록.