はじめに
- 本記事では、個人向けポータルサイト作成を題材に UiPath Apps の使い方を紹介します。
- 記事の内容は、個人の見解または確認結果であり、UiPath の公式見解ではありません。
- 製品仕様や参考画像は 23.4 バージョンで構成しています。
個人向けポータルサイトをお題に UiPath Apps を触ってみる
そもそもポータルサイトとは
企業様においては、各種ツールやサイトのリンクなどを纏めた社内ポータルをどこもお持ちではないかとおもいます。
そういったポータルも UiPath Apps を使えば大変手軽に作れちゃいます！！
UiPath Apps を使うメリット
- ローコードなため開発効率がよい（プログラミング未経験者でもリッチなサイトがつくれちゃう）
- サイトの作成・編集・デプロイ・破棄等もエンドユーザーがおこなえる（閲覧のみ、編集可等のアクセス制御可能）
- Enterprise ライセンスで、パブリック公開設定すればエンドユーザーがブラウザを介して利用できる（Automation Cloud 上にアカウントは必要です）
作り方、使い方
UiPath Apps にアクセスしてアプリを新規作成します。
お好きなテンプレートを選びましょう
白紙でよかったんですが、せっかくなので「List and details」ってのを選んでみました
まずはサイトのタイトルを変えてみます（サイドバーのラベルを選択して、Text の値を変えるだけ）
今度はボディの不要なコンポーネントを削除し、試しにコンテナーを2つ配置。その中に「IFrame」コンポーネントを追加し表示したいサイトのURLを設定してみます。
サイトのURLはプロパティの Source の値を指定するだけ
「プレビュー」ボタンを押下し、デプロイされたサイトをみるとほらこんな感じ↓↓(´ω｀)
Marketplace の新着画面やナレッジベースを縦に並べればこんなんに↓↓（複数のサイトを埋め込んでもサイトの読み込みは瞬時に近い速さです！）
コンテンツ毎にページを分けたいので「タブ」コンポーネントを追加
ページもスクロールできるくらい高さを編集しておきます（ここを編集しておかないと画面表示以上にページ内コンテンツを持てません）
タブ内のページにさっきの内容を設定してみる↓↓（どうでしょう ええやん (´ω｀)）
次は Youtube のピックアップ動画を載せてみよう
あれれっ！？
www.youtube.com に接続拒否された。。。
サイトに依っては IFrame からの呼び出すための埋め込み用URLをつくる（確認する） 必要があります。
例えば、youtube の場合、普段「共有」する際のURLは『 https://youtu.be/{動画のID} 』ですが、埋め込み用は『 https://www.youtube.com/embed/{動画のID} 』になります。
Source の値を修正すればほら↓↓(∩´∀｀)∩
さて、あとはリンクの貼り方ですが、やり方はいろいろあるものの、とにかく簡単です！
ラベルやアイコンなどは配置した後、プロパティのイベントタブ＞「ルールを編集」から「Open Url（URLを開く）」でURLの値を設定するだけ！
なお、ラベルの値に Aタグの href を設定することでも実現できました！
いかがでしたでしょうか？(*´Д｀) 明日触ってみようっておもう人が一人でもいらっしゃれば幸いです。
以下に、UiPath Apps を触る中で参考にした良記事を記載しますので、関心を持たれた方は是非是非アクセスしてみてください
関連記事