オープンソース エージェント スキル for TypeScript、React、Next.js パターン
ある開発者が、AIコーディングアシスタントがTypeScript、React、Next.jsプロジェクトのコードを生成・レビューする方法を改善するためのオープンソース「Agent Skill」—構造化マークダウンリファレンス—を公開しました。
概要
このスキルは17ファイルに収められた4,000行のリファレンスです。チュートリアルやnpmパッケージではなく、AIエージェントが参照するためのドキュメントです。作者がAI生成のフロントエンドコードで頻繁に遭遇した問題に対処するために作成されました。問題には以下が含まれます：
- APIレスポンスに実行時バリデーションではなく
as User型アサーションを使用すること。 "use client"ディレクティブをページ全体に誤って配置すること。- 不安定なオブジェクト依存関係を持つ
useEffectフックを記述すること。 - コードレビュー時に実際のバグと単なるスタイルの好みを区別できないこと。
主な機能と構造
このリファレンスは、エージェントの判断を導く特定のラベルで構造化されています：
- [HARD RULE]：必ず従うべきパターン。
- [DEFAULT]：推奨される標準的なアプローチ。
- [SITUATIONAL]：特定の状況でのみ適用すべきパターン。
正しいパターンを選択するための意思決定フローチャート、型エラー・ハイドレーション問題・useEffect問題の3つのデバッグプレイブック、実際のリスクとスタイルの好みを分離するコードレビュー経験則が含まれています。
インストールと互換性
インストールするには、以下を実行します：
git clone https://github.com/leejpsd/typescript-react-patterns ~/.claude/skills/typescript-react-patterns作者は、Claude Code、Cursor、Codex、Gemini CLIで動作すると述べています。不足しているパターンや誤ったガイダンスに関するフィードバックを求めています。
📖 Read the full source: r/ClaudeAI
👀 See Also
イタリアの列車データ用MCPサーバー：Claude内でのリアルタイム遅延・出発・時刻表情報
開発者がトレニタリア向けの非公式MCPサーバーを構築し、Claudeが自然言語で列車関連の質問に答えられるようにしました。このプロジェクトは、イタリアでの列車遅延確認のために複数のアプリを切り替える日常的な通勤問題を解決するために作成されました。
Rift CLI: 並列AIエージェントワークフローのためのGitワークツリー管理
Riftは、同じリポジトリ上でClaude Codeなどの複数のAIコーディングエージェントを同時に実行するために、分離されたGitワークツリーとブランチを作成するCLIツールです。ライフサイクルフック、決定論的ポートマッピング、マルチエディタワークスペースサポートが含まれています。
Claude CodeのMonitorツール、開発サーバーのログをAI駆動の自動修正にパイプ
Claude CodeのMonitorツールを使うと、開発サーバーをバックグラウンドで実行し、スマートなgrepフィルターでログを追跡し、Claudeが自動的にエラーを検出して修正を書き、コミットまで行います。その間、あなたはUIをテストできます。
RedditユーザーがAIアシスタントから個人の知識をエクスポートするための詳細なプロンプトを共有
Redditユーザーが、AnthropicのChatGPTインポート機能の限界を補うため、ClaudeなどのAIアシスタントから構造化された個人知識を抽出する包括的なプロンプトを作成しました。このプロンプトは、個人知識ベース、知的フレームワーク、知識グラフの3つの異なるJSON成果物を生成します。