Projects

プロジェクト

個人のサイドプロジェクトから大企業のプロダクトまで、開発に携わり担当してきたプロジェクトを新しい順に紹介します。

2026

個人プロジェクト2026

BiBoost - 海外動画高速化 for bilibili

オープンソース

海外ユーザーが Bilibili をより快適に視聴できるオープンソースのブラウザ拡張機能

Bilibili がデフォルトで割り当てる CDN ノードは、海外ユーザーにとって遠回りになることが多く、バッファリングの原因になっています。このオープンソースで永久無料の拡張機能は、動画とライブ配信のストリーム取得に使う CDN host を、その地域で最速のノードへ動的に並べ替え、再生の失敗や停止時にはネイティブのバックアップノードへ自動で fallback します。同一のソースコードで Chrome / Edge / Firefox / Safari に対応しており、アーキテクチャ設計から開発、ストア公開、保守まで、すべて私一人で手がけています。

技術的なポイント

ページの MAIN world に注入し、fetch / XHR と playinfo setter を hook して、ストリームの CDN host をリアルタイムに書き換え
自動フェイルオーバー：403/404/5xx、タイムアウト、再生のカクつきを検知し、まずはサイレントにバックアップノードへ切り替え
Python でクラウドソーシング型の速度測定デスクトップツール CDNSpeedTest を開発し、各国の実測データを回収してノードを選定
再現可能なビルド、ストア素材のスクリーンショット自動生成、リリースフローの自動化、Safari Web Extension

成果

2 日で開発・公開、広告ゼロで 9 日以内に週間アクティブユーザー 1,000 人を突破
83 日（3 か月未満）で週間アクティブユーザー 10,000 人を突破、直近 4 週間は 1 日あたり約 240 人の純増
評価 163 件、平均 4.9★、星 5 つが 98%、テキスト付きのフィードバック 106 件

Chrome Extension Manifest V3Vanilla JavaScript (ES6+)Safari Web Extension (Xcode)Node.jsPuppeteerPythonNeon (PostgreSQL)Claude Code

プロジェクトの詳細を見る

ストアページ GitHub

個人プロジェクト2026

Lazy CV

AI 駆動のカスタム履歴書生成システム（このサイトそのもの）

求人のリンクを渡すと、Claude Code の /cv コマンドが JD を自動で取得して要件を分析し、個人データソースをもとに中英バイリンガルのカスタム履歴書 Web ページを生成します。そのまま PDF として印刷できます。

技術的なポイント

複数の Claude Code skill でワークフローを構成：/cv、/update、/cover-letter、/job による求人検索
check-cv のルールチェック + ATS 加重スコアリングを、AI が生成した履歴書の品質ゲートとして運用
Docker → ECR → Lambda Web Adapter、静的アセットは S3 + CloudFront で配信

Next.js 16React 19TailwindCSS 4Drizzle ORMNeon Serverless PostgreSQLPlaywrightDocker

プロジェクトの詳細を見る

Web サイト GitHub

個人プロジェクト2026

SiyaMap

コンサート会場の座席ビュー共有プラットフォーム

UI デザイナーと 2 人で進めている side project です。プロダクトの構想と UI デザインはデザイナーが担当し、エンジニアリングは私が単独で手がけました。会場の SVG 座席図をインデックスとして、公演を観た人が自分の座席から実際に撮影した視界と観覧体験を投稿でき、後からチケットを購入する人は座席図をクリックするだけで、その位置からの実際の視界を確認できます。現在は Stage 環境にデプロイしています。

技術的なポイント

Next.js を Lambda Web Adapter で AWS Lambda 上で稼働させ、トラフィックがないときの計算コストをほぼゼロに
バックエンドは Route → Controller → Service のレイヤー構成とコンストラクタインジェクションを採用し、1 つの Zod schema からすべての DTO を導出
独立した image-processor Lambda が透かし入れとオンデマンドのリサイズを担当し、幅のホワイトリストでコスト型攻撃を防止
pnpm Workspaces + Turborepo で 3 つのモジュールを管理し、共通 UI コンポーネントライブラリは Storybook として個別にデプロイ

TypeScriptNext.js 16React 19HonoZodDrizzle ORMNeon Serverless PostgreSQLAWS LambdaTurborepoStorybook 10

SiyaMap System Architecture

プロジェクトの詳細を見る

GitHub インフラ構成図データベース ER 図

個人プロジェクト2026

AI 擬人化ペットチャットボット

n8n と大規模言語モデルを統合した LINE チャットボット

ペットを擬人化し、LINE でやり取りできるチャットボットです。大規模言語モデルと n8n のワークフローをベースに、文脈の記憶や画像・音声の理解に対応し、スタンプやテキストでやり取りできます。

技術的なポイント

n8n で LINE Webhook、Gemini API、データベースをオーケストレーションし、従来のバックエンド API 開発を不要に
過去の記憶を JSONL として保存・ベクトル化し、tool call を通じてペットに長期記憶を付与
Docker でコンテナ化し、DigitalOcean VPS にデプロイ

n8nGemini APILINE Messaging APIDocker

プロジェクトの詳細を見る

2024

TikTok2024 –

UG 海外グロース事業プラットフォーム

TikTok 広告の海外グロース事業を支えるエンタープライズ Monorepo

TikTok のオンライン広告における海外グロース事業ラインを支えるプラットフォームで、メディアアセット管理、財務精算、サプライヤー調達、データダッシュボードなどの領域をカバーし、50+ のサブプロジェクトと百万行規模のコードを管理しています。私は財務精算（契約、見積もり、精算書）と広告調達（依頼の提出、承認フロー、スコアリングタスク）の 2 つのサブシステムを担当しています。

技術的なポイント

Web Worker によるマルチスレッド CSV 検証で、社内フレームワーク下での互換性の制約を解決し、UI のフリーズ時間を 90% 削減
cache / cacheMany による関数キャッシュでフォームレンダリングエンジンを最適化し、500 個のフォームを含む画面の TBT を 98% 削減
LLM による契約の AI 検証：ルールをオンラインで設定可能、強制ブロックと警告の段階分け、読み取り専用の SQL Tool Call

React 17TypeScriptRush + PNPM WorkspacesArco DesignEChartsRspackJest

Multi-threaded CSV Validation with Web Worker

プロジェクトの詳細を見る

Web Worker アーキテクチャ図

2023

LINE Taiwan2023 – 2024

CMS を React & Next.js で再構築

4 名のチームを率いて LINE Shopping の管理画面を再構築

2023 年に私がこの移行を提案・主導し、マイクロフロントエンド（iframe）と Next.js App Router のアーキテクチャ導入を決定して、PHP ベースの LINE Shopping CMS を Next.js App Router で再構築しました。開発に加えて、技術選定、社内研修、スケジュール策定、タスクの割り振り、リスク評価も担当しました。

技術的なポイント

iframe でマイクロサービスを実現し、新旧プロジェクトを個別にデプロイしながら URL 単位で段階的に切り替え
LINE Taiwan で Next.js App Router を早期に採用したプロジェクトの一つ
コーディングに加え、アーキテクトとしてプロジェクト全体を設計し、PM も兼任：タスクの割り振り、技術ドキュメントの作成、ユーザーとのコミュニケーション

成果

移行完了後、開発時間を平均 30% 削減し、PHP の保守人員も不足から充足へ

ReactNext.jsApp Router

プロジェクトの詳細を見る

2021

AI.Book2021 – 2024

オンラインフォトブックエディタ

6 か月でゼロからリリースしたコアプロダクト

ユーザーがオンラインでオリジナルのアルバムを作成し、実物の記念アルバムとして印刷できるサービスです。ゼロから単独で設計・開発し、フロントエンドアーキテクチャ、エディタのコア、バックエンド API 設計を一人で手がけました。

技術的なポイント

Vue のみで構築したエディタ：ドラッグ＆ドロップでのレイアウト、写真の追加・削除、テキストとフォントの編集
PC とモバイルのブラウザに対応し、Google フォト／Instagram から写真をインポート可能
バックエンド API 設計を主導：Cognito OAuth2、カートと注文、決済連携

TypeScriptVue 2Nuxt 2VuexTailwindCSSAWS Cognito OAuth2AWS S3CloudFront

Web サイト

LINE Taiwan2021 – 2024

LINE Shopping

LINE の送客・ポイント還元プラットフォーム

LINE Shopping を経由して提携ショップで買い物をすると LINE ポイントが還元されるサービスで、サードパーティの EC を集約したショッピングの入り口でもあります。Vue SSR のフロントエンドと、数十のマイクロサービスを統合する BFF（Node.js + GraphQL）からなるフルスタックプロジェクトで、いずれも私が保守・開発・改善を担当していました。

技術的なポイント

「ライブショッピング」の調査・設計・開発・検証を単独で完遂
2 つの IntersectionObserver + Vuex のグローバルスケジューラー + HLS.js で、高速スクロール時のプレビューの混乱を解消
1 ページ内のライブ配信ソースが多すぎることによるメモリの急増を防止

Vue 2Vue SSRVuex 3TypeScriptNode.jsGraphQL (Apollo Server)RedisLighthouse CI

Auto-Play on Scroll — Live Stream List

プロジェクトの詳細を見る

Web サイトライブ自動再生アーキテクチャ図

LINE Taiwan2021 – 2024

JavaScript Task Force

全社のフロントエンド開発ガイドラインを策定するチーム横断グループ

実際のプロダクトではなく、各チームを代表するメンバーで構成されたプロジェクトチームで、LINE Taiwan 全体のフロントエンド開発ガイドラインを策定することを目的としています。SonarQube による静的コード解析、CI への Lighthouse スコアの組み込み、フロントエンド monitor ツールの OpenTel を調査し、React プロジェクトの初期 template 生成ツールも独自に開発しました。これは CI のルール、code lint、SonarQube の静的コード解析をテンプレートに組み込んだ CLI で、新規プロジェクトの初期構築を加速し、全社のフロントエンド標準を統一するものです。

TypeScriptCLI (yargs, prompts)Next.jsSentryLighthouse CISonarQubeESLintDrone CI

FundFluent2021

FundFluent UI Kit

フレームワークに依存しないプロジェクト横断の UI コンポーネントライブラリ

自ら主導し、ゼロから単独で開発した社内のプロジェクト横断 UI コンポーネント基盤です。Stencil.js で Web Components を構築し、CSS は TailwindCSS とカスタマイズした Semantic UI を組み合わせて会社の design system を実現しました。Storybook でドキュメントを作成し、private NPM に公開しています。

技術的なポイント

UI コンポーネントは Stencil で web components として構築しているため、フレームワークを問わず利用可能
Tailwind + Semantic UI で design system を構築
Storybook でコンポーネントを公開し、デザイナーとの確認をスムーズに
コンポーネントライブラリは private NPM に公開し、SME portal、Partner portal などの業務プロジェクトがそれぞれインストールして利用。ライブラリと業務コードは別々の repo で管理

Stencil.jsTailwindCSSFomantic UIStorybook

アーキテクチャ図