マジセミドライブ

ウェビナー関連のニュースやITサービス&ツールの最新情報を随時配信します。

おすすめITセミナー資料

2022.11.08

【無料オープンソース】「 ダッシュボード 」ツールまとめ3選

【無料オープンソース】「 ダッシュボード 」ツールまとめ3選

【無料オープンソース】「 ダッシュボード 」ツールまとめ3選として、
以下の概要を紹介しています。

1⃣サンプルページからすぐに開発「Argon Dashboard Chakra」
2⃣React.js+Bootstrap5 UIライブラリ「Volt React Dashboard」
3⃣Vue3+Bootstrap5ダッシュボード「Vue Material Dashboard 2」

※「Domo:データ活用+データストーリー」に関するセミナー資料(28ページ)を無料で参照できます。

【無料オープンソース】「 ダッシュボード 」ツールまとめ3選

1⃣サンプルページからすぐに開発「Argon Dashboard Chakra」

【無料オープンソース】「 ダッシュボード 」ツールまとめ3選

概要

「Argon Dashboard Chakra」は「UIダッシュボード」です。

「Chakra UI」+「React」の管理テンプレートを使用して、膨大な数のコード化コンポーネントを組み合わせることで、使いやすいダッシュボードを開発できます。

特徴

■コード化コンポーネント
・70以上のフロントエンドコンポーネント :「ボタン」「入力」「ナビゲーションバー」「カード」など
・コンポーネント色変更 :JSSファイル+クラスで簡単に変更
・開発プロセスはシームレス
・開発時間短縮 :「プロトタイピング」「製品版」
・事前構築のデザインブロックが付属
・実際のWebサイトへの切り替えは非常に簡単

■サンプルページ
・事前に作成されたサンプルページを使用して開発をすぐに開始
・魅力的なレイアウト
・コンポーネントは適切な間隔で配置
・各種用途別のサンプルページ :「CRM管理者向け」「スマートホーム向け」「VR向け」「自動車向け」
→サンプルページ

オフィシャルサイト

→github.com →creativetimofficial/argon-dashboard-chakra

→demos.creative-tim.com →docs-argon-dashboard-chakra

2⃣React.js+Bootstrap5 UIライブラリ「Volt React Dashboard」

【無料オープンソース】「 ダッシュボード 」ツールまとめ3選

概要

「Volt React Dashboard」は「React.js」+「Bootstrap 5」に基づく「UIライブラリ」です。

「100を超えるUIコンポーネント」「プラグイン」「Reactコンポーネント」「ダッシュボードテンプレート」などを利用して、機能的なダッシュボードを作成できます。

特徴

■フロントエンドライブラリ「React.js」ベース
・Reactフック機能

■CSSフレームワーク「Bootstrap5」ベース
・「Bootstrap5」の最新バージョンを使用して構築
・プラグインを含むすべてに「Vanilla JavaScript」のみを使用
・jQueryへの依存関係の削除
・ユーティリティAPI

■「React.js」コンポーネント
・100以上のUIコンポーネント :「ボタン」「フォーム」「アラート」「モーダル」など
・プロデザイナーによるカスタムスタイルが設定済
・「React.jsコンポーネントエディタ」を使用してコードを記述

■データ駆動型
・データの大部分がオブジェクト配列としてコンポーネントに渡される
・「タスク」「メッセージ」「ユーザー通知」など
・UIインターフェースを任意バックエンドAPIに簡単に接続

■ダッシュボードテンプレート
・美しいサンプルページを利用可能
・必要なすべてのページを提供するように慎重に構築

オフィシャルサイト

→github.com →themesberg/volt-react-dashboard

→demo.themesberg.com →volt-react-dashboard

3⃣Vue3+Bootstrap5ダッシュボード「Vue Material Dashboard 2」

【無料オープンソース】「 ダッシュボード 」ツールまとめ3選

概要

「Vue Material Dashboard 2」は、「Vue3」+「Bootstrap5」に基づくダッシュボードです。

「使いやすく」「機能豊富」「カスタマイズ可能」なダッシュボードを作成できます。

特徴

■Googleマテリアルデザインにインスパイア
・美しいデザイン
・魅力的なWebサイト(Webアプリ)作成をサポート

■コード化コンポーネント
・70を超えるフロントエンドコンポーネント :「ボタン」「入力」「ナビゲーションタブ」「アラート」など
・コンポーネント色設定 :sassファイルを使用して簡単に変更
・事前に構築されたデザインブロックが付属
・シームレスな開発プロセス

オフィシャルサイト

→github.com →creativetimofficial/vue-material-dashboard-2

→demos.creative-tim.com →vue-material-dashboard-2 →dashboard

関連セミナー紹介『Domo:データ活用+データストーリー』

セミナータイトル

上からも下からもプレッシャー中間管理職の「悩み」をデータの視点で解決
〜タイムリーなデータ活用、円滑な状況共有を導く分かりやすいデータストーリーとは〜

開催日

2022/09/27(火)

セミナー資料

資料タイトル

中間管理職は会社の要!
– パフォーマンスを最大化して効率よく上下に挟まれよう! –

資料ページ数

28ページ

資料イメージ

【無料オープンソース】「 ダッシュボード 」ツールまとめ3選

資料アジェンダ

■The 中間管理職
・中間管理職とは
・中間管理職のこれから
・ますます重要、中間管理職!

■こんな悩みをお持ちではありませんか?
・解決するべき課題・悩み
・解決のポイント

■お悩み解決事例① 徹底したデータドリブン組織への変革に成功
・Use Case
・Before Domo
・With Domo

■お悩み解決事例② わかりやすい情報配信→自発的な業務改善
・現場がDomoを使ってみた結果、課題があがってきた
・毎日データを見る習慣がついた
・悪い数字を事前に調査し、朝のミーティングで報告出来る体制づくりが整った
・工場毎の工数削減&異常値がわかりやすい
・視覚的なグラフで指標を敏感に感じ取れ、取り組むべき内容の優先順位が明確になった

■Domoについて
・会社概要
・日本でも様々な業界で採用が広がるDomo
・自己紹介

■Domoができること
・Domoプラットフォーム全体像
・DomoはBIトレンドをワンストップで提供

■補足
・第三者機関によるDomoの評価
・もっとDomoのことを知りたい方は
・Domopalooza Japan 2022 アーカイブもご視聴下さい

「セミナー資料ダウンロード」はこちらから(無料)

【無料オープンソース】「 ダッシュボード 」ツールまとめ3選

最後に

今後も毎日のように、多くのIT関連セミナーが開催されます。
ご自分のビジネスを強化できるセミナーを見つけて、ぜひ参加してみてください!

→マジセミTOPページ

関連ページ

【用語紹介】わかりやすくまとめ「 BI 」(ビジネスインテリジェンス)

→マジセミドライブ →【用語紹介】わかりやすくまとめ「 BI 」(ビジネスインテリジェンス)

【無料オープンソース】「 BIツール 」まとめ5選

→マジセミドライブ →【無料オープンソース】「 BIツール 」まとめ5選


参考サイト
→datapad.io →「Best 10 Free Dashboard Tools in 2022 [In Depth Guide]」
→medevel.com →「21 Free Open-source React Dashboards and Control Panel Templates」
→dev.to →「Open-Source Dashboards – React, Vue3, Bootstrap 5, Tailwind」

おすすめの記事

【デジタル寺田の3分用語解説】自然言語でアプリ開発「 GitHub Spark 」とは?⚡

デジタル寺田の3分用語解説

2024.11.25

【デジタル寺田の3分用語解説】自然言語でアプリ開発「 GitHub Spark 」とは?⚡

「 GitHub Spark 」は、コードを書かずに自然言語でアプリを作成できるAIツールです。アイデアを言葉で伝えるだけで、AIが自動的にアプリを作成します。リアルタイム編集や自動デプロイに対応し、初心者でも簡単にアプリ開発を楽しめます。

【デジタル寺田の3分用語解説】「企業によるベンダー、SIerへの 訴訟 」とは?〜日本通運がアクセンチュアを提訴〜🏢

デジタル寺田の3分用語解説

2024.11.25

【デジタル寺田の3分用語解説】「企業によるベンダー、SIerへの 訴訟 」とは?〜日本通運がアクセンチュアを提訴〜🏢

企業がベンダー(SIer)に対する 訴訟 の背景や原因を解説します。日本通運とアクセンチュアの125億円訴訟に加え、他の大規模な紛争事例も紹介します。プロジェクト管理や要件定義の重要性を具体例で説明し、成功への鍵を探ります。

【デジタル寺田の3分用語解説】経済産業省「 ダイバーシティ・コンパス 」とは?🧭

デジタル寺田の3分用語解説

2024.11.25

【デジタル寺田の3分用語解説】経済産業省「 ダイバーシティ・コンパス 」とは?🧭

経済産業省の「 ダイバーシティ・コンパス 」は、多様性を活かし企業の持続的成長を目指すためのツールです。企業が「目指す姿」や「行動指針」を整理し、未来へのビジョンを描く支援をします。また、診断ツールを活用し、「経営者」「人事」「現場」の取り組み状況を可視化することで、新たなステップを模索できます。