Shinobi Reviews（シノビレビュー）

概要

wordpress.org から公式配布しているカスタマーレビュー収集用 WordPress プラグイン。データ管理だけを WordPress に任せ、表示や動きの部分は純粋な React で構成した。

課題・背景

WordPress の管理画面と公開フロントは、それぞれ他プラグインとの干渉条件が異なるため、UI ライブラリの選定とスタイリング戦略を分けて設計する必要があった。プラグイン自体の機能が多く、長期運用に耐える品質維持・向上の仕組みも必要だった。

アプローチ

品質維持には PHPUnit でのテストと TypeScript での型安全な開発を組み合わせた。バックエンド側は他プラグインとの干渉が無いため Material UI を採用し、データ取得・保存は axios で非同期化。フロントエンド側は干渉を考慮して Emotion でコンポーネント単位のスタイリングに切り替え、スパム防止に reCAPTCHA v3 で非同期判定を組み込んだ。フォーム送信はフロント・バックともに React Hook Form で統一した。

成果

wordpress.org 公式配布のプラグインとして長期運用中。フロント／バックの干渉条件に応じて UI 設計を分離した結果、競合プラグインと併存しても安定動作している。

担当範囲

企画立案／要件定義／コーディング／テスト／保守・運用／ユーザーサポート

技術スタック

WordPress／React／TypeScript／Material UI／Emotion／React Hook Form／reCAPTCHA v3