Hugo、高速で柔軟な静的Webサイトビルダー

ヒューゴについて

次の記事では、Hugoについて見ていきます。 これはのXNUMXつです オープンソースの静的サイトジェネレーター 最も人気があり、これも完全に無料です。 その驚くべき速度と柔軟性を備えたこのジェネレーターは、ウェブサイトの構築を迅速かつ簡単にします。 についてです 発電機 ウェブサイト Goで記述された静的HTMLおよびCSS。 速度、使いやすさ、構成可能性が最適化されています。

Webサイトの作成は、HTMLやその他の言語の時間と知識を必要とするプロセスです。 このため、この静的サイトビルダーは、Webサイトをすばやく作成するのに非常に役立ちます。 私たちが話すとき、それは明確にされるべきです 静的ウェブサイトとは、データを処理しないサイトを意味します。 つまり、フォームを処理したり、ドキュメントを生成したりすることはできません。 これらのウェブサイトは通常、小さなプロジェクトや情報サイトのために作られています。

ヒューゴの一般的な特徴

  • 高速。 彼らのウェブサイトで述べられているように、これはその種の最速のツールです。 平均的なサイトはXNUMX秒未満で構築されます.
  • 堅牢なコンテンツ管理と柔軟性のルール。 Hugoはコンテンツストラテジストの夢です。 ヒューゴ 無制限のコンテンツタイプ、分類法、メニュー、API駆動の動的コンテンツなどをサポートします、すべてアドオンなし。
  • ショートコードは私たちに Markdown構文を使用する機能、優れた柔軟性を提供します。
  • 統合されたテンプレート。 この静的なWebサイトビルダーには、作業をすばやく作成するための一般的なパターンがあります。 Hugoには、SEO作業、コメント、分析、その他の機能をすばやく実行するための事前に作成されたテンプレートが付属しています。
  • カスタム出力。 私たちを許可します JSONやAMPなどの複数の形式でコンテンツを生成する、したがって、コンテンツの作成を容易にします。
  • 300以上のテーマが利用可能、実装が簡単でありながら、最も複雑なWebサイトでも作成できる堅牢なテーマシステムを提供します。 キャスト可能 トピックを見てください プロジェクトのウェブサイトで入手できます。

UbuntuにHugoをインストールする

Hugoは非常に人気のあるプログラムであり、これによりGnu / Linux、特にUbuntuへのインストールが簡単になります。 最初に利用可能なインストールオプションは、 にあるプリコンパイル済みパッケージ プロジェクトリリースページ。 .debパッケージをダウンロードするには、ターミナルを開いて(Ctrl + Alt + T)、次のコマンドを実行するだけです。

Hugoの.debファイルをダウンロードする

wget https://github.com/gohugoio/hugo/releases/download/v0.69.0/hugo_0.69.0_Linux-64bit.deb

ダウンロード後、 この他のコマンドを実行することでインストールできます 同じ端末で:

.debパッケージをインストールします

sudo dpkg -i hugo_0.69.0_Linux-64bit.deb

インストールが終了したら、作業を開始できます。

このプログラムをインストールする別の可能性はあなたを通してでしょう スナップパック。 インストールは、ターミナルを開いて(Ctrl + Alt + T)入力するのと同じくらい簡単です。

スナップパッケージのインストール

sudo snap install hugo

最初のステップ

Hugoはウェブサイトビルダーです。 したがって、最初に行う必要があるのは 次の形式を使用して新しいサイトを作成します:

hugo new site [nombre-del-sitio]

この例では、次のコマンドを使用して新しいサイトを作成しました。

Hugoでサイトを作成する

hugo new site sinforoso

これにより、という新しいフォルダが作成されます 巻き取り アドレス帳 ホーム ユーザー。 まず、このフォルダにアクセスし、そこから作業を開始します.

次に行うことは サイトに新しいテーマを追加する. 使用可能なすべてのテーマを追加する場合は、コマンドを使用できます:

git clone --depth 1 --recursive https://github.com/gohugoio/hugoThemes.git themes

これにより、すべてのHugoテーマがインストールされるため、時間がかかる場合があります。 どれが欲しいか試してみると役に立ちます。 私の場合、特定のトピックを選択したので、上記のコマンドの代わりに次を使用しました。

Hugoのテーマをダウンロードする

git clone https://github.com/matcornic/hugo-theme-learn.git themes/learn

トピックをに配置することが重要です carpeta テーマ、作業中のフォルダ内にあります。

テーマをインストールした後、 その特定のテーマを使用するようにHugoに指示します。 これを行うには、 作業フォルダーにあるconfig.tomファイルで定義します 次のスクリーンショットに示されているように。

テーマ設定

変更が加えられたら、保存して閉じます。 今私たちがしなければならないのは サイトに表示する新しいインデックスを作成する。 次のコマンドでこれを行います。

Hugoでのインデックスの作成

hugo new _index.md

ご覧のとおり、ファイルの拡張子はmdです。つまり、 Markdownを使用してコンテンツを追加できます。 このファイルは、内で検索および編集できます。 コンテンツフォルダ.

_index.mdファイルの内容

私たちもできる サイトを形作るための新しいカテゴリを作成する:

hugo new [categoría]/[archivo.md]

この時点で、 当社のウェブサイトを表示するには、次のコマンドを使用します。

ヒューゴサーブ

hugo serve

そして、次のスクリーンショットでわかるように、 当社のウェブサイトは、ブラウザからhttp:// localhost:1313で利用できます。.

WebブラウザのWebページ

要するに、Hugoは静的なWebサイトのみを作成するプログラムですが、特定の場合に非常に役立ちます。 あなたはあなたのプロジェクトについてのより多くの情報を得ることができます サイト または 公式ドキュメント.


コメントを残す

あなたのメールアドレスが公開されることはありません。 必須フィールドには付いています *

*

*

  1. データの責任者:MiguelÁngelGatón
  2. データの目的:SPAMの制御、コメント管理。
  3. 正当化:あなたの同意
  4. データの伝達:法的義務がある場合を除き、データが第三者に伝達されることはありません。
  5. データストレージ:Occentus Networks(EU)がホストするデータベース
  6. 権利:いつでも情報を制限、回復、削除できます。

  1.   アンソニー

    テーマをダウンロードするコマンドに小さなエラーがあります。 投稿では、コマンドが次のとおりであることを示しています。

    git クローン – 再帰 https://github.com/spf13/hugoThemes テーマ

    そのコマンドはエラーを出します。 公式ページでは、このプロセスを実行するには、次のように入力する必要があることを示しています。

    git clone-depth 1 –recursive https://github.com/gohugoio/hugoThemes.git テーマ

    そして、すべてのテーマがダウンロードされます。

    1.    ダミアン・アモエド

      修正しました。 警告をありがとう。