Gatsby触ってみる【スタイリング編】の続きからGatsbyチュートリアル進めていきます。
3. Creating Nested Layout Components(ネストされたレイアウトコンポーネントの作成)
今回はプラグインの使い方と,レイアウトコンポーネントのチュートリアルをやっていきます。
プラグインの使用
使いたいプラグインをGatsbyプラグインライブラリで検索します。
プラグイン毎の使い方はGatsbyプラグインライブラリに載っているので書いてある手順にのっとってプラグインの設定をしていきます。
npmパッケージをインストール → gatsby-config.jsのpluginsの項目に設定を追加する
というのが全プラグイン共通の手順となります。
レイアウトコンポーネントの作成
Reactの基礎がわかっていれば特段覚えることはなさそう。
レイアウト用のコンポーネントを作成して,各ページでインポートしてラップするだけ。
感想
プラグインの豊富さはやっぱりコミュニティの大きさに比例しますね。
レイアウトコンポーネントもReactの勉強しているからかVuePressやり始めた当初より格段に理解できている。
VueよりReactのほうが理解してしまえば応用効く気がしますね。
VuePressから乗り換え待ったなしです。