グローディアのサービス一覧はこちら
 

Gatsby.js

今週はWordCamp Tokyo2018がありますね。 去年はじめて参加したのですが、参加者の数も熱量もすごく、刺激的な体験でした。 今年もたくさんのノベリティをもらいまくって、会場でいろいろなことを学びたいと思います。

華麗なるGatsby.js

PWAについて調べている過程で知った、評判よろしい静的サイトジェネレーターGatsby.jsを試しました。
静的サイトを生成するだけでなく、PWAにも対応してくれます。
プラグインやテンプレートを利用し、マークダウンでの投稿、サイトマップ、ソーシャルシェアリンク、FBコメント、全文検索、RSS、SPA等などができます。

公式 https://www.gatsbyjs.org/tutorial/

ターミナルでコマンドラインツールインストール

プロジェクト作成 。new以下は何でもいいです。

CDでプロジェクトフォルダに移動して

するとビルドされるので、http://localhost:8000にアクセスします。

まっさらな状態のgatsbyです。以下tree。

で、これじゃ味気ないので、お手軽に他人様が作ったテンプレを利用したりプラグインで盛ったりすると良いです。WordPressをインポートする機能もあって、そのまま静的CMSとして運用できます。

静的サイトになれば高速化、セキュリティ向上も図れて、規模によってはWordPressの代わりに導入するのも良いのではないかと思います。

※記事の内容は保証はしておりません(執筆時期や実施環境により挙動が変わるものがある為)。
別途検証してご利用いただくことをおすすめいたします。

グローディアのサービス一覧はこちら