あなたのポートフォリオ検証者が実際にあなたのUIを見ることができたらどうなるでしょうか？

Cairn「"AIエンジニアになりたい"を認定ポートフォリオに変える」の提出です

私が作ったもの

毎年、数百万人が"AIエンジニアになりたい"と何かをタイプします を Google で検索して、その後2週間、タブで溺れる。あなたがどこから始めるか分からないロードマップ。構造のない YouTube プレイリスト。13% の完了率の無料コース。タブを閉じるとすぐに消えてしまう ChatGPT ロードマップ.

私は Cairn を作ったのは、そのギャップが本物であり、コーディングブートキャンプの100倍安い代替手段はまだ存在しないからです。

CairnはパーソナライズされたAI学習とキャリアエンジンです。あなたの目標を平易な英語で伝えると——「6ヶ月でAIエンジニアの役割に就きたい、Pythonの基本的なことを知っており、Flaskアプリを1つ作った」——となります。 — それであなたに構造化された12週間のパスを構築します：フェーズ、実際の成果物を持つ週ごとのミレニアム、実際の学習者の成果で評価されたカレントリソース、そして作成するプロジェクト。静的な文書ではありません。進行に合わせて適応する生きているシステムです.

しかし、私が最も誇りに思っているのは、何かをリリースしたときに起こることです.

あなたのGitHubレポジトリを提出します。Cairnがコードをプルし、それを通して実行します。三段階評価パイプライン — 構造チェック、LLMで駆動されるコードレビュー、そしてGemma 4 12Bが実際にあなたの実行中のアプリのスクリーンショットを見る多様モードのビジュアルレビュー — そして合格すれば、暗号学的にサインされた資格証明書がcairn.dev/u/your-handleにあなたの公開ポートフォリオに掲載されます。これがあなたの履歴書に載せるURLです。「Xコースを完了した」というのではなく、検証済みの作業です。

学習製品が間違えてしまう三つのこと：

問題	Cairnがそれをどう解決する
道の迷い — "私に何を学べばいいの？"	実際のスタートポイントから生成されるパーソナライズされた12週間のパス、汎用的なテンプレートではなく
責任感の欠如 — 自分の目標を放り出す	毎日の小さな促し、連続記録、生活が起きるたびに適応的な再計画
プルーフ・オブ・ワークがない—チュートリアルのクローンは面接を受けられない	公開ポートフォリオ上でHMACサインされた資格情報を使用した多段階プロジェクト検証

この製品は最初にインドの工学学生とキャリアチェンジ者向けに設計された—10M人以上のアクティブな学習者がいる市場（ブートキャンプ（₹3ラクス以上）から価格を払えず、無料リソースからは何の構造も得られない）—しかし同じ問題は世界中に存在し、そのアーキテクチャはそれを反映している

デモ

🎬 5分間のウォークスルー

🌐 ライブアプリ (https://cairnapp.netlify.app/)

👤 例としての公開ポートフォリオ — サインアップ不要 https://cairnapp.netlify.app/example

サンプルポートフォリオは、認証されたCairnプロフィールの見た目を確認する最も速い方法です——ユーザーが12週間後に履歴書に載せるものです

コード

🔗 GitHubリポジトリ (https://github.com/Soham-0047/cairn)

リポジトリはフルスタックのTypeScriptモノレポです

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モデルを使ったかではなく、なぜ、3つの異なる仕事のために3つの異なるものを使ったかだからです.

「ただ最大のモデルを使えばいい」という問題

経路生成には、50以上のカレントリソース、類似した過去の学習者の完了経路、およびユーザーの完全なプロフィールを単一のプロンプトにロードし、それらすべてを推論して一貫した12週間の計画を作成する必要があります。それには、大きなモデルと長いコンテキストウィンドウが必要です.

テキストボックスから目標文を解析する——構造化フィールドを抽出するcurrent_skills、target_roletimeline_weeks — は小さく、遅延に敏感な抽出タスクです。31Bモデルを使うのは無駄で遅いでしょう。

誰かの実行中のアプリのスクリーンショットを見て、UIがコードが主張するものと一致しているかどうかを確認する？それは全くテキストの問題ではありません。

三种異なる仕事の形。三种異なるモデル。

モデル1 — Gemma 4 4B: セットアップ時の目標パーサリング

ユーザーが平易な英語で目標を入力すると、そのテキストはGemma 4 4Bへ構造化抽出に送られます。

なぜ4Bなのか？Google AI Studioの無料プランで約600msで動作するからです。この呼び出しはユーザーが入力を調整するたびにオンボーディングセッションごとに複数回発生します。ここで27Bモデルを使用すると、ユーザーがパスを開始する前に遅延を感じさせずにレートリミットを超過してしまいます。タスクは制限されています：短い段落から数個のフィールドを抽出します。4Bはそれをクリーンに、速く、無料で処理します.

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

モデル2 — ゲンマ4 27B: パス生成とコードレビュー

重い仕事は ゲンマ4 27B にGoogle AI StudioとOpenRouterの無料ゲンマ4エンドポイントを通じて行われます。

パス生成は、ユーザーの構造化されたプロフィール、カレントリソースコーパスのサブセット（ユーザーのターゲットロールに一致する約50項目）および類似した過去の学習者の要約された結果データを、1つのプロンプト内で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.

Model 3 — Gemma 4 12B Vision: その主人公機能

これが一番ワクワクするものです

ユーザーがプロジェクトを提出すると、GitHubのURLとともに、実行中のアプリケーションのスクリーンショットを最大4枚までアップロードできますGemma 4 12B — 視覚機能付きバリエーション — は実際のUIを確認し、コードとREADMEの主張と照らし合わせています。

これは純粋なコードレビューでは見逃される二つの失敗モードを捉えます：

「見栄えは良いですがコードは散漫」 — 他人のロジックを包む見栄えの良いテンプレート
「コードは技術的に問題ないですがUIはプレースホルダー」 — リードマークダウンは動作するアプリケーションであると主張していますが、スクリーンショットには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の提出であり、「Gemmaブランディング付きGemini」の提出ではないのか

三つのGemmaバリエーションは主要提供者としてGoogle AI Studioの無料プランで動作しています。27BタスクのフォールバックはOpenRouterの無料プランですgoogle/gemma-4-27b エンドポイントは Gemini ではありません。ビジョン評価には非 Gemma のフォールバックがありません；Gemma 4 12B が利用できない場合、ステージ3はスキップされ、「コードのみのレビュー」として評価がフラグ付けられます。多モーダルストーリーは Gemma 4 としか動作しません。

テックスタック

フロントエンド： Next.js 15 (App Router, SSR)、React 18、TypeScript、Tailwind CSS、NextAuth
バックエンド： Node.js 20、Express、TypeScript、Mongoose、MongoDB Atlas
LLMルーティング：カスタムプロバイダ非依存ルーター — Google AI Studio、OpenRouter、Groq、Cerebras、Together AI
ストレージ： MongoDB Atlas (パス/進捗)、Cloudflare R2 (スクリーンショット)
認証： GitHub OAuth via NextAuth
決済： Razorpay (インド UPI + カード)、Stripe (グローバル)

個人で公開され、初めてAIエンジニアの役割を得ようとしている人々、そしてブートキャンプに30万ルピーを費やすことができない人々のために作られました。それがあなたなら——それに、それに該当する人を知っているなら——Cairnはまさにそのために作られています。

おすすめ購読元

DEV Community