JavaScriptとの連携
最終更新日:2023年11月13日
JavaScriptを用いてmicroCMSを扱う方法をご紹介します。
前提として、JavaScriptを用いる場合、基本的にはウェブアプリケーションフレームワークと組み合わせて利用することを推奨します。
理由としては、ルーティングやキャッシュの仕組みなどが組み込まれているため、開発者が考慮すべき観点を減らすことができるためです。
JavaScriptのフレームワークを利用したチューリアルについては、以下をご参照ください。
- Next.jsとの連携
- https://document.microcms.io/tutorial/next/next-top
- Nuxt 3との連携
- https://document.microcms.io/tutorial/nuxt3/nuxt3-top
- Gatsbyとの連携
- https://document.microcms.io/tutorial/gatsby/gatsby-top
- Astroとの連携
- https://document.microcms.io/tutorial/astro/astro-top
フレームワークを利用しない方法
シンプルな要件の組み込みの場合は、フレームワークを使用せずに利用することも可能です。
フレームワークを利用せず、JavaScriptでmicroCMSを利用する場合、ブラウザ(クライアント)から利用する方式を選択されることが多いです。
一方で、サーバーでJavaScriptを実行できるNode.jsを利用する方法もあります。
こちらのドキュメントでは、それぞれの方法を順番に紹介しています。
- Getting Started(ブラウザ)
- https://document.microcms.io/tutorial/javascript/javascript-getting-started
- Getting Started(サーバー)
- https://document.microcms.io/tutorial/javascript/nodejs-getting-started
SDK
microCMSのJavaScript SDKはnpmで配布されています。
- microcms-js-sdk
- https://www.npmjs.com/package/microcms-js-sdk
また、ソースコードはGitHubにてオープンソースとして管理されています。どなたでもIssueやPull Requestの作成が可能です。
- GitHub - microcmsio/microcms-js-sdk: microCMS JavaScript SDK.
- https://github.com/microcmsio/microcms-js-sdk