만약 포트폴리오 검증기가 실제로 당신의 UI를 볼 수 있다면 어떨까요?

Cairn — "나는 AI 엔지니어가 되고 싶다"를 검증된 포트폴리오로 만드세요

내가 만든 것

매년 수백만 명이 "나는 AI 엔지니어가 되고 싶다"와 같은 것을 입력합니다을 Google에 검색하고 그 다음 두 주 동안 탭에 잠긴다. 시작점을 알지 못하는 로드맵들. 구조가 없는 유튜브 플레이리스트들. 완료율이 13%인 무료 강좌들. 탭을 닫으면 즉시 사라지는 ChatGPT 로드맵들.

나는 Cairn을 만들었기 때문에 그 공백이 현실이며, 코딩 부트캠프의 100배 저렴한 대안이 아직 존재하지 않는다는 것을 진정으로 알고 있다.

Cairn은 개인 맞춤형 AI 학습 및 경력 엔진입니다. 당신이 당신의 목표를 평범한 영어로 말하면 — "6개월 안에 AI 엔지니어링 역할에 취업하고 싶습니다. 파이썬 기초를 알고 Flask 앱을 하나 만들었습니다" — 그리고 당신에게 구조화된 12주의 경로를 만듭니다: 단계, 실제 결과물을 가진 주간 마일스톤, 실제 학습 결과로 평가된 선별된 무료 자원, 그리고 만들기 위한 프로젝트. 정적인 문서가 아닙니다. 당신이 진행하면서 적응하는 생명체 시스템입니다.

하지만 제가 가장 자랑스러운 부분은 당신이 무언가를 출시할 때 발생하는 일입니다.

당신은 GitHub 저장소를 제출합니다. Cairn이 코드를 가져오고, 그것을 실행합니다.3단계 평가 파이프라인 — 구조적 검사, LLM을 활용한 코드 리뷰, 그리고 Gemma 4 12B가 실제로 실행 중인 앱의 스크린샷을 보는 다중 모달 시각 검토 — 그리고 통과하면 암호화로 서명된 자격 증명서가 cairn.dev/u/your-handle에 있는 공개 포트폴리오에 올라가며 그것이 바로 이 URL을 이력서에 올리는 것입니다. "X과정 완료"가 아닙니다. 검증된 작업입니다.

모든 학습 제품이 잘못하는 세 가지:

문제	Cairn이 이를 어떻게 해결하는지
길의 마비 — "나는 정말 무엇을 배워야 할까요?"	개인화된 12주 길은 실제 시작점에서 생성되지 않고 일반 템플릿에서 생성되지 않습니다
책임감 없음 — 당신은 자신의 목표를 그림자처럼합니다	매일의 격려, 연속 기록, 생활이 일어날 때 적응형 재계획
Proof-of-work 없음 — 튜토리얼 클론은 면접을 받지 못함	공개 포트폴리오에서 HMAC 서명 자격 증명을 사용한 다단계 프로젝트 검증

이 제품은 처음으로 인도 공학생과 직업 전환자를 위해 설계되었습니다 — 1000만 명 이상의 활동 학습자 시장으로, 이들은 부트캠프(₹3 란크+)를 제외한 모든 것을 가격으로 내려앉히지만 무료 자원에서는 아무런 구조도 받지 못합니다. 하지만 같은 문제는 전 세계적으로 존재하며, 아키텍처는 그것을 반영합니다.

데모

🎬 5분 튜토리얼

🌐 라이브 앱 (https://cairnapp.netlify.app/)

👤 예시 공개 포트폴리오 — 가입 없이 사용 가능 https://cairnapp.netlify.app/example

예시 포트폴리오는 검증된 Cairn 프로필이 어떤 모습인지 빠르게 확인할 수 있는 가장 빠른 방법입니다 — 사용자가 12주 후에 이력서에 올린 것입니다.

코드

🔗 GitHub 저장소 (https://github.com/Soham-0047/cairn)

저장소는 전역 stack TypeScript monorepo입니다.

frontend/    → Next.js 15 (App Router, SSR, Tailwind)
backend/     → Express + TypeScript + MongoDB + Mongoose
              └── llm/   → provider-agnostic router with fallback chains

모든 브랜드 가시적인 요소 — 이름, 로고, 색상, 헤로 본문, CTA 텍스트, LLM 제공자 체인 — 은 코드를 건드리지 않고 /admin를 통해 런타임 중에 편집할 수 있습니다. 그것은 우연이 아니며, 다음 해커톤에 대해 리팩토링 없이 코드베이스를 재사용할 수 있게 하는 것입니다.

제가 Gemma 4를 어떻게 사용했는지

이 부분을 신중하게 설명하고 싶습니다. 왜냐하면 흥미로운 선택은 어떤 Gemma 4 모델을 사용했는지가 아니라, 왜 세 가지 다른 모델을 세 가지 다른 작업에 사용했는지입니다.

"가장 큰 모델을 사용하는 것만으로는" 문제

경로 생성은 단일 프롬프트에 50개 이상의 편집된 자원, 유사한 과거 학습자가 완료한 경로, 그리고 사용자의 전체 프로필을 로드해야 하며, 그 모든 것을 논리적으로 추론하여 일관된 12주 계획을 생성해야 합니다. 이는 긴 컨텍스트 윈도우를 가진 큰 모델이 필요합니다.

텍스트 상자에서 목표 문장을 파싱하는 것 — 구조화된 필드를 추출하는 것과 같은 current_skills, target_roletimeline_weeks — 작고 지연 시간이 민감한 추출 작업입니다. 31B 모델을 사용하는 것은 낭비되고 느릴 것입니다.

사람의 실행 중인 앱의 스크린샷을 확인하여 UI가 코드가 주장하는 것과 일치하는지 확인하는 것을요? 전혀 텍스트 문제가 아닙니다.

세 가지 다른 모양의 작업. 세 가지 다른 모델.

모델 1 — Gemma 4 4B: 온보딩 중 목표 파싱

사용자가 평범한 영어로 목표를 입력하면, 그 텍스트는 Gemma 4 4B로 구조화된 추출에 전송됩니다.

왜 4B인가요? 구글 AI 스튜디오의 무료 티어에서 약 600ms로 실행됩니다. 이 호출은 사용자가 입력을 정제할 때마다 온보딩 세션당 여러 번 발생합니다. 여기서 27B 모델은 느리게 느껴지고 사용자가 경로를 시작하기 전에 빈도 제한을 초과할 것입니다. 작업은 제한적입니다: 짧은 단락에서 몇 가지 필드를 추출합니다. 4B는 깔끔하고 빠르게 그리고 무료로 처리합니다.

// backend/src/llm/router.ts
{
  task: "parse_goal",
  primary: "gemma-4-4b",  // fast + cheap; perfect for extraction
  fallback: ["gemini-flash"]
}

모델 2 — Gemma 4 27B: 경로 생성 및 코드 리뷰

대부분의 작업은 Gemma 4 27B를 통해 Google AI 스튜디오와 OpenRouter의 무료 Gemma 4 엔드포인트에서 수행됩니다.

경로 생성은 사용자의 구조화된 프로필, 편집된 자원 코퍼스의 하위 집합(~사용자의 목표 역할에 맞는 50개 항목 일치), 유사한 과거 학습자의 요약된 결과 데이터를 모두 단일 프롬프트 내 128K 컨텍스트 윈도우 내에서 로드합니다. 모델은 주제 간의 종속성, 현실적인 주간 시간, 목표 역할에 필요한 기술을 실제로 보여주는 프로젝트 종류에 대해 추론해야 합니다. 이는 작은 모델의 작업이 아닙니다.

동일한 모델은 코드 리뷰를 프로젝트 평가 단계 2에서 처리합니다: 다중 파일 리포지토리 스냅샷을 읽고 코드가 README에서 주장하는 바를 하는지, 사용자가 연습했다고 말한 기술을 보여주는지, 그리고 구체적으로 어디서 부족한지에 대해 답변합니다. 긴 맥락을 가진 다중 파일 코드 추론은 정확히 27B가 자리를 확보하는 곳입니다.

SYSTEM: You are an expert career coach generating a personalized learning path.
You have access to {N} similar-profile learners' actual completed paths and outcomes.
Prefer concrete projects over passive content...

[resource corpus subset]
[similar past learner paths with outcomes]
[user's profile + target role + weekly hours]

OUTPUT: JSON path schema only, no preamble.

모델 3 — Gemma 4 12B Vision: 주인공 기능

이것이 제가 가장 기대하는 것입니다.

사용자가 프로젝트를 제출할 때, GitHub URL과 함께 실행 중인 애플리케이션의 최대 4개 스크린샷을 업로드할 수 있습니다.Gemma 4 12B — 시각 기능을 갖춘 변형 버전 — 실제 UI를 살펴보고 코드와 README가 주장하는 내용과 비교합니다.

이는 순수 코드 검토에서 놓칠 수 있는 두 가지 실패 모드를 포착합니다.

"정교해 보이지만 코드는 혼란스러워요" — 다른 사람의 논리를 둘러싼 좋은 템플릿
"코드는 기술적으로 괜찮지만 UI는 플레이스홀더입니다" — README에는 작동하는 앱이라고 주장하지만, 스크린샷에는 404가 표시됩니다

나가 아는 다른 평가 방법이 이런 것을 한다고 생각하지 않습니다. 단순히 "테스트가 통과했는가"가 아니라, "실제로 내보낸 것을 보여줘"라고 합니다

// eval.service.ts — Stage 3
const visualReview = await llmRouter.call({
  task: "visual_eval",
  model: "gemma-4-12b-vision",
  messages: [
    {
      role: "user",
      content: [
        { type: "text", text: visualEvalPrompt(repo, readme) },
        ...screenshots.map(s => ({ type: "image_url", image_url: s }))
      ]
    }
  ]
});

평가 페이지는 사용자가 각 단계에서 어떤 제공업체와 모델이 실행되었는지 정확히 보여줍니다. 이 투명성은 의도된 것입니다 - 모델 선택 이야기 전체가 프로젝트를 제출한 모든 사람에게 보이는 것이 아니라 문서에 숨겨져 있는 것이 아니라는 것입니다.

전체 파이프라인

User submits GitHub repo + screenshots
         │
         ▼
Stage 1: Structural (deterministic)
  • README present?
  • Commit count + history
  • Tests exist?
  • File tree size reasonable?
         │
         ▼
Stage 2: Code review  →  Gemma 4 27B
  • Does code match README claims?
  • Originality vs known tutorial repos
  • Domain-specific checks (ML training loops? Backend auth?)
         │
         ▼
Stage 3: Visual review  →  Gemma 4 12B (vision)
  • Does the UI match what the code claims?
  • Polish level: shipped / demo / prototype?
  • Per-screenshot findings
         │
         ▼
Stage 4: Synthesis
  • Weighted score (pass threshold: ≥0.65 + originality ≥0.55)
  • If passing: HMAC-signed credential → public portfolio
  • If failing: specific, actionable feedback

제공업체 라우팅 + 백업

LLM 라우터는 Redis에서 각 제공업체별로 비율제한 여유 공간을 추적하고 무료 계층이 소진되면 자동으로 백업하는 ~300줄 모듈입니다.

Google AI Studio  →  OpenRouter (Gemma 4 free)  →  Gemini 2.5 Pro  →  DeepSeek V3

사용자에게 보이는 오류는 없습니다. 예상치 못한 청구는 없습니다 — 각 경로당 월간 비용 한도가 있습니다; 모든 무료 계층이 소진되면 라우터는 호출을 거부하고 제어되지 않은 유료 엔드포인트를 가리키지 않고 우아한 저하 메시지를 표시합니다.

전체 라우팅 테이블은 /admin/providers를 통해 실행 시간에 편집할 수 있습니다. Gemma 4를 다른 모델 패밀리로 교체하는 것은 UI 변경이 코드 변경이 아닙니다. 저는 이렇게 직접 만들었습니다.

이것이 Gemma 4 제출인 이유와 "Gemini로 브랜딩된 Gemma" 제출이 아닌 이유

세 가지 모든 Gemma 변형은 주요 공급자로 Google AI 스튜디오의 무료 계층에서 실행 중입니다. 27B 작업의 백업은 OpenRouter의 무료google/gemma-4-27b 엔드포인트는 Gemini가 아닙니다. 시야 평가에는 Gemma가 아닌 대체 옵션이 없습니다; Gemma 4 12B가 사용할 수 없으면 단계 3은 건너뛰고 평가는 "코드 전용 검토"로 표시됩니다. 멀티모달 스토리는 Gemma 4와만 작동합니다.

기술 스택

프론트엔드: Next.js 15 (앱 라우터, SSR), React 18, TypeScript, Tailwind CSS, NextAuth
백엔드: 노드.js 20, 표현식, 타입스크립트, 모링구스, 몽고DB 아틀라스
LLM 라우팅: 커스텀 제공자 무관 라우터 — 구글 AI 스튜디오, 오픈로터, 그로크, 세브라스, 투게더 AI
저장소: 몽고DB 아틀라스 (경로/진행), 클라우드페이 R2 (스크린샷)
인증: 깃허브 OAuth를 통한 NextAuth
결제: Razorpay (인도 UPI + 카드), Stripe (전 세계적)

혼자서, 대중 앞에서, 처음 AI 엔지니어링 역할을 얻으려는 사람들과 ₹3 란크를 부담할 수 없는 사람들을 위해 만들었습니다. 그게 당신이거나 그것을 묘사하는 사람을 아시면 - Cairn은 정확히 그런 목적을 위해 만들어졌습니다.

추천 피드

DEV Community