logo

Gatsbyでブログを作成しました!

Metaverse

個人ブログをGatsbyとContentfulで作成した

どうも初めまして、へんじにあ@tim_daikです

この度、個人ブログをGatsbyで製作しました! イエーイ🎉🎉

記念すべき初めての投稿では、このブログについてと私の自己紹介について書こうと思います

またTwitterのエンジニア垢@hengineer_では積極的にフォロバしてますのでどうぞよろしく

自己紹介(肩書き寄り)

このブログの主役である私についていくつか紹介させていただきます

私は高専という5年制の学校に通っている学生です

2023年5月現在、電気情報工学科(通称E科)の3年生に在籍しています

普通の高校では大学の受験勉強に精を出している頃ですが、高専では受験のことをまだ意識せず自由に活動に励めるため、中学生にはオススメですよ~

とまあ、高専という変わった環境にいるため高専についての記事も軽~く書きたいですね

部活動はいくつか兼部をしていて、

  • 学生会
  • Web制作研究部
  • DCONプロジェクト
  • 鳥人間プロジェクト
  • ハンドボール部(2年の1月くらいに辞めた)
  • 情報研究部(2年の夏ハンドボールの本格化で幽霊部員化)

といった面構えです。私以外の人でもかなり兼部をしている人は多いです

学校関連の話題もしんどいので、趣味をお話しして自己紹介は〆ましょう

自己紹介(趣味)

聞こえよく言えば「多趣味」、悪く言えば「沢山手を出して没頭していない」といった感じですかね

趣味の例を挙げると、

  • サイクリング
  • 釣り、海でボーっとする
  • 散歩
  • キャッチボールガチ勢(自称)
  • 魚を捌く

といった感じで、体を動かす系がランクインしていますが、趣味はアウトドア・インドアのどちらかに特化しているという訳ではありません

  • コーディング
  • 読書(原田宗典のエッセイが好き)
  • 映画鑑賞
  • 雑談(ふとした疑問や〇ネタでもなんでも)

という感じで趣味と言っていいのかは分かりませんが、私はこれらを趣味と呼んでいます。 皆さんのおすすめしたい趣味等ございましたら気軽に@tim_daikのDMまでお越しやす

このブログの技術

このブログに使われている技術などをお話していきます

使われている技術は以下の表のとおり

Techdescription
Gatsbyフレームワーク。このブログの骨格ともいえる技術。Gatsbyに入門してみたいということで今回初めて触った
ContentfulHeadless CMS。MicroCMSを触ったことがあるが、Contentfulは初めて。日本語対応してほしい
NetlifyPass。GitHubと連携してデプロイできるサービスは便利だな。かなり使い勝手よさそう

ご覧の通りJAMStack構成にしております。実は以前にNext.js×MicroCMSという構成でJAMStackの構築をしたことがあるのですが、どちらが良かったかというと今のところはNext.js×MicroCMSの方が良かったかな~って感じです

理由としては両方とも取っつきやすかったということが挙げられます。というかこれしかないと思います

Next.jsで扱うREST APIのほうが何度も触っていて慣れていたし、MicroCMSは日本製のHeadless CMSで日本語のドキュメントもサンプルもたくさんあったので、実際に初めてJAMStackに挑戦したときはこの構成にしました

しかしNext.jsよりもSSGに特化したGatsbyを触ってみたかったし、MicroCMSは直接Markdownに対応しておらず、代わりにHeadless CMSとして1番シェアが多いContentfulを使ってみようということで、今回は構成を変更して再チャレンジしてみたという感じになります

結論として今回の構成はなかなか満足度が高いものでした

まず、Gatsbyについては当初こそGraphQLに苦手意識がありましたが、自身でスキーマを定義し、定義したもの以上を取得できないようにするのは非常にいいな~と思いました

また様々な機能を追加するときにプラグインで素早く実装できるのは非常に便利で、Gatsbyのコンセプト上、プラグインを利用することでウェブサイトを作ることに集中できて偉いな~とも思いました

最近はマークアップよりの作業が多い私ですので、これからGatsbyに触る機会が増えていく予感がします

Contentfulについてはこちらも最初こそ日本語対応していないため苦しめられましたが(英語学習として翻訳せずに使おうと決めていた為)、自由度はかなりあってむしろフリープランではMicroCMSより自由度高くないかってくらいです

Contentfulには外部アプリ連携があり、エディタの自由度を上げるために後々触ろうかなと思てます(MicroCMSにも同様に拡張フィールドというものがある)

それよりも本命のMarkdownエディタが標準であるのが嬉しかっただけでなく、画像もMarkdown上に埋め込めるため、ローカルでMarkdownファイルを管理する計画は諦めてしまいました

TODOでも残しておきますか~

  • 高専についての記事を書きましょう
  • Contentfulの外部アプリ連携をいじってみよう

最後に

実はすでにブログは経験しており、はてなブログを持っているのですが、せっかくだから自分で作って運用しようと思ったので今回製作に至りました

はてなブログの記事も途中からMarkdownで執筆しているのでぼちぼち移植してやろうと思います

後はSNSアカウントをぜひフォローしてください!ほぼフォロバ100でございます

特にGitHubは切実にフォローをお願い致します🙏🙏

(フォロワー🏆のランクを上げたいっ!!)

© 2024 Hengineer.tech