스크롤이 아닌, 당신이 쿼리하는 포트폴리오

Source: Dev.to

Introduction

대부분의 개발자 포트폴리오는 마찰을 일으킵니다. 시간 압박 속에서 리뷰어는 중요한 세부 정보를 놓치게 되는데, 이는 내용이 없어서가 아니라 프레젠테이션 선택 안에 파묻혀 있기 때문입니다. 독자는 포트폴리오에 맞춰야 하는데, 이는 역행하는 방식입니다. 정보 시스템은 사용자에게 적응해야 하며, 그 반대가 되어서는 안 됩니다.

이 프로젝트는 포트폴리오를 전통적인 웹페이지가 아니라 정보 시스템으로 다룹니다. 이것은 검색‑우선 개발자 포트폴리오입니다:

• 네비게이션 메뉴 없음
• “About / Projects / Skills” 탭 없음
• 스크롤할 고정된 내러티브 없음

탐색하는 것이 아니라 쿼리합니다.

예시 쿼리: “Shivam이 만든 프로젝트는 무엇인가요?”
답변: “아직 (그의 해커톤 우승 포럼 프로젝트)입니다.”

포트폴리오는 질문과 관련된 정보만을 검색해 명확하고 근거 있는 답변으로 제시하여 즉각적인 명료성을 제공합니다.

Live Interactive Demo

아래 임베드가 로드되지 않을 경우 전체 사이트를 여기서 확인하세요:

(임베드 자리 표시자)

Implementation Details

Retrieval‑Augmented Generation (RAG) System

• 포트폴리오는 챗봇이 아닙니다.
• 모든 콘텐츠는 사전에 준비되고 인덱싱됩니다.
• 실행 시 시스템은 관련 스니펫만을 검색하고, 검색된 컨텍스트만을 사용해 응답을 생성합니다.

실제 흐름:

1. 사용자가 질문을 합니다.
2. 시스템이 의도를 파악합니다 (프로젝트, 스킬, 연락처, 배경 등).
3. 의미적 유사성을 이용해 관련 포트폴리오 콘텐츠를 검색합니다.
4. 검색된 내용만 모델에 전달됩니다.
5. 응답에는 실제 출처를 가리키는 직접 인용이 포함됩니다.

이렇게 하면 답변이 예측 가능하고, 검증 가능하며, 실제 데이터에 기반하게 됩니다.

Flow

• Gemini 3 Flash → 인용이 포함된 구조화된 응답
• 생성 전 검색: AI는 전체 포트폴리오를 보지 않고 현재 쿼리와 관련된 내용만을 봅니다.
• 의도‑인식 필터링: 프로젝트 관련 질문은 프로젝트 데이터를 우선하고, 연락처 질문은 무관한 배경 정보를 끌어오지 않습니다.
• 검증 가능한 답변: 모든 답변은 특정 출처에 근거해 독자가 정보를 확인할 수 있습니다.
• 사전 계산된 임베딩: 빌드 시 생성되며, 런타임 작업은 검색과 생성에만 국한돼 지연 시간과 비용을 예측 가능하게 합니다.
• 우아한 제한 처리: 데모는 Gemini 무료 티어에서 실행됩니다. 사용 제한에 도달하면 시스템은 투명하게 포트폴리오 데이터만을 반환하고 동작 변화가 있음을 명확히 표시합니다.

Tech Stack

시스템은 의도적으로 작게 설계되었습니다.

About the Author

안녕하세요, 저는 Shivam Gawali입니다. 저는 인공지능 및 데이터 과학을 전공하는 학생으로, 소프트웨어 엔지니어링 기본과 백엔드 시스템에 강한 관심을 가지고 있습니다. 작은 완전한 시스템을 구축하고 실제 제약 하에서 어떻게 동작하는지 이해하는 것을 즐깁니다. 저는 표면적인 다듬음보다 정확성, 명료성, 그리고 추론 과정을 가시화하는 것을 더 중시합니다.

이 포트폴리오는 제가 생각하는 방식을 반영합니다: 질문에 집중하고, 잡음을 줄이며, 정확히 답변합니다. 포트폴리오는 보통 심한 시간 압박 속에서 검토됩니다. 검색은 이해를 보상합니다. 시스템을 이해하기 위해 문서를 검색할 수 있다면, 사람의 작업을 검색해 그들의 사고 방식을 이해할 수 있어야 합니다.