microCMS

GatsbyJS,Remix,NuxtJSなどフレームワーク大集合!「ジャムジャム!!Jamstack_7」イベントレポート

りゅーそう

こんにちは。野崎です。
5/26(木)に「ジャムジャム!!Jamstack_7」を開催いたしました。

今回も5名の方にLTをしていただきました。ありがとうございました。
なお、動画はアーカイブとして配信しているので興味のあるセッションはあわせてチェックしてみてください。



LTセッションの内容

藤澤伸(のびー)さん「Jamstackなコーポレートサイトリニューアルにあたっての全知識」



藤澤伸(のびー)さん(@fnobi)にJamstackなコーポレートサイトリニューアルの事例をお話しいただきました。
Jamstackの特徴である事前生成のメリットを活かして、画像の転送量を抑えたり、パフォーマンスを向上させているそうです。
他のアニメーションを制作されたフロントエンドエンジニアの方と連携する上で、JamstackでCMSのデータ部分と見た目を分けることで、フロントエンドエンジニアの方は見た目の部分に注力する環境ができたそうです。
分業のしやすさもJamstackのメリットだと言えそうですね。

またレンタルサーバーでのJamstack構成にして、リニューアルすべきところに注力したとのことです。
Jamstackのメリットとしてサーバーに依存しにくいというのがあります。必要な技術選定を行いリニューアルを行なったとても参考になる事例でした。

microCMSも活用されているこちらのサイトは、とても素敵なコーポレートサイトになっていますので、ぜひご覧になってみてください!
https://akiba.kayac.studio/

登壇中にいただいた質問にもイベント中にご回答いただきました。

Q.「​画像のダウンロードのところはGithub ActionsのCIの中で実行していると解釈してよろしいでしょうか。」

A.そうです!actions経由でnodeのスクリプトを実行して頑張ってもらっています。

Q.​nodejsが使えるレンタルサーバーはないと聞いたのですが、使用されたのは、VPSでしょうか

A.nodeの処理はCI(GithubActions)で実行するかたちなので、レンサバ上でnodejsが動く必要はないです。べんりですね。

のびーさんありがとうございました!

タイラーさん「Supabaseで爆速リアルタイムアプリ開発」


タイラーさん(@dshukertjrjp)にSupabaseについてデモを交えて解説していただきました!
Supabaseは「世界一早くPostgreSQLを立ち上げられるサービス」とのことです。
リアルタイムアプリを事例に制作方法などをご紹介いただきました。
様々なアプリ開発で活用できそうです......!!

ちなみにSupabaseのカタカナ表記は「スーパーベース」「スーパベース」などなどまだ検討中とのこと。
タイラーさんありがとうございました!

hanetsukiさん「2022年最新版GatsbyJS+TypeScript+microCMSでブログを作る。


hanetsukiさん(@hanetsuki_dev)にGatsbyの最新情報についてご紹介いただきました。
GatsbyJSもバージョンアップに従いTypeScriptで型をつける方法がアップデートされているとのことでした。最新の情報でわかりやすくmicroCMSを交えながら紹介いただきました。

GatsbyJSもサイト規模や制作期間に応じてユースケースが多そうだなという印象を受けました。

補足記事も書いていただいているので、こちらも合わせてご覧ください。
https://zenn.dev/rabbit/articles/9f98ec7c66ae54

質問にもイベント中にご回答いただきました

Q.Gatsbyなんですねー!Next.jsではない理由などありますか?

A.ページ数が比較的少ないケースや、文言をMarkdownなどで管理したいケースに採用することが多いと思ってます!
CMSの繋ぎ込みやSEO周りをpluginに頼ることができ、工数を大きく削減できるところが魅力的と感じてますー

hanetsukiさんありがとうございました!

Uejima Aijiさん「Remixの凄みを紹介したい」


Uejima Aijiさん(@aiji42_dev)にRemixについてご紹介していただきました。
RemixのNested Routingなど様々な機能や活用のポイントについて解説していただいています。Next.jsもLayoutに関するRFCを公開したことで話題となりましたが、それはRemixの実装の影響を受けているのでは?とのことでした。
Remixを学ぶことでNext.jsでの実装にも役立てられる部分が多そうだなという印象を受けました(逆も然りかもですね)。
質問回答ではまずは「Nested Routingを使って静的にレイアウトを組んでみる」などの入門の仕方も教えていただきましたので、ぜひLTを参考にRemixを学んでみると良いと思います。

Remixの全体感とNext.jsとの関係を知る上でとても参考になるLTでした。

Uejimaさんありがとうございました!

kawaさん「Nuxt3 + microCMS + Vuetifyでブログテンプレート作ってみた」

kawaさん(@kinomama_engine)にNuxt3とmicroCMSでの実装方法について解説していただきました。
いよいよ来月に安定板がリリースされるというNuxtJSのv3とmicroCMSのテンプレートを公開していただきました!
こちらがそのリポジトリになります。
https://github.com/kawa-work/nuxt3-microcms-blog

Nuxt3では

  • TypeScriptのサポート
  • apiルート

のような様々なアップデートがされているとのことです。kawaさん曰く、書き味もかなり良くなっているとのことでした。資料では、microCMSの良いところも紹介していただきました!

まだまだNuxt3の情報は少ない中で、とても参考になるLTでした!
kawaさんありがとうございました!

最後に

今回も5名の方にLTしていただきました。発表者の方、またYouTube Liveをご視聴いただいた皆様、ありがとうございました。

全体的にTypeScriptの需要がかなり高まっているという印象を受けました。Web制作における各フレームワークなどのTypeScriptサポートの動向にも注目したいですね!

次回のイベント開催は未定となっております。
開催される際はmicroCMS公式アカウントもしくはConnpassイベントグループでご案内させていただきます。

これからもどうぞよろしくお願い致します。

まずは、無料で試してみましょう。

APIベースの日本製ヘッドレスCMS「microCMS」を使えば、 ものの数分でAPIの作成ができます。

microCMSを無料で始める

microCMSについてお問い合わせ

初期費用無料・14日間の無料トライアル付き。ご不明な点はお気軽にお問い合わせください。

お問い合わせ

microCMS公式アカウント

microCMSは各公式アカウントで最新情報をお届けしています。
フォローよろしくお願いします。

  • X
  • Discord
  • github

ABOUT ME

りゅーそう
1994年生まれ。 前職は高校地理歴史科教員。2021/9〜microCMS入社。React/TypeScriptが好きです。