ホーマーダッシュボード, 私たちのカスタムホームウェブサイト

注意してください、これは爆弾です… 今日は、この2021年の最高の発見の1つであるホーマーダッシュボードをここに持っています… それはただの軽量で静的なウェブサイトです… だがしかし… 何のためですか? 私たちが使用するWebサービスでカスタマイズされた美しいホームページを作成するには, 自宅や会社で, 準備をしてください、それは1000クールです…

まぁ, それは誰にでも起こることだと思います, 管理すべきサービスはますます増えています, アクセスするもの… そして長い間、アクセスを簡素化するソリューションが欠けていました, 整理整頓のより良い方法. ホーマーダッシュボードは重さのないウェブサイトです, 私たちがそれを持つことができること 2 インストール済み時間, それは非常に適応性があり、基本的なWebサービスを集約するサイトになると考えています. 私たちにとっても、会社にとっても、, これは, Webサイトをまとめるブラウザで起動する企業Webサイト, オールインワン.

それでもわからない場合, 投稿の最後に移動して、私の特定の例をご覧ください, またはGoogleに載せる “ホーマーダッシュボード” そして「画像’ 例を見る, いいじゃん. そして私が言ったこと, 完全にカスタマイズ可能で簡単なウェブサイトです, YAML形式のファイルでは、簡単な方法で構成します. たとえば、Dockerコンテナにデプロイできます, または、私たちが転がっているNginxまたはApacheで, それはウェブサイトをダウンロードする以上のものではないので、それだけです. プロジェクトに関するすべての情報がありますここは. そしてここはあなたはそれが何であるかを見たい場合に備えて、オンラインデモを持っています. そして、あなたが望むなら, 他にも同様の解決策があります, 見ますダッシュマシン, 組織する, ヘイムダル又は隋とりわけ.

言ったようにインストールするには, コンテナを使用することも、すでにデプロイしたWebサーバー上で直接使用することもできます. この場合、例としてNginxを使用します, サービスがインストールされていない場合は、インストールします:

sudo apt install nginx unzip -y sudo systemctl enable nginx

そして何もない, Homer Dashboardをインストールするには、ダウンロードするだけです, 解凍, 正しい権限を設定し、ダッシュボードをカスタマイズするための設定ファイルを作成します.

wgetのhttps://github.com/bastienwirtz/homer/releases/latest/download/homer.zip sudo 解凍 homer.zip -d /usr/share/nginx/homer sudo chown www-data:www-data /usr/share/nginx/homer/ -R sudo cp /usr/share/nginx/homer/assets/config.yml.dist /usr/share/nginx/homer/assets/config.yml

Nginxで構成ファイルを作成して、サイトを公開できます, 例としてこれを残しておきます, または、デフォルトのサイト設定ファイルを Homer サイトへの正しいパスで変更します.

サーバー {
    聞く 81;
    聞く [::]:81;
    homer.mydomain.local server_name;

# インストールルートのルートへのパス /usr/share/nginx/homer/;

   access_log /var/log/nginx/homer.access;
   error_log /var/log/nginx/homer.error;
}

そして何もない, 構成が正しいことを確認します & Nginxを再起動して、行った変更をリロードします:

sudo nginx -t sudo systemctl reload nginx

そして何もない, 作成したサイトにブラウザでアクセスすると、最初のダッシュボードが表示されます, それで私たちは去ることができます、そして一瞬で私たち自身のものを持つことができます.

どう? /usr/share/nginx/homer/assets/config.yml設定ファイルの編集

そして、これと同じくらいクールなものを手に入れることができます! 私が言ったこと, です 100% カスタマイズ, ご覧のとおり、ヘッダーを削除しました, Googleに検索ボックスを入れてみた… また、同社のブラウザのホームページとしても残っていました, GPOによる, Internet Explorerへ, クロム, Firefoxの, 端…

以上です、カリストさん, ダークテーマもあります…

アイコンのリポジトリを残しておきます。それはあなたにとってより簡単になり、あなたが使用できる場合に備えて, カスタム画像と同様に, もちろんです:

それがあなたを助ける場合に備えて、私はあなたに私のHomerダッシュボードサイトの初期コードの一部を残します, それは本当にYamlであり、変更するのは簡単です, 勇気!

---
# ホームページの設定
# https を参照してください。://アイコンオプションのタイトル fontawesome.com/icons: "オープンサービスIT - サービスダッシュボード"
字幕: "ホーマー"
ロゴ: "logo_openservicesit.png"
ヘッダ: False フッター: false カラム: 4
テーマ: デフォルトの色:
  光:
    ハイライト-プライマリ: "#7D0458"
    ハイライト-セカンダリ: "#9E0770"
    ハイライト-ホバー: "#FFFFFFの"
    バックグラウンド: "#F5F5F5"
    カードの背景: "#FFFFFFの"
    テキスト: "白い"
    テキストヘッダー: "#FFFFFFの"
    テキストタイトル: "#303030"
    テキスト字幕: "#424242"
    カードシャドウ: RGBAの(0, 0, 0, 0.1)
    リンクホバー: "#363636"
    背景画像: "/画像/fondo.jpg"
  暗い:
    ハイライト-プライマリ: "#7D0458"
    ハイライト-セカンダリ: "#9E0770"
    ハイライト-ホバー: "#2B2B2Bの"
    バックグラウンド: "#131313"
    カードの背景: "#2B2B2Bの"
    テキスト: "#7D0458"
    テキストヘッダー: "#FFFFFFの"
    テキストタイトル: "#ファファファ"
    テキスト字幕: "#F5F5F5"
    カードシャドウ: RGBAの(0, 0, 0, 0.4)
    リンクホバー: "#FFDD57"
    背景画像: "/画像/fondo.jpg"
メッセージ:
  コンテンツ: '<フォームアクション="httpsの://google.com/search" メソッド="取得"><入力タイプ="テキスト" 名前="q" プレースホルダー="あなたはあなたが望むものを何でもグーグルすることができます" スタイル="幅: 100%" スペルチェック="偽" オートフォーカス="真" オンキーダウン="ハンドルキープレス(出来事)"/></形>'
links:
  - 名前: "オープンサービスIT"
    関連URL: "httpsの://www.openservices.eusをご覧ください。"
  - 名前: "ウェブメール"
    アイコン: "FAS FA封筒"
    関連URL: "httpsの://webmail.bujarra.com"
サービス:
  - 名前: "インフラ"
    アイコン: "FAS FA-クラウド"
    項目:
      - 名前: "VMware vCenterサーバー"
        ロゴ: "/画像/vmware.png"
        字幕: "仮想プラットフォーム管理"
        関連URL: "httpsの://OS-VCの-01.openservices.local/ui/ を開きます。"
        #ターゲット: "_空砲" # オプションの HTML タグ ターゲット属性
      - 名前: "強くする"
        ロゴ: "/画像/fortigate.png"
        字幕: "Fortigateへのアクセス"
        関連URL: "httpsの://192.168.1.1"
...

何もない、そしてあなたが私よりも少し多くの時間を費やすなら, きっとすごくカッコいいことができるんでしょうね. 私が言ったこと, 部門向けの最初のWebサイトについて考えてみてください, ITサイト…

いつものように喜び, あなたは自分自身を大事にしています, それが非常にうまくいき、ソーシャルネットワークを通じてこれらのことを動かす人々に感謝しますように, これは、このタイプのオープンソースソリューションを使用できるより多くの人々にリーチする唯一の方法です, 抱擁!