Oracle JET WebコンポーネントをOracle Visual Builderにインポートする

イントロダクション

Oracle Visual Builderは、Webおよびモバイル・アプリケーションを作成するための開発ツールです。ページ上のコンポーネントをドラッグ・アンド・ドロップして、Oracle Visual BuilderでWebページを作成できます。

Oracle JavaScript Extension Toolkit (Oracle JET)コンポーネントおよびOracle JET WebコンポーネントをOracle Visual Builderにインポートできます。インポートするコンポーネントが「コンポーネント」パレットに表示されます。インポートするWebコンポーネントは、「コンポーネント」パレットの「カスタム」セクションに表示されます。次に、Webコンポーネントをアプリケーション内のページにドラッグ・アンド・ドロップできます。

目的

このチュートリアルでは、Oracle JET WebコンポーネントをOracle Visual Builderにインポートします。

前提条件

タスク1: Webコンポーネントのダウンロード

この学習パスで前のチュートリアルを完了している場合は、このタスクをスキップします。

「前提条件」セクションに示されているdemo-update-item.zipファイルをダウンロードし、ファイル・システムの任意の場所に保存します。

タスク2: Oracle Visual Builderへのアクセス

  1. Oracle Cloudアカウントにサインインします。
  2. アイデンティティ・ドメインおよびユーザー資格証明を入力します。「サインイン」をクリックします。

タスク3: Oracle Visual BuilderへのWebコンポーネントのインポート

  1. ビジュアル・アプリケーションのホーム・ページに移動し、Webコンポーネントを追加するWebアプリケーションを選択します。

  2. 「コンポーネント」パレットで、「カスタム」セクションを見つけます。

    コンポーネント・パレット

    図empty-custom-section.pngの説明

  3. 「Webコンポーネントのインポート」アイコンWebコンポーネント・アイコンをインポートするためのアイコンをクリックします。

  4. 「Webコンポーネントのインポート」ダイアログで、demo-update-item.zipファイルを「ファイルのアップロード」またはここにドラッグ・アンド・ドロップします。

  5. 「インポート」をクリックします。

    demo-update-item Webコンポーネントは、「コンポーネント」パレットの「カスタム」セクションに表示されます。

    インポートされたカスタム・コンポーネント

    図web-component-custom-section.pngの説明

    「カスタム」セクションにWebコンポーネントが表示されない場合は、Webブラウザをリフレッシュします。

    これで、WebコンポーネントをOracle Visual Builder内のアプリケーションのページ上の目的の場所にドラッグ・アンド・ドロップできるようになりました。

その他の学習リソース

docs.oracle.com/learnの他のラボを調べるか、Oracle Learning YouTubeチャネルでさらに無料の学習コンテンツにアクセスします。さらに、education.oracle.com/learning-explorerにアクセスしてOracle Learning Explorerにします。

製品ドキュメントは、Oracleヘルプ・センターを参照してください。