hugoを使ってこのブログを生成し直してみた
この所更新とかあまりしてませんでしたが、最近はちまちまとhugoという静的サイトジェネレーターを使ってこのgithub.ioを書き直したりしました。 表ページとか体裁が良くなったかなと思います。 実は今までサイトジェネレーターなるものは使ったことがなくて、一応はCSSもHTMLも理解は出来るので手でタグを打って記事を更新しておりました。 しかしながらちょっと何か書こうと思うとやっぱり途端にめんどくさくなって「もうええかな…」みたいになるという大きな欠点がありました。 記事だけなら良いんですがMainページやら分類ページも自分で編集しないといけないですしね… で、タグをあまり打たなくて更新できるといえば、真っ先に思い浮かぶのがWordpress等の動的なジェネレーターなわけですが、Githubのページだと当然ながらサーバが動かせないのでWordpressなどは要件から外れてしまうんですよね…
静的サイトジェネレータの生成時間比較 - 嵐の小舟より
エンジニア界隈ではどうもブログを作る目的で静的サイトジェネレータというものが使われている、 と聞いたため、せっかくなので使ってみることにしました。 調べていく過程でHugoのサイトに 「Hugoは速いよ！」という内容の動画を見つけたり、 速度が原因で Hugo に移行したブログ記事を見かけたりして、 実行時間の伸び方が気になったのでざっくり確認してみます。 対象としたジェネレータについて StaticGenのスター数が多いものから選びました。 2015/11月の時点では Jekyll, GitBook, Octopress, Hexo, Hugo, Pelican の順です。 測定環境 計算機 OS CPU Memory
Hugo とは／Hugo をインストールする
Hugo とはHugo (https://gohugo.io/)Hugo は Jekyll や Middleman と同様の静的サイトジェネレータです。 Markdown 形式などで記述したコンテンツから、HTML ファイルを作成してくれます。 Hugo は Google の Go 言語 で作成されており、他のサイトジェネレータに比べて 動作が非常に速い という特徴を持っています（それに比べて Jekyll は特に遅いですね ^^;）。 公式サイトでも動作の高速さをアピールしており、今後もその方針は変わらなさそうなので安心です。 また、インストールに関しても、他の（Ruby 製や Python 製の）サイトジェネレータは、さまざまな外部モジュールをインストールしなければいけないので時間がかかったりすることがありますが、Hugo であれば一瞬で終わります。 例えば、Windows の実行環境
HUGOによる静的ウェブサイト環境構築
📅 Jul 13, 2019 · 📝 Jun 23, 2020 · ☕ 10 min read · ✍️ Reeve 本ブログ初投稿の記事。 今回はこのサイト自体の環境構築の話をしたい。 この記事の内容 Markdownで書いた記事を簡単に投稿できるウェブサイトを(維持費無料で)構築できる はじめに ブログを書こうとする場合、WordPressを使うのが一般的だと思う。 今までもWordPressで作成したブログは持っていたが、更新が億劫になり、完全に放置している状況になってしまった。 さくらのレンタルサーバーを借りているため、安いとは言え運用にはお金がかかる。 正直放置しているのはもったいないと感じた。 久々にWordPressにログインして、プラグインなどの更新をしたところ、記事を作成するインターフェースが大きく変化してしまった。 ここで完全にやる気を失った… 私が感じている
まくまく Hugo/Go ノート
高速な静的サイトジェネレータ Hugo の使い方です。 Go 言語に関する記事はこちらへ分離しました。 はじめにHugo とは／Hugo をインストールするHugo で新規の Web サイトを作成する記事の作成Hugo で記事を作成するHugo でドラフトページを作成するHugo でドラフトページの一覧を簡単に確認できるようにするHugo のテーマを設定するHugo で独自のテーマを作成するHugo Themes（Hugo テーマの一覧サイト）hugo コマンドと設定ファイルhugo コマンドカレントディレクトリを気にせずに hugo コマンドを実行する (hugo server -s)ポート番号を指定して Hugo サーバーを起動する (hugo server -p)Hugo サーバーで記事生成のキャッシュを無効にする (hugo server --ignoreCache)複数の Hug
Hugoのテンプレート構文「template」「partial」「block」「define」のわかりやすい解説
Hugo のオリジナルテーマ作成を勝手に応援する企画、記念すべき第 1 弾はテンプレート構文の基本となる「template」「partial」「block」「define」の違いについてです。以下のバージョンで確認しています。 Hugo Static Site Generator v0.53/extended darwin/amd64 BuildDate: unknown Hugo のテンプレート構文 Hugo にはさまざまなテンプレート構文が用意されています。今回は、その中でも基本となる以下の 4 つについて、とくにつまずきやすい点を中心に解説します。記事の内容に対するご質問やご指摘等はコメント欄でお待ちしております。 template partial block define template template構文は、Hugo であらかじめ定義されている内部のテンプレートファイルを読み
[Hugo] 記事にシェア数を表示する - atuweb 開発ブログ
やりたいこと 記事にシェア数を表示したい。 当ブログのシェア数表示 なぜ ? Hugo は静的サイトジェネレーターです。 この「静的サイト」であることが大きなメリットであり、逆に言うと制限が大きくデメリットでもあります。 具体的には、Hugo で生成したサイトには通常「検索やお問い合わせフォーム」を設置できません。 同じように、「記事ごとのシェア数というデータ」は可変なもののため、取扱が難しいのです。 実装方針 JavaScript は使用しない 静的サイトに動的機能を実装する手段として、まず思い浮かぶのは JavaScript で頑張る方法です。 しかしながら「ブログ記事閲覧のたびにシェア数を取得する」ような実装ですと、「静的だから軽い」というメリットを潰してしまい、本末転倒です。 data から情報をロードする 調べてみると、Hugo では「data ディレクトリ以下のファイルにアクセ
![[Hugo] 記事にシェア数を表示する - atuweb 開発ブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/a307f248fa73a443acb2268d14a64076c8e6f956/height=288;version=1;width=512/https%3A%2F%2Fatuweb.info%2Fimages%2Feyecatches%2Fhugo_lg.png)
静的サイトジェネレータHugoを使ったサイト構築（Taxonomy編）
こんにちは、tamaoki (@t0shiya) です。 今回は、静的サイトジェネレータ Hugo の Taxonomy ついて。 Taxonomy （タクソノミー）とは、ざっくり言うとコンテンツをグルーピングする 分類 のことです。 Hugo ではデフォルトで tags と categories の２つの Taxonomy が定義されています。Taxonomy を使用すると Hugo は自動的に Taxonomy 自体のリスト(tags, categories, …)、各Taxonomy毎のキーのリスト、各Taxonomyに紐づくコンテンツのリストを生成します。 定義 Taxonomy 公式ドキュメントに記載されている俳優(Actor)というTaxonomyと出演作品（Content）の例をあげます。 Actor <- Taxonomy Bruce Willis <- Term The
HugoとNetlifyで、簡単に自分のブログを公開してみよう！｜株式会社しずおかオンライン
こんにちは。システムエンジニアの山下です。 今日は、プログラムを書かずに簡単に自分のブログサイトをネット上に公開してみよう！ということで、最近、巷で話題の静的サイトジェネレーターである「Hugo」と、webサイトをネット上に公開する「Netlify」を使用して、スピーディーに、簡単に、そして費用0で、ネット上にブログサイトを公開してみようと思います。 Hugoとは Go言語で作られている、静的サイトジェネレーターです。静的サイトジェネレーターとは、 HTMLやCSSで作られる静的ページを簡単に作ってしまうツールです。例えば、今回作ろうとしているブログのようなwebシステムを作るためには、大まかなに以下のような動的処理が必要になります。 ①ブログ記事を作成し、内容をデータベースに保存 ②保存されたページをデータベースから取得し画面に表示する しかしHugoのような静的サイトジェネレーターでは
Webサイトを静的サイトにしました : hugo による静的サイトの作成 (1/3) - プログラマーのメモ書き
個人事業主としての森ソフトのサイトは、さくらインターネットのレンタルサーバー上で Joomla! を使って動かしていました。 当初は、ブログ代わりの技術メモとしていろんなものを載せるために使っていました。ちなみに、Wordpressを選ばなかったのは、当時のさくらのレンサバのDBのバージョンがWordpressのサポート対象外だったためなのと、知り合いがJoomla!使っていたのが理由でした。 ちなみに、あれこれやってた時の記事がまだ残ってました (^^; 思い出にリンク張っときます。 でも、一昨年から技術メモの部分はブログとして、はてなブログに移行したので、そんなに大そうな頻度で更新することもなくなりました。 となってくると気になってくるのがサーバー代です（サイト分だけでなくバックアップサーバーも立ち上げているので２台の料金がかかっています）。 昨今、あれこれ見てると静的サイトホスティン
[Hugo] ブログを Hugo にしたらメリットしかなかった件 - atuweb 開発ブログ
当ブログは 静的サイトジェネレーターの Hugo で制作しております。 Hugo への乗り換えは私にとってメリットしかありませんでした。 そのメリットについてまとめます。 静的サイトジェネレーター Hugo とは The world’s fastest framework for building websites https://gohugo.io/ Hugo は、 「 Web サイトを構築する世界最速のフレームワーク」 であると謳っています。 すごいですね ! Hugo の特徴 その特徴を次のようにまとめます。 設定ファイルや記事をファイルで作成し コマンド操作で Web サイトを生成する 生成されるファイルは HTML ベースの静的ファイル 注目すべきは 静的ファイル を生成する、という点です。 これは プログラムによる動的な出力変動 がない、HTML や CSS などで構成されサイ
![[Hugo] ブログを Hugo にしたらメリットしかなかった件 - atuweb 開発ブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/e5abd9b7873ea5f76af268fec378f6e309c6adfb/height=288;version=1;width=512/https%3A%2F%2Formcat.net%2Fimages%2Feyecatches%2Fweb-dev.png)
ブログはWordpressは辞めて、全て静的サイトジェネレーターに移行したい
概要 簡単にブログを作ることができる静的サイトジェネレーターが沢山あるのに、使いづらいWordPressを使った案件が多いのと、静的サイトジェネレーターの魅力を紹介している記事が少ないかな？と思ったので、今回記事を書いてみました。 ちなみに、私のポートフォリオサイトはHUGOで実装していますが、無料で運用出来ています（正確には、HUGO + PostCSS + Netlify） かかっているお金はドメイン代のみです（独自ドメインじゃなければ、全て無料で利用可能） ポートフォリオサイト 2019/01に、認証を導入したいと思ったので、GatsbyJSにリプレースしました。 昔のHUGOのポートフォリオサイトは、GithubのRepositoryに移動させました。 なぜWordPressを辞めたいのか 表示速度が遅すぎる WordPressは、読み込み時に余計なファイルまで読み込むので、表示速
静的サイトジェネレータ「Hugo」でシンプルブログサイトを構築する - SIS Lab
今、自分でブログ・サイトを構築するとしたら、どんな選択肢があるでしょうか。 さすがにHTMLを自分で手打ちするのは大変です。 なんらかのCMS（Content Management System：コンテンツ管理システム）を利用することになりますが、そのCMSにもさまざまな種類があり、どれを選んだらよいのでしょうか。 私自身、CMSとしては Lokka (Ruby), WordPress (PHP), Jekyll (Ruby), Octopress (Ruby)、 Middleman (Ruby)と利用してきました。 どのCMSも一長一短ですが、Ruby, PHPなどの動的スクリプトで構成されるCMSは共通してビルドの遅さを感じます。 そこで、ビルドが高速という噂の Hugo (Golang)に移行したところ、快適でシンプルなブログサイトを構築できましたので、今回はその Hugo の紹介を
WordPress から Hugo に乗り換えました | rakuishi.com
2011 年 8 月 25 日から数えて 3 年と半年、このブログは WordPress で運営してきたのですが、この記事から Hugo という静的サイトジェネレータで運用します。 当初は WordPress も PHP も分からない微生物専攻の大学生だったのが、最近では WordPress テーマ／プラグイン作成をする仕事をしていて、時間の流れは不思議だと感じるこの頃。そして、WordPress のことが大まかに掴めたからこそ、他のブログツールを勉強したいなと思いました。 調べてみたらフロントエンドエンジニア界隈で、Go 言語で作られた Hugo という静的サイトジェネレータがなんか流行りっぽいので、それに移行しました。 Octopress から Hugo へ移行した | SOTA Jekyll が許されるのは小学生までだよね - MOL WordPress からの移行方法 まだ、公式に
Amazon S3 にサイトのホスティング先を移行した | rakuishi.com
このブログは静的サイトジェネレータ Hugo によって生成された静的ファイルをアップロードして作られています。今回、ホスティング先を Sakura Internet から Amazon S3 (Simple Storage Service) に変更しました。 この記事では、導入する際に行った Amazon S3 の静的サイト設定、Route53 によるドメイン管理についてメモします。 Amazon S3 https://aws.amazon.com/jp/s3/ クレジットカード番号の登録、電話番号認証を行って、アカウントを作成しました。[ストレージ & コンテンツ配信] → [S3] → [バケットの作成] からバケット名 rakuishi.com を作成しました。 ちなみに、アカウント作成直後では「反映まで最大 24 時間かかることがあります」と言われ、設定できませんでしたが、寝て起き
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
静的サイトジェネレータHugoを使ってブログを作ろう！！|静的サイトジェネレータHugoを使ってブログを作ろう！|Techpit
Hugoでサイトを作ってみて感じた良い点・悪い点 : nyagosu hanten
ブログをHugoに移行してみた
https://creative-tweet.net/blog/2015/10/usage-hugo-2.html
https://creative-tweet.net/blog/2015/10/usage-hugo-1.html
