MyBlogLife

    ↑↓ 選択 · Enter 開く · Esc 閉じる

    開発 > Dev

    ITスキル · 開発中のプロジェクト · 今後の計画

    掲示板

    開発の進め方はいつも同じです。自分や身近な人の具体的な「面倒」から出発し、要件・設計・実装・デプロイまで一人で「実際に使える」ところまで持っていきます。 これまでに 9 つのプロジェクトを個人で開発し、Web フルスタック、デスクトップ、モバイル、LLM アプリケーションをカバーしています。新しいフレームワークを追うことより、作ったものが本当に使われているか、そして利用者のデータがどこに置かれるか――この二点を大事にしています。

    得意なこと

    LLM を実用に落とし込む

    工夫の大半はモデルの外側にあります。MangaTL は作品用語集と章全体の文脈を与えて訳語を安定させ、AI_Resume は 3 層のルールで無関係なメールを先に除外し、判断が必要なものだけを LLM に渡し、LangGraph の ReAct エージェントに DB を自ら引かせています。

    雑多な資料をデータにする

    JLPTsimu の問題バンクは PDF の過去問と教材から作りました。217 のアトミックなタスクに分けて並行処理し進捗を自動集計、CIDFontType0 で文字化けする場合は 300 DPI の OCR にフォールバックします。

    プライバシー優先の設計

    PeriodLog のデータは既定で端末内のみ。クラウド同期は任意で、6 桁コードでペアリングしアカウントは不要です。原則は「ローカルで動くならクラウドに上げない、集めなくていい情報は集めない」。

    技術に触れない人へ届ける

    MangaTL は Electron + PyInstaller でダブルクリックで使えるインストーラーに、SkillsPaste は Tauri でオフライン exe に。本サイトも Django サーバーから Cloudflare Pages の静的サイトへ移し、運用の手間をなくしました。

    Frontend

    • React（Next.js 16 / App Router）
    • JavaScript / TypeScript
    • Tailwind CSS / shadcn/ui
    • React Native（Expo）
    • ブラウザ拡張（WXT）

    Backend

    • Python（FastAPI / Django）
    • Node.js / Bun（Elysia）
    • REST / WebSocket
    • メール取り込み（IMAP）

    AI / LLM

    • LLM API 連携（GLM / MiniMax / Claude / DeepL）
    • Vercel AI SDK
    • LangGraph.js（ReAct エージェント）
    • コンテキスト設計（用語集 / 長文脈）
    • OCR / 検出（manga-ocr・YOLO・OpenCV）

    Database

    • Supabase（PostgreSQL + Auth + RLS）
    • PostgreSQL（Drizzle ORM）
    • SQLite
    • MySQL

    Desktop / CLI

    • Electron（+ PyInstaller パッケージング）
    • Tauri 2.x（Rust）

    Deployment

    • Cloudflare Pages / Workers
    • Vercel
    • AWS（Lightsail）
    • Docker Compose

    エンジニアリング実践

    • 自動テスト（bun test / Vitest）
    • i18n（中 / 日 / 英）
    • アクセシビリティ検査（pa11y）
    • 依存関係のセキュリティ（Dependabot）
    • Git / GitHub

    資格

    • JLPT N1（169 / 180）
    • BJT ビジネス日本語 J2（516）
    • AWS Certified Cloud Practitioner
    • CATTI 日本語翻訳 3 級
    • CET-6 英語（560）
    ITノートGitHub

    MangaTL

    デスクトップ / Web

    漫画の翻訳・写植：OCR + LLM + 自動レイアウト

    日本語漫画の半自動翻訳・写植ツール。1 話分を入力すると、訳文を元の吹き出しに写植し直した中国語版／英語版の画像と EPUB を出力します。 吹き出し検出で座標を取り、manga-ocr で日本語を読み、作品単位の用語集と章全体の文脈を持たせた LLM で翻訳し、吹き出しの実サイズに合わせて組み直す流れです。 訳文はそのまま完成品にはせず、間に校正 UI を挟みます——AI が下訳を入れ、人が一文ずつ直してから描画します。

    主な機能と内容

    • 吹き出し検出（YOLO、失敗時は OpenCV 輪郭に自動フォールバック）
    • manga-ocr による日本語認識。吹き出しの内外どちらのテキストも処理
    • 作品単位の用語集で、人名・固有名詞を話をまたいで統一
    • 翻訳済みの章テキストを文脈として戻し、呼称やネタの一貫性を担保
    • 校正 UI：一文ずつの修正と、検出漏れの吹き出しをドラッグで追加
    • フォントサイズ自動調整——収まらなくても「…」で省略しない
    • 写植画像／RTL 綴じ EPUB／LabelPlus 原稿を出力

    設計のポイント

    • 品質のボトルネックはモデルではなく文脈：一文ずつ孤立して訳さず、作品用語集と翻訳済みの章テキストを一緒に渡す
    • Human in the loop：AI が下訳し、人が一文ずつ校正してから描画するので仕上がりを制御できる
    • 検出にフォールバック経路：YOLO が失敗すれば OpenCV 輪郭に切り替え、1 ページの不具合で章全体が止まらない
    • 翻訳エンジンは切り替え可能（GLM / Claude / DeepL）で、特定ベンダーに依存しない

    技術スタック

    • Frontend：React + TypeScript
    • Backend：Python（FastAPI）
    • モデル：comic-text-detector + manga-ocr
    • Desktop：Electron + PyInstaller
    • Deployment：Docker Compose / Windows インストーラー

    最近の更新

    1. 【v3】校正 UI ＋ 用語集 ＋ 章全体の文脈

      v3 で「一発機械翻訳」から「AI 下訳＋人による一文ずつの校正」へ流れを変更。 作品単位の用語集と、翻訳済みの章テキストをプロンプトに戻す文脈機構を追加し、話をまたぐ人名や呼称がようやく安定しました。

    2. 【v5】デスクトップ版：ダブルクリックで起動、環境構築不要

      v3 は Docker・ターミナル・Python 環境が必要で、共同作業者には到底動かせませんでした。 v5 は Electron を殻にし、FastAPI バックエンドを PyInstaller で exe 化して子プロセスとして起動。モデル・DB・フォントはすべてユーザーデータ領域に置きます。 Windows NSIS インストーラーを配布し、インストール後はアイコンをダブルクリックするだけです。

    3. 【ワークフロー】翻訳の経験を再利用可能な手順に

      数をこなすうちに、品質を決めるのはモデルよりも文脈の与え方だと分かってきました。 そこで作品用語集・キャラの人物像と口調のドキュメント・感情に応じたフォント切り替えを標準手順として固定し、新作はそれに沿えばよい形にしました。

    JLPTsimu

    Web

    JLPT 模試と学習データ分析

    JLPT のオンライン模擬試験システム。解答データの分析と、個人向けの学習アドバイスつき。 日本の IT 企業で働く中国籍の同僚——既存の社員も新入社員も——を対象にしています。解き終わって点数が出て終わりではなく、毎回の解答を蓄積して時系列で分析し、弱点を示して対応する学習資料を薦めます。 工数が最も大きいのはサイト本体ではなく問題バンク——過去問と単語／文法書を構造化してデータにする作業です。

    主な機能と内容

    • レベル別（N1／N2／N3）のフル模試。聴解つき
    • 設問ごとの詳細解説：解き方＋各選択肢が正解／不正解である理由＋関連知識項目
    • 解答データを永続保存し、回をまたいだ時系列トレンド分析
    • 弱点の可視化と学習アドバイス
    • 単語／文法のナレッジベースを設問と相互リンク
    • 招待制アカウントと管理者コンソール

    設計のポイント

    • データ主権を優先：クローズドな模試サイトを使わず自作したからこそ、回をまたいだ時系列分析ができる
    • 権限の分離はデータベース層で：Supabase RLS ＋ 招待制アカウント
    • 最大の工数は問題バンク：アトミックなタスクに分けて並行投入し、テキスト抽出が失敗したら OCR に切り替える

    技術スタック

    • Frontend：Next.js 16（App Router）+ React 19
    • Backend：Next.js Route Handler（Node Runtime）
    • Database：Supabase（PostgreSQL + Auth + RLS）
    • 解説：LLM でオフライン一括生成し投入
    • Deployment：Vercel

    最近の更新

    1. 【立ち上げ】「既製品を探す」から「自分で作る」へ

      当初は既存の模試サイトをそのまま使うつもりでしたが、データが取れませんでした——API なし、クローズドソース、受講者の解答履歴も残せません。 本来の狙いが「学習状況を継続的に追う」ことである以上、データの主権は自分側になければならないため、自作を決めました。

    2. 【問題バンク】複数セッション並行投入で 217 タスク中 97% 完了

      問題バンクの投入は純粋な力仕事で単線では終わらないため、タスク分配ボードを用意しました。作業を 217 個のアトミックなタスクに分割し、複数セッションがそれぞれ引き受けて独立に進め、進捗を自動集計します。 N2／N3 の過去問、単語・文法書、IT 業務日本語をすべて投入済みで、計 211 タスクが完了。 踏んだ落とし穴も記録しました——たとえば一部の PDF は CIDFontType0 で、そのままテキスト抽出すると文字化けするため、300 DPI の OCR にフォールバックする必要がある、など。

    MangaNotifier

    Bot

    アニメ・ドラマ・漫画の毎日更新通知

    毎朝 7:00 に QQ グループへ更新情報を配信する Bot。今日どのアニメが更新されたか、どのドラマに新エピソードが来たか、どの漫画に新話が出たか。 作った理由は素朴です——追っている作品が多すぎて自分では覚えきれないので、Bot に覚えてもらうことにしました。

    主な機能と内容

    • 毎日の定時配信（アニメ／ドラマ／漫画の 3 カテゴリ）
    • アニメ情報は Bangumi、ドラマは TVMaze + TMDb、漫画は MangaDex から取得
    • NapCat 経由の WebSocket で QQ と接続
    • プラグイン方式の fetcher——データソース追加は 1 ファイル書くだけ

    技術スタック

    • Backend：Python
    • データソース：Bangumi / TVMaze / TMDb / MangaDex
    • 接続：NapCat（WebSocket）
    • Deployment：常駐プロセス＋定時実行

    最近の更新

    1. 【稼働】毎日 7:00 の配信を開始

      3 つの fetcher（アニメ／ドラマ／漫画）と QQ 配信をつなぎ、定時ジョブとして常駐運用を開始。 作り終えてから気づきましたが、この種の小さなツールの価値は技術的な高度さではなく、毎日ほんの一手間を実際に省いてくれることにあります。

    PeriodLog

    モバイル

    ローカル優先の生理周期記録・予測

    軽量な生理周期の記録・予測アプリ。 開始日・痛みの程度・その日のメモを記録し、履歴から平均±標準偏差で次回の予測範囲を算出、遅れればローカル通知でお知らせします。 全体を貫く設計方針がひとつ——データは既定で端末内にのみ保存。クラウド同期は任意で、使う場合も 6 桁コードのペアリングのみ。アカウント不要、身元情報も集めません。

    主な機能と内容

    • 素早い記録：日付・時間帯・痛みの程度・メモ
    • 次回の予測範囲を算出（平均±標準偏差）
    • 遅延リマインド（ローカル通知。サーバーを経由しない）
    • 気分フェーズの参考表示。既定は折りたたみ、タップで展開
    • 任意のクラウド同期：6 桁コードでペアリング、登録不要
    • 3 言語 UI（中／日／英）＋ダークモード

    設計のポイント

    • センシティブなデータは既定で端末内に保持。同期は任意で、6 桁コードでペアリングしアカウント不要
    • 予測はブラックボックスではなく、平均±標準偏差という説明可能な統計で
    • リマインドはローカル通知で、サーバーを経由しない

    技術スタック

    • Frontend：React Native + Expo
    • 言語：TypeScript
    • ローカル保存：expo-sqlite
    • クラウド同期：Cloudflare Workers KV（任意）
    • Deployment：Android APK / Web

    最近の更新

    1. 【クラウド同期】6 桁コードのペアリング、アカウント不要

      端末を変えるとデータが消えるのは、完全ローカル保存では避けられない代償です。 そこで Cloudflare Workers KV による任意同期を追加——書き込み時にプッシュ、起動時にプル、ペアリングは 6 桁コードのみ。 この種のデータはあまりに繊細なので、機能を弱めてでも利用者に身元を差し出させない設計にしました。

    2. 【i18n】3 言語＋ダークモード＋設定パネル

      中国語／日本語／英語の UI、ダークモード、そしてリマインド日数と同期のオン・オフを設定できるパネルを追加しました。

    MyBlogLife

    Web

    本サイト：3 言語の静的個人サイト

    個人の記事・創作・リソース・友人との交流を統合する個人サイトプロジェクト。 サイトは複数のサブモジュールを含む：記事システム（Ink）、画像ギャラリー（Gallery）、フレンドカードシステム（Friend_z）、リソース共有セクション。構造化コンテンツ管理・動的コンテンツアップロード・ピクセルスタイルUIによる個人展示プラットフォームに重点を置く。 また、Web開発・データベース設計・クラウドデプロイなどの技術を実践する個人技術実験プラットフォームとしても機能する。

    主な機能と内容

    • 記事投稿システム（Ink）
    • 画像・創作展示（Gallery）
    • RPGスタイルフレンドカード（Friend_z）
    • リソース共有モジュール
    • 中／英／日の 3 言語 ＋ hreflang
    • 完全静的配信、サーバー保守不要

    設計のポイント

    • 読み取り専用のサイトにサーバーは要らない：Django → 静的書き出し ＋ Cloudflare Pages で運用ゼロ
    • 3 言語はクエリ文字列やサブドメインではなく、パス接頭辞（/en/ /ja/）＋ hreflang で
    • デザインシステムの tokens で文字組みと配色を統一し、pa11y でアクセシビリティを検査
    • CJK フォントをページ単位でサブセット化：使う字だけを配信し、初回表示を約 5MB から 300KB 未満に

    技術スタック

    • Framework：Astro 7（静的出力）+ React アイランド
    • スタイル：素の CSS ＋ デザイントークン（ライト／ダーク）
    • フォント：ビルド時にページ単位でサブセット化（Noto Serif SC / JP）
    • デプロイ：Cloudflare Pages
    • 旧構成：Django + SQLite（AWS Lightsail）

    最近の更新

    1. 【再構築】Astro へ移行：コンテンツとレイアウトを分離

      静的サイトでサーバーは不要になったものの、63 個の HTML のうち 60 個にヘッダーがコピーされ、文言ひとつ直すにも 3 言語 3 ファイルを触る必要がありました。 そこで Astro で書き直し中：ページのロジックは一度だけ書き、プロジェクトや記事はデータファイルへ。あわせてライト／ダーク、ページ遷移のモーション、CJK フォントのページ単位サブセット化も追加。

    2. 【再構築】Django の動的サイトから純静的 ＋ Cloudflare Pages へ

      ほぼ読み取り専用の個人サイトのために年中サーバーを維持するのは割に合いませんでした——Gunicorn、systemd、証明書更新の面倒まで付いてきます。 そこで Django でレンダリングしていたサイト全体を静的 HTML として書き出し（中／英／日の 3 言語・計 63 ページ）、Cloudflare Pages へデプロイ。 あわせてデザインシステムも整備：共通のタイポグラフィスケールと配色トークン、言語スイッチャー、hreflang、アクセシビリティ修正。

    3. 【デプロイ】AWS Lightsail（$5プラン）にデプロイ済み

      AWS Lightsail（$5プラン）にデプロイ済み。 現在1ヶ月試用予定。その後、無料のOracleへ移行予定。

    開発ログ全 4 件

    1. 【デプロイ】Lightsail 初期公開

      Django + Gunicorn + Nginx を AWS Lightsail（東京リージョン、$5 プラン）にデプロイ。 systemd 自動起動設定、rsync ワンコマンドデプロイスクリプト deploy.sh を構成。

    2. 【i18n】三言語対応（中／日／英）

      Django i18n 国際化を実装し、簡体字中国語・日本語・英語の3言語切り替えに対応。 locale/ ディレクトリと .po 翻訳ファイルを追加し、全ページのテキストを翻訳可能にする。

    3. 【修正】Gunicorn ワーカーのハング問題

      Lightsailインスタンス上のGunicorn workerが断続的にフリーズする問題を発見（gevent互換性問題）。 sync worker に切り替え + timeout/max-requests 設定を追加し、問題を解決。

    4. 【移行計画】Lightsail → Oracle Cloud + Cloudflare

      サーバーを有料AWS LightsailからOracle Cloud Always Free（ARM A1、4コア/24GB）へ移行する計画。 Cloudflareがドメイン www.mybloglife.com を管理し、CDN / DDoS保護 / HTTPS自動化を実現。 oci CLI（v3.76.2）とflarectl CLIをインストールし自動化設定に使用。 完全な移行計画ドキュメントを作成しObsidianリポジトリに同期。

    MangaRe

    Web

    漫画リソース情報データベース

    漫画リソース情報を整理するサイト。漫画作品・作者・各種リソースタイプ（TVアニメ・漫画集・映画など）を管理する。 軽量な漫画リソースデータベースサイトの構築を目標とする。

    主な機能と内容

    • 漫画リソース登録
    • タグ分類管理
    • CSV / JSON データインポート／エクスポート
    • 漫画情報自動更新（予定）
    • 漫画リソース検索

    技術スタック

    • フロントエンド：React + TypeScript
    • Backend：Node.js
    • Database：Supabase
    • デプロイ：Vercel

    最近の更新

    1. 【高速化】静的書き出しでコールドスタートと越境レイテンシを回避

      初回表示の遅さの原因は 2 つの重なりでした——Next.js 関数のコールドスタートと、Supabase への越境クエリの往復レイテンシ。 資料カタログはもともと更新頻度が低く、毎リクエスト動的レンダリングする必要はないため、静的書き出し＋画像コンポーネント最適化に変更し、初回表示が大きく改善しました。

    2. 【ネットワーク地域問題】国内からVercelデプロイサイトにアクセス不可と判明

      国内の友人がアクセステストをしたところ、中国国内からVercelでデプロイされたサイトにアクセスできないことが判明しました。 今後は、小規模トラフィック向けの無料デプロイサービスの中から、この問題を解決する方法を探る予定です。

    3. 【MangaRe_Log】2026.3.5〜

      2026.3.5：画像ビューアを追加、複数ページ・カルーセル/ナビ/サイドバーを更新、プラットフォームリンク移行とSQLを新規追加。 2026.3.6：「正常起動」関連のコミットを完了（プロジェクトが正常に動作）。 2026.3.7：Vercelデプロイ前の仕上げ：書籍ダウンロードサイトとツール管理、RLS/ストレージポリシー、マイグレーションスクリプトとドキュメント。 2026.3.8：インポートフロー（JSON変換ページとimportページ）、リソース履歴・タイトル管理・フロントエンドページのリニューアルを実施。 2026.3.9：言語/プラットフォームオプションを統一、Vercelと移行ドキュメントを更新、バックアップ説明・インポートテンプレート・クローラー対策・ミドルウェアを新規追加（未コミット）。 2026.3.18：ここ数日も作業していたが、何をしたか忘れた =w=。昨日namecheapでドメイン【www.manga-re.com】を購入！漫画リソースを探している方はぜひ！

    開発ログ全 5 件

    1. 【デプロイ前準備】Vercel 初期デプロイ

      MangaRe を Vercel に初回デプロイ（2026-03-07）。 計 44 ファイル、+1763 行のコード。 Next.js 13 App Router + Supabase データベース設定完了。

    2. 【データインポート】CSV/JSON 一括インポートフロー

      漫画・アニメ・電子書籍・本子の複数タイプ一括インポートを実装（2026-03-08）。 10回のイテレーションコミットにより、JSON変換ページ・インポートバリデーション・エラー表示を改善。

    3. 【標準化】言語／タグフィールドの標準化

      言語フィールド・分類タグフィールドの統一規格化（2026-03-09）。 pinyin / wanakana の日中文処理互換性問題を修正。

    4. 【新機能】日本語学習ページ

      【日本語学習】ページを追加（2026-03-29）。 JLPT / BJT / リスニング＆スピーキングの3セクション + ⭐ピン留めコンテンツタブ。 ピン留めタブに「各セクション公式サイト」バナーグループを追加（JLPT / BJT / NHK 3公式サイト）。

    5. 【パフォーマンス最適化】ページ読み込み速度分析

      Vercelデプロイが遅い根本原因（Next.js コールドスタート + Supabase クロスリージョン遅延）を分析。 3つの案を評価：Next/Image コンポーネント最適化・SSR/ISR・ワンクリック静的エクスポート。 案3を実施：Image コンポーネント最適化 + 静態エクスポートにより、初期表示速度を大幅改善。

    MyProfile

    Web

    人物アーカイブとタイムライン可視化

    人物プロフィールを整理・展示するデータ管理サイト。 人物情報（タイムライン・関係ネットワーク・イベント記録・画像など）を構造化して保存し、人物の経歴と関係をビジュアルページで表示する。 大規模JSONデータの表示・複雑なUIレイアウト・タイムラインコンポーネント設計のテストにも使用する。

    主な機能と内容

    • タイムラインイベント表示
    • 人物関係ネットワーク
    • キャラクター情報モジュール表示
    • JSON データインポート／エクスポート
    • 管理画面でキャラクターファイル編集

    技術スタック

    • フロントエンド：React（Next.js）+ TypeScript
    • Backend：Node.js
    • Database：Supabase
    • デプロイ：未デプロイ

    最近の更新

    1. 【MyProfile_Log】2026.3.5~2026.3.9

      2026-03-05：プロジェクト初回コミット、バックエンド骨格（エンティティ・コントローラー・サービス・セキュリティ・ドキュメント）を構築。 2026-03-06：フロントエンドを統合し、インポート/エクスポート・タイムラインフェーズ・添付ファイルアップロード・イベント/ヒーロー写真管理を実装、タイムラインUIを再構築。 2026-03-07：タイムラインを強化（ホバーカード・年/月API・左サイドパネル）し、関係編集と起動スクリプトを追加。 2026-03-08：キャラクター模擬対話（キャラクターカード・DeepSeek/Mockレスポンス・フロントエンド対話パネル）を実装。 2026-03-09：人物写真パネルを追加し、タイムラインと編集ページにイベント/ヒーロー/人物写真管理を統合。

    開発ログ全 3 件

    1. 【世界観統合】メイドインアビス素材スキャンとアーカイブサイト

      ローカルの『メイドインアビス』設定集をスキャン（キャラクター設定画85枚 + 背景原画100枚以上 + BDBOXイラスト）。 『メイドインアビス』アーカイブサイト（ローカル試作）を構築：トップ・世界・深淵・人物図鑑の3ページ。 キャラクターカードグリッド・検索フィルター・モーダル詳細インタラクションをすべて実装。

    2. 【MIA RPG】キャラクターとストーリー設定の統合

      MIAオリジナルキャラクター（MIA・Zhen・Zoeなど）と『メイドインアビス』世界観を深く統合。 人物プロフィールMD・ストーリーラインドキュメント・虫鋳バベルの塔世界観の詳細設定を生成。 Obsidianノートに同期。

    3. 【ドット絵】RPG キャラクタードットスプライト制作

      Pixellabを使いMIAキャラクターのピクセルスプライト（16x16 / 32x32）を制作。 RPG Maker / GDevelop 用スプライトインポート規格ドキュメントを整理。 ピクセルアート制作ガイドをObsidian知識グラフに同期。

    AI_Resume

    Web + 拡張機能

    LLM による履歴書スクリーニング（ATS）

    HR・採用チーム向けの、AI による履歴書スクリーニングシステム（ATS）。 履歴書は企業メールから自動で取り込み → 解析 → ポジションの要件に沿って LLM が多面的にスコアリング → カンバン上で進捗を管理します。 v6 では当初の単体フロントエンドから 3 つの構成へ成長しました：バックエンドサービス、ダッシュボード、そして HR の日常業務向け Chrome 拡張。 作ってみて一番の学びは「ルールで片づくならモデルを呼ばない」こと。3 層のルールによる事前フィルタで無関係なメールの大半を落とし、LLM は本当に判断が要る場面にだけ使います。

    主な機能と内容

    • メール自動取り込み：IMAP で企業メールから履歴書を定期取得（2 段階の並行アーキテクチャ）
    • 3 層のルール事前フィルタ（送信元ドメイン → 件名キーワード → 添付ファイルの保険）。この層は LLM コストゼロ
    • 履歴書解析：PDF / DOCX からプレーンテキストを抽出
    • AI による多面的スコアリング：ポジション要件に沿って評価、10 並列
    • 出身校レベルの定量化：中国国内の 985 / 211 / 双一流 ＋ 海外 QS Top 300 → educationScore の評価軸へ
    • JLPT レベル抽出：履歴書から N1〜N5 を認識し、レベルで候補者を絞り込み
    • LangGraph の出身校アドバイザー Agent：ReAct 方式で DB ツールを自動呼び出し、HR がそのまま読める分析を出力
    • スコアリング出力は中国語／日本語に対応。ポジションの locale フィールドで切替
    • WebSocket リアルタイム通知：履歴書の処理完了を即座にダッシュボードへ
    • 候補者管理：複数条件での絞り込み・並べ替え・ステータス遷移・CSV エクスポート
    • Chrome 拡張：ページ上で校名を選択すると即座に照会、サイドパネルで AI の詳細分析

    設計のポイント

    • コストの階層化：ルールで弾けるものはモデルを呼ばない。3 層の事前フィルタは LLM コストゼロ
    • 負荷に合わせたランタイム選定：長時間接続・並列スコアリング・常駐 WebSocket のため、Edge Function から常駐 Bun サービスへ移行
    • 利用者に合わせた出力：内部ランクは並べ替え専用で、HR には元々なじみのあるラベルだけを見せる

    技術スタック

    • Frontend：React 19 + TypeScript + Tailwind CSS
    • Backend：Bun + Elysia（TypeScript ESM）
    • Database：PostgreSQL + Drizzle ORM
    • AI：Vercel AI SDK + MiniMax M2.7 / LangGraph.js
    • Extension：WXT + React 19
    • メール / 解析：ImapFlow + pdf-parse + mammoth

    最近の更新

    1. 【再構築】バックエンドを Edge Function から自前の Bun + Elysia へ

      初版はロジックを Supabase Edge Function に詰め込んでいましたが、すぐに限界が来ました。メールのポーリングは長時間接続を求め、一括スコアリングは並行処理を求め、WebSocket は常駐を求めます——いずれも Edge ランタイムの得意分野ではありません。 そこでバックエンドを Bun + Elysia の常駐サービスへ全面移行し、ORM は Drizzle、DB は自前の PostgreSQL に戻しました。 スコアリングもルールエンジンから LLM による多面評価へ移行して 10 並列で実行し、出身校レベルと JLPT レベルは絞り込み可能な評価軸として定量化しました。

    2. 【Agent】LangGraph の出身校アドバイザー：DB を自分で引かせる

      HR が聞いたことのない大学に出くわすと、たいていブラウザを開いて延々と調べることになります。 そこで ReAct 方式の Agent を追加しました。区分・国内ランキング・QS ランキングを調べるために DB ツールを呼ぶかどうかを自分で判断し、HR がそのまま読める出身校分析としてまとめます。 細かい点ですが、出力では DB 内部の S/A/B/C/D 区分をあえて見せず、985 / 211 / 双一流 / QS といった HR がもともと理解しているラベルだけを提示します。内部の格付けは並べ替えのためのもので、人に読ませるものではないからです。

    3. 【拡張】Chrome 拡張 v0.8.0：選択するだけで校名照会

      照会をブラウザ拡張にしたことで、HR は求人サイトとシステムの間を往復せずに済みます。ページ上で校名を選択 → アイコンが出る → クリックで tooltip。 エラー許容には想定以上に手間がかかりました。選びすぎた場合（記号や badge まで拾った場合）はテキストから校名を抽出し直し、選び足りない場合は候補リストと「別のものに変更」ボタンを出します。日本・韓国・香港・台湾の学校は原語の漢字表記を優先表示します。 サイドパネルは Agent につないで詳細分析を行い、学校を切り替えると前回のストリーミングを自動でキャンセルします。テストは 259 件。

    開発ログ全 2 件

    1. 【MVP 完成】コア機能実装

      React 18 + TypeScript + Vite + Supabase の完全アーキテクチャを構築。 求人管理 + 履歴書一括アップロード + PDF テキスト抽出（Python Flask マイクロサービス）を実装。 Supabase Edge Function で候補者の構造化情報を自動抽出。 ルールエンジンによるスコアリング（A/B/C/D）+ カンバンドラッグ＆ドロップによるフロー管理を完成。

    2. 【未完成】LLM 連携計画

      メール自動インポートはモック実装で、インターフェースは実際のメールサービス接続待ち。 LLMスコアリング強化機能のスケルトンは完成済みで、Claude APIによるインテリジェント分析の接続待ち。 PDFマイクロサービスをAWS Lightsailにデプロイ、フロントエンドのデプロイはVercel/Netlifyを参照。

    SkillsPaste

    デスクトップ

    常に最前面のワンクリックコピーツール

    Claude Code Skills ワンクリックコピー フローティングデスクトップツール。 常時画面最前面に表示され、すべてのスキルトリガーワードをカテゴリ別に一覧表示。クリックするだけでコピー可能。複数ワークスペースに対応し、汎用クイックペーストボードとして利用できます。

    主な機能と内容

    • フローティングウィンドウ（Always on Top）＋ 透明すりガラス UI
    • ドラッグ位置記憶 ＋ 📌 固定モード
    • ワンクリックでトリガーワードをコピー（クリックハイライト ＋ Toast フィードバック）
    • リアルタイム検索フィルター（マッチ語ハイライト）
    • EN / 中 トリガーワード二言語切替
    • マルチワークスペース対応（内蔵 Skills ＋ カスタム貼り付けボード）
    • 🌙 ダーク / ☀️ ライトテーマ切替
    • Ctrl+E 編集モード（追加／削除／並び替え）
    • システムトレイ（閉じる→トレイに格納）
    • 完全オフライン .exe、ブラウザ不要

    技術スタック

    • フロントエンド：HTML / CSS / JS（Tauri WebView）
    • Backend：Tauri 2.x（Rust）
    • Database：JSONファイル（skills-data.json ローカル保存）
    • デプロイ：Windows .exe（cargo tauri build）

    最近の更新

    最近の更新はありません。

    開発ログ全 4 件

    1. 【Phase 1】MVP — フローティングウィンドウ ＋ ワンクリックコピー

      Tauri 2.x プロジェクト骨格構築（frameless + always on top ウィンドウ）。 skills-data.json を読み込み、カテゴリ × スキルをレンダリング、クリックでクリップボードにコピー＋ハイライトフィードバック。 ダークすりガラス風 UI ＋ タイトルバードラッグ ＋ 📌 固定ボタン。 修正：中国語文字による PowerShell スクリプトエラー・アイコンパス問題。

    2. 【Phase 2-3】UX 改善 ＋ 編集モード

      Phase 2：位置記憶（起動時に前回座標を復元）、検索フィルター（リアルタイムハイライト）、Toast フィードバック最適化、EN/日中バイリンガルトリガーワード切替。 Phase 3：Ctrl+E 編集モード（カテゴリ・skill の追加/削除/並び替え）、システムトレイ（閉じる→最小化）、skill 説明 + 使用例の展開表示。

    3. 【Phase 4-5】UX 最適化 ＋ マルチワークスペース ＋ v1 リリース

      Phase 4：ライトテーマ切替、パス説明パネル（ℹ️ ボタン）、初期全折りたたみ状態。 Phase 5：マルチワークスペース対応（内蔵 Skills + Skills マーケット + ユーザー定義クリップボード）、NotebookLM skill インストールテスト。 v1.0.0 正式リリース、Windows .exe ビルド、プロジェクト README および Obsidian ドキュメント同期完了。

    4. 【Phase 6-8】Skills 一括インストール ＋ カテゴリ機能強化

      Phase 6：複数 skills の一括インストール（sync-obsidian、viral-writer など）、skills ガイドサイト草案を生成。 Phase 7：Skills カテゴリを補完（SNS/オフィス/音声・動画/デスクトップツール 等の新カテゴリ）、機能説明テキストを最適化。 Phase 8：Skills リストを Claude Code 公式ディレクトリに合わせ、分類ロジックを標準化、Obsidian 全量同期。

    【Comments · 留言板】ページを追加

    訪問者の皆さんからのコメント・インスピレーション・提案・くだらないジョーク(?)・今夜の夕飯(?)…などのメッセージをお待ちしています。 特に【Friend_z】に登録されているお友達のメッセージ、大歓迎です！ 今後は【Friend_z】に記録されたお友達それぞれに合わせた【個性的なコメントボックス】も作りたいと思っています。技術力が追いついたら（または適切なアニメーションライブラリが見つかり、このサイトのスペックとトラフィックが耐えられたら）、【個性的なアニメーション】も作りたいです。 ここに白昼夢を一つ置いておく。あなたはここでのんびりしていてください、すぐ戻ります。

    【構想中 · Friend_z キャラクター RPG インタラクティブミニゲーム】

    構想のみで、実装方法についてまったく見当がつかない。 まず考えてみる。