Menu Close

TECH

2020.03.31

小さな習慣・アウトプット駆動生活〜ブログメンタリングのふりかえり〜

2019/12月〜2020/2月の期間で@kakakakakkuさんのブログメンタリングを受けて、「ブログを毎週1記事必ず書く」という目標にチャレンジしました。結果としては、@kakakakakkuさんのサポートもあり3か月間毎週1記事以上書くことができ、目標を達成しました。 同じ期間でTableauの「DATA Saber認定制度」も同時並行で進めていたので、図らずとも「学んだことをブログに …

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

2019.11.16

Cloudflare AMP Real URLをブログに導入する

AMPページをGoogleドメインではなく、自ドメインで表示することができる「AMP Real URL」をこのブログにも導入しました。「AMP Real URL」に関する日本語のページがあまりなかったので、手順をまとめてみました。 ブログに適用したいと思うのは物好きしかいない、かつ、企業で導入するにはまだまだ早いということでしょうか。 まだまだ発展途上の仕組みだとは思いますが、個人のブログなの …

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.12.13

GitHub Pagesで複数の独自ドメインサイトを運用する

GitHub Pagesを利用する上で、公式ドキュメントやいろんな人のブログを読みつつ、自分で試行錯誤した結果を残しておきます。 目次 GitHub Pagesの始め方 個人的なおすすめ 参考 逆に

TECH

2018.11.03

QrunchとMediumに技術メモをクロス投稿する

もっと気軽にアウトプットできる技術ブログサービス「Qrunch(クランチ)」では、重複コンテンツの心配をせずにクロス投稿ができることを知りました。

TECH

2017.12.22

はてなダイアリーからはてなブログ経由で独自ドメインのブログに記事を移行しました

概要 今まで、はてなダイアリー(d.hatena.ne.jp.meganii)の記事は移行せずにそのまま残していました。しかし、Scrapboxのユーザー会に参加して過去コンテンツの重要性に気付き、今のブログに全て集約したいと考えました。 そこで、はてなブログを経由させて、独自ドメインのブログに記事を全て移行しました。 その結果、はてなダイアリーからはてなブログにブックマークを含めて簡単に移行 …

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最強説!!。 さっそくこのブログにも試し …

TECH

2017.01.08

静的サイトジェネレータ「Hugo」でシンプルブログサイトを構築する

今、自分でブログ・サイトを構築するとしたら、どんな選択肢があるでしょうか? さすがにHTMLを自分で手打ちするのは大変なので、なんらかのCMS(Content Management System コンテンツ管理システム)を利用することになりますが、そのCMSにもさまざまな種類があり、どれを選んだらよいのでしょうか? 私自身、CMSとしてはLokka(Ruby), WordPress(PHP), …

TECH

2016.09.08

Circle CIでテストを定期実行する

前回、HugoのData-driven contenを試した。 Hugoで人気記事を表示するためJSONを返すAPIサーバを作りData-driven Contentを試してみた - SIS Lab これによって、毎回hugo buildすることによって、人気記事を更新する仕組みができた。後は、Cicle CIを定期実行させる。これは、Circle CIのAPIを利用すれば実現できる。

TECH

2014.10.29

JekyllでPygmentsを使ってのシンタックスハイライト

シンタックスハイライトに、Pygmentsを使いたくなったので変更する。 1.pygmentsをインストールする。 pip install pygments 2. 以下のコマンドでcssを生成する。 pygmentize -a .highlight -S monokai -f html > css/monokai.css 3. Gemfileにpygme