Hugo v0.62.0 クリスマスエディションが今年もリリースされました。 Hugo v0.62.0 release notes 今回の目玉機能 Markdown Render Hooks の使い方を解説します。 Hooks は Markdown parser に Goldmark を利用している時に利用可能で、最新の Hugo はデフォルト Markdown parser が Goldmark です。 Markdown Render Hooks - Configure Markup | Hugo Markdown Render Hooks はリンクや画像に対してある属性を付けたい、など共通の処理を施したい時に重宝します。ショートコードを作らなければならない場面がぐっと減るでしょう。ショートコードではなく、普通のマークダウンを維持できるので、エディターや Headless CMS のプレ

Docker Hub から GitHub Packages へ Git tag やブランチをトリガーに Docker image を自動でビルドして Docker registry で公開・配布したいとなると、まず Docker Hub の利用が候補として考えられます。 あれだけの機能を無料で提供してくれている Docker Hub 開発チームには本当に感謝しているのですが、一点だけ不満があります。実行時間です。Docker Hub はビルドの開始が遅く、実行時間も結構かかりがちです。 これの解決策として外部サービスで Docker image をビルドして、そこから Registry に image を Push することが考えられます。外部サービスには色々な選択肢がありますが、今回は GitHub Actions を選びました。ビルド行程を GitHub Actions で行えば Do

GitHub Actions で lighthouse を実行して結果をダウンロードする方法です。 GoogleChrome/lighthouse | GitHub Workflow の例 以下のワークフローは、週1回 https://<target>.com に対してテストを実行し、結果を artifact としてダウンロードする、という利用ケースです。 name: lighthouse on: schedule: - cron: '23 23 * * 0' jobs: test: runs-on: ubuntu-18.04 steps: - uses: actions/checkout@v2 - name: Install lighthouse run: sudo npm i -g lighthouse - name: Run lighthouse run: | lighthouse

Gatsby.js で構築しているブログ・サイトの GitHub Pages へのデプロイを GitHub Actions を利用して自動化する話です。 Gatsby のプロジェクトを用意 この記事では gatsbyjs/gatsby-starter-blog: Gatsby starter for creating a blog を例として用います。 GitHub Actions の設定 最新の情報は Action のリポジトリにて確認してください。 peaceiris/actions-gh-pages: GitHub Actions for deploying to GitHub Pages with Static Site Generators GitHub Actions による GitHub Pages への自動デプロイ - Qiita Workflow の追加 以下のワークフロ

React.js で作成したアプリケーション、とりわけ今回は Next.js で始めたプロジェクトを例に GitHub Actions を使って GitHub Pages へのデプロイを自動化する方法を紹介します。 Vue, Nuxt についての記事もあります。 Vue Nuxt アプリを GitHub Actions で GitHub Pages にデプロイ - Qiita Create Next App Documentation - Getting Started | Next.js 上記を参考に Next のプロジェクトを作成してください。この記事作成時の Next バージョンは 9.0.5 です。 GitHub Actions の設定 peaceiris/actions-gh-pages: GitHub Actions for deploying to GitHub Pages

Vue.js で作成したアプリケーション、とりわけ今回は Nuxt.js で始めたプロジェクトを例に GitHub Actions を使って GitHub Pages へのデプロイを自動化する方法を紹介します。 React, Next についての記事もあります。 React Next アプリを GitHub Actions で GitHub Pages にデプロイ - Qiita Create Nuxt App インストール - Nuxt.js 上記を参考に Nuxt のプロジェクトを作成してください。この記事作成時の Nuxt バージョンは 2.9.2 です。 .nojekyll の追加 _nuxt のパスを GitHub Pages で正常に取り扱うため GitHub Pages のブランチに .nojekyll ファイルを追加する必要があります。 npm run generate で

この記事について この記事は Hugo でブログを始めようとしている方へ向けた Hugo 入門記事となっており、Hugo による静的なブログの構築・運用方法 を簡単にですが紹介します。 Hugo の Awesome は以下をどうぞ。 Awesome Hugo - 有用なリンクまとめ - Qiita 動的サイトから静的サイトへ WordPress で構築する、というのが長らくブログ運用の主流でした。もちろん現在も多くのサイトが WordPress によって運用されていますが、最近では「 静的サイト 」という選択肢も広まってきています。(調査したわけではありませんがこの分野に関心がある人の中で実感している人は多いと思います。) 静的サイトとは HTML, CSS, JavaScript のみで構成 サーバーサイドの処理を PHP で書いたりする、というような必要はありません。私たちが気にしなけ

GitHub Actions の登場により GitHub Pages へのデプロイがとても簡単になりました。手順を書いた YAML ファイルを Push するだけでビルド・デプロイの CI/CD を構築できます。この記事では GitHub Actions を用いて GitHub Pages へのデプロイを自動化する方法を紹介します。 Hugo のブログ・サイトの場合 具体的には以下のような YAML ファイルをデフォルトブランチに .github/workflows/gh-pages.yml として Push するだけで GitHub Pages へのデプロイが始まり、サイトが公開されます。 name: GitHub Pages on: push: branches: - main # Set a branch name to trigger deployment pull_request

Hugo や Hugo extended が動作する Docker image の作成方法について知見をまとめます。 Hugo の Docker image 現在 Hugo 公式 (gohugoio) が提供する Docker image はありません。 Docker Hub に gohugoio のアカウントがありますが、あれは GoHugoIO が管理しているものではありません。 手っ取り早く Hugo の Docker image が欲しい方は私が管理しているものを良かったら使ってください。新しいリリースがあればその日のうちに更新するようにしています。 CircleCI や GitLab CI/CD で使いたい場合は以下のイメージをどうぞ。 peaceiris/hugo-extended-docker: Docker image of Hugo (Hugo extended and

Hugo v0.56 がリリース Hugo 0.56.0: Hugo Modules and Deployment | Hugo 今回のリリース Hugo v0.56 では Hugo Modules と Hugo deploy の二つの新機能が実装されました。この記事ではそれらの紹介をします。 homebrew-core の Hugo は既に v0.56 へ更新されています。Docker で試したい方は Docker image of Hugo extended version を使ってみてください。GitHub Actions で試したい方は GitHub Actions for Hugo extended をどうぞ。もちろん Release v0.56.0 - gohugoio/hugo からバイナリをダウンロードして実行もできます。 Hugo Modules Hugo Modules

docker images や docker image ls の出力をイメージサイズ順で並び替える方法です。 docker images --format "table {{.Size}}\t{{.Repository}}:{{.Tag}}\t{{.ID}}" | sed -e '1d' | sort -h -r 1.83GB codelibs/fess:13.2 eb10fdc61ad9 814MB golang:1.12.7-buster be63d15101cb 757MB golang:1.11.10 69a024a6ecf5 350MB golang:1.12.5-alpine c7330979841b 102MB ubuntu:18.04 d131e0fa2585 87MB python:3.7-alpine3.9 cd2b35632442 79.1MB python:3.6

github.com 以下には GitHub のリポジトリ、gitlab.com 以下には GitLab のリポジトリが配置されている状態です。 gitlab.com 以下にいる時だけ ~/.dotfiles/git/gitconfig.gitlab を読み込むようにして user.email を GitLab に登録した Email で上書きします。 [user] name = peaceiris email = 30958501+peaceiris@users.noreply.github.com [includeIf "gitdir:~/Documents/repos/gitlab.com/"] path = ~/.dotfiles/git/gitconfig.gitlab