第7章 動的プラグイン
7.1. 動的プラグインの概要
7.1.1. 動的プラグインについて
動的プラグインを使用すると、実行時にカスタムページおよびその他のエクステンションをインターフェイスに追加できます。ConsolePlugin カスタムリソースはコンソールと共にプラグインを登録し、クラスター管理者は console-operator 設定でプラグインを有効にします。
動的プラグインの作成は、テクノロジープレビュー機能としてのみご利用いただけます。テクノロジープレビュー機能は、Red Hat 製品サポートのサービスレベルアグリーメント (SLA) の対象外であり、機能的に完全ではない場合があります。Red Hat は、実稼働環境でこれらを使用することを推奨していません。テクノロジープレビュー機能は、最新の製品機能をいち早く提供して、開発段階で機能のテストを行いフィードバックを提供していただくことを目的としています。
Red Hat のテクノロジープレビュー機能のサポート範囲に関する詳細は、テクノロジープレビュー機能のサポート範囲 を参照してください。
7.1.2. 主な特長
動的プラグインを使用すると、以下のカスタマイズを OpenShift Container Platform エクスペリエンスに設定することができます。
- カスタムページの追加。
- 管理者と開発者を超えたパースペクティブを追加します。
- ナビゲーション項目の追加。
- リソースページへのタブおよびアクションの追加。
7.1.3. 全般的なガイドライン
プラグインの作成時には、以下の一般的なガイドラインに従ってください。
-
プラグインをビルドして実行するには、
Node.jsとyarnが必要です。 -
CSS クラス名の前にプラグイン名を付けて、競合を回避します。例:
my-plugin__headingおよびmy-plugin_\_icon - 他のコンソールページとの一貫したルック、フィール、および動作を維持します。
プラグインの作成時には、react-i18next のローカリゼーションガイドラインに従ってください。以下の例のように
useTranslationフックを使用できます。conster Header: React.FC = () => { const { t } = useTranslation('plugin__console-demo-plugin'); return <h1>{t('Hello, World!')}</h1>; };- 要素セレクターなど、プラグインコンポーネント外のマークアップに影響を与える可能性のあるセレクターは避けてください。これらは API ではなく、変更される可能性があります。これらを使用すると、プラグインが破損する可能性があります。
PatternFly 4 ガイドライン
プラグインを作成する場合は、PatternFly の使用に関する以下のガイドラインに従ってください。
- PatternFly4 コンポーネントおよび PatternFly CSS 変数を使用します。コア PatternFly コンポーネントは SDK から利用できます。Pattern Fly コンポーネントと変数を使用すると、将来のコンソールバージョンでプラグインが一貫しているように見えます。
- PatternFly のアクセシビリティーの基本 に従って、プラグインにアクセスできるようにします。
- Bootstrap や Tailwind などの他の CSS ライブラリーは使用しないでください。これらは、PatternFly と競合する可能性があり、コンソールのルックアンドフィールとは一致しません。
