Gatsby製サイトをNetlifyにデプロイする前に見ておきたい設定2つ（ビルドと表示）
Gatsby製サイトをNetlifyにデプロイする前に見ておきたい設定2つ（ビルドと表示）2020-08-03 12:00 Netlify にはビルド時のキャッシュと HTTP のキャッシュをユーザー側で設定できる口があります。 このキャッシュの設定をすることで、ビルドや表示が早くなり良いこと尽くしなのでこれを気に見ていきましょう。 ビルド高速化 Netlify ではビルドを回すとソースコードを見て 0 からビルドします。 そのためキャッシュが使える手元でのビルドに比べて時間がかかります。 特に gatsby-image は致命的で、画像から圧縮・Traced SVG の作成・サムネイル化・各種デバイス向けの最適な画像出力を行うため、画像が絡むサイトのビルド時間はとても長くなります。 このブログもそういった画像をつかったブログですが、現在 20 記事あるサイトでのビルドで約 10 分かかっ
Gatsbyプラグイン45選 - Qiita
なにこれ React.js製の静的サイトジェネレーター Gatsbyは、プラグインを使って簡単に機能拡張できる仕組みを持っています。公式プラグインとコミュニティ提供のものをあわせると、なんと502個もあるそうです。今回はその中でも、おすすめ45個をユースケース別にご紹介します。 ※ 本記事はブログの転記です。Qiitaで使えない機能（コードブロックの指定行強調表示など）の表示結果はスクリーンキャプチャにしています。HTMLでの表示結果を見たい場合はブログをご覧ください。 ユースケース別目次 ※クリックすると説明セクションにとべます。 マークダウン系 コードブロックでシンタックスハイライトする コードブロックにタイトルを追加する 見出しにGitHub風ホバーリンクをつける 絵文字を使う Graphvizでグラフを描画する 数式を使う コードブロックにJavaSriptファイルなどを埋め込む
Reactベース静的サイトジェネレータGatsbyの真の力をお見せします - Qiita
NTTテクノクロスの上原です。 業務では、社内情報のReact製自前キュレーションサイトの構築を担当しています。 この記事はNTTテクノクロスAdvent Calendar24日目の記事であり、社内の勉強会で発表した内容をQiita記事として書きなおしたものです。タイトルは釣りです。 (2018/12/28追記あり) 導入 記事を書いた理由 Gatsby.js(以降、Gatsbyと表記)はさまざまな高速化テクニックを用いた「爆速サイト生成」で有名なツールですが、そのリッチな機能性は、たとえばイントラ内サイト、業務システム開発、ツール開発などでも十分に活用できるものだと思い、その可能性を紹介するために書きました。 「静的サイトジェネレータ」って何？ いわゆる「静的サイトジェネレータ(Static Site Generator, SSG)」は、CMS(コンテンツ管理システム)の一種です。代表的
Gatsby v2とNetlifyで運用コストゼロのサービスサイトを作る。ハマった部分とメリットの解説。 - Qiita
Gatsby v2とNetlifyで運用コストゼロのサービスサイトを作る。ハマった部分とメリットの解説。JavaScriptReactNetlifygatsby はじめに はじめてのQiita投稿です。 現在、現役プログラマーとプログラミング学習者を直接つなげるマーケットプレイスCodeGritを開発しています。こちらのサービスで、事前登録、メンター募集を開始するにあたりティーザーサイトを構築しました。 構築したサイト: CodeGrit タイトルの通り、Gatsbyを利用したのですがGatsby.jsが現在Version1から2への移行期にあたり、一部混乱のある部分もあったのでこの記事ではハマりそうな部分と、Gatsby.jsとNetlifyを利用するメリットを解説します。 Gatsby.jsとは? Gatsby.jsは、React製のスタティックサイトジェネレーターです。Gatsbyの
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
