筋肉チョットデキル

GatsbyThemes

3件の投稿があります

ブログを作りながらGatsbyのテーマを理解する!

2020年05月29日
29 min read
GatsbyGatsbyStartersGatsbyThemes

今回、Gatsby のテーマを使ってブログを作ってみようと思います。 最後まで読めば、自分のブログを得ることができ、拡張していく理解も得られていると思います!! おそらく30分~1時間後ぐらいには以下のようなサイトを手に入れていると思います💪 👍 Demo 👍 ソースコード(GitHub) テーマを探す テーマを探すには、以下のサイトがおすすめです! 今回は、 gatsby-theme-novela という テーマ を使ってみようと思います。 First Step こちらでも書いたように、Gatsby の テーマはプラグインの一種 です。 既にある Gatsby サイトにテーマを導入することも可能ですが、 今回は 1 から Gatsby サイトを作っていきましょう。 gatsby-theme-novela…

Read more

Gatsbyテーマをカスタマイズする

2020年05月22日
4 min read

Gatsby サイトにテーマを使って機能を追加することはよくあります。 ただテーマはスターターとは違い、実装のコードはアプリ内にはなく npm でインストールします。 それではどのようにカスタマイズするのでしょうか? テーマをカスタマイズする最も簡単な方法は、 テーマが提供しているオプションを指定することです。 たとえば gatsby-theme-blog というテーマでは、以下のようなオプションを指定できます。 Key Default value Description basePath / ブログ記事のルート URL を指定できる contentPath content/posts ブログ記事ファイルを置くパスを指定 assetPath content/assets アセットファイルを置くパスを指定 mdxOtherwiseConfigured false 既に gatsby-plugin-mdx がサイトで導入されていれば、 true を指定する disableThemeUiStyling false gatsby-plugin-theme-ui…

Gatsbyのテーマとは?

2020年05月18日
2 min read

概要 Gatsby テーマは プラグイン の一種です。 プラグインとは違って自身で gatsby-config.js ファイルをもっており、複数のパッケージをインストールして管理できる Gatsby サイトになります。 この点は<と同じようですが、テーマはプラグインの一種です。 スターター と同じようですが、テーマはプラグインの一種です。 複数のテーマを同時に利用することができますし、テーマの更新や変更の影響を受けることができます。 テーマとスターターの違い テーマを理解するために、どんなときにテーマを作成するのか考えます。 Gatsby サイトを構築する際、様々な設定をする必要があります。 たとえばどこにデータを置くのか? どのようにアクセスするのか? どのように表示するのか? などなど。 それらをテーマとしてパッケージ化することで、第三者や自分自身が再利用することができます。 似たものに スターター があります。 スターターは Gatsby サイトを素早く作成する方法の 1 つで、あらかじめ特定の目的のために設定された Gatsby…

Made with Gatsby& ChakraUi

Yuuki Okamoto • 2020