TECH
2021.01.09
GitHub Actionsのスケジューラ実行を利用して定期的にビルドする
GitHub Actionsのスケジューラ実行で、Hugoなどのサイトを定期ビルドし、データを最新化する方法を調べたときのメモです。 目次 GitHub Actionsでスケジューラ実行 定期ビルド gh-pages.yml 参考
TECH
2020.12.26
Hugoでブログ記事一覧ページ（ブログアーカイブページ）を作成する
以前、ブログメンタリングを受講していたときの課題でもあった「アーカイブページ」を作った時のメモです。 ようやく、ブログ記事一覧の機能を実装できました。 https://www.meganii.com/blog/archives/ 目次 実装方法 layouts/_default/archive.html content/blog/archives/index.md 参考ページ
TECH
2020.11.01
HugoでTailwindCSSを利用しAMP Validなページを生成する
HugoでCSSフレームワーク「Tailwind CSS」を利用し、AMP Validなページを生成する方法についてのメモです。 ポイント HugoでPostCSSの仕組みを利用して、TailwindでCSSを組み立てる Tailwind CSS v1.4からpergeCSSを内包し、設定方法が変わった 目次 ポイント head.html postcss.config.js …
TECH
2020.03.13
npm-run-allでローカルAPI serverとHugo serverを同時に実行する
このブログではローカルでAPIサーバ（Express）を動かし、HugoのShortcodesから利用しています（2020/03/13現在）。 HugoでAMP対応のブログカードを作る - SIS Lab そのため、記事を書いてHugoのプレビューを利用する場合は、2つのターミナルで以下のコマンドを実行していましたが、ちょっとだけ面倒です。 API Server: npx ts-node …
TECH
2020.02.02
HugoでAMP対応のブログカードを作る
「Hugoでもブログカードを利用したい」 そう考えているところに以下の記事がTwitterのTLで流れてきたので、試してみました。 Hugoでブログカードに対応する | Hugo 入門 / 解説 | nasust dev blog
TECH
2019.12.03
Homebrewで過去バージョンのパッケージをインストールする方法
Homebrewで入れたHugoを、「brew upgrade hugo」でv0.60.1にアップグレードしたところ、まともにビルドできなくなってしまった。これでは困ると思い、前のバージョンをインストールしようと思ったがやり方が分からなかったので、調べてみました。
TECH
2019.10.11
AMPページの最適化〜ぼくのAMPサイトがこんなに遅い訳がない〜
このサイトもAMP対応したのだから、LighthouseやPageSpeed Insightsのスコアもきっと高いはずと計測してみたところ、全然スコアが出ていなかったので改善しました。その時のメモを残しておきます。 目次 TL;DR 計測 セルフホストしたAMP Pagesを最適化する 1. 最初のタグはmeta charest tagで始め、その後残りのmeta tagを記述する 2. …
TECH
2019.10.06
AMP向けのミニマルCSSフレームワーク「1BX」をHugoに導入した
ミニマルCSSフレームワーク「A Responsive CSS Grid for AMP | 1BX」を試してみました。 目次 TL;DR AMP用のCSSフレームワークに求められること 1BXとは ハマった点 解決方法 参考 TL;DR Hugoで作成するようなブログにおいては1BXで十分構成可能 サイズが小さくても、グリッドレイアウトを利用可能 2文字クラス名を多用して …
TECH
2018.07.11
Hugoのテーマでsubmoduleを使う方法
HugoのThemeプロジェクトをgit submoduleで扱う方法について調べました。
TECH
2017.12.22
はてなダイアリーからはてなブログ経由で独自ドメインのブログに記事を移行しました
概要 今まで、はてなダイアリー(d.hatena.ne.jp/meganii)の記事は移行せずにそのまま残していました。 しかし、Scrapboxのユーザー会に参加して過去コンテンツの重要性に気付き、今のブログに全て集約したいと考えました。 そこで、はてなブログを経由させて、独自ドメインのブログに記事を全て移行しました。 その結果、はてなダイアリーからはてなブログにブックマークを含めて簡単に移 …
TECH
2017.10.14
HugoでのシンタックスハイライトにPython Pygmentsが不要となった
Hugo 0.28からPython Pygmentsに頼らず、Goの機能でシンタックスハイライトが可能になりました。これにより、シンタックスハイライトを行なっているコンテンツがあったとしても、キャッシュなしで高速なビルドができるようになっています。 Hugo | Hugo 0.28: High-speed Syntax Highlighting!
TECH
2017.10.07
HugoのRelated Contentを利用して関連記事を表示する
Hugo | Hugo 0.27: Fast and Flexible Related Content! Hugo | Related Content いつのまにかHugo 0.29から関連コンテンツ表示機能が追加されています。これによって他のCMSではプラグインで簡単にできていたのに、Hugoではできないというポイントが解消されました。もはや、Hugo最強説！！。 さっそくこのブログにも試し …