Nextjs の App Route の Dynamic Routes を利用してブログのページを作る（後編）
前回まで、ブログの URL を決めるために Dynamic Routes を利用してページの URL を決めて、４つ目のパスを Slug として扱う形で作成しました。今回は、日付を利用してそのパスも確定するようにしていきます。
Next.js
Next.jsは、Reactベースのフレームワークで、Reactを使用してサーバーサイドレンダリングと静的サイト生成を可能にする機能を提供します。
Nextjs の App Route の Dynamic Routes を利用してブログのページを作る（中編）
前回、ブログの個別のページに関して、Dynamic Route で ID を利用して作成する手順を紹介しました。今回はもう１つ改善して、URL のパスに日付と Slug を利用して処理できるように進めていきます。
Nextjs の App Route の Dynamic Routes を利用してブログのページを作る（前編）
ブログの記事に関してそれぞれのページを用意したいと思います。前編では ID を利用して URL を作成する形で作っていきます。
ブログのデータ取得の分離
前回はブログのタイトルの取得を page.tsx ファイルで利用しましたが、ブログのデータを取得する部分に関して分けて再利用しやすく実装をしていきます。
Next.js の Fetch を利用してコンテンツ一覧を取得する
Next.js には fetch の機能を利用して、外部のデータを取得して処理をするための仕組みが含まれています。今回はこれを利用して、Blog のタイトルを取得したいと思います。
Content Hub ONE のサンプル作成 - Next.js
Content Hub ONE と連携するサンプルアプリケーションとして、Next.js を利用してデモを作成していきます。
コンポーネント開発用の Next.js プロジェクトの作成（後編）
前回は純粋な Next.js のプロジェクトに対して、XM Cloud で利用しているスタイルシートを適用した形で進めていきました。今回は Storybook をプロジェクトに追加します。
コンポーネント開発用の Next.js プロジェクトの作成（前編）
Headless SXA でコンポーネントを作成する前に、Next.js で動作するコンポーネントの開発ができるように、別の Next.js のプロジェクトを今回は作成します。
XM Cloud で管理している記事の RSS フィードを作成する（後編）
前回の記事までで、XM Cloud に対象となるアイテムのテンプレートを作成、サンプルのアイテムを GraphQL を利用して Json のデータで取得することができました。今回は後半で、RSS でデータが見れるようにしていきます。
XM Cloud で管理している記事の RSS フィードを作成する（前編）
今回は XM Cloud のコンテンツに関して、GraphQL から記事の一覧を取得して RSS フィードを作成する手順を紹介します。
Auth0 を追加した Next.js App Router のアプリを Vercel に展開する
前回作成をしたアプリはローカルで動作していました。今回はローカルではなく Vercel に展開してログインできるように進めていきます。
Next.js App Router のサイトに Auth0 の認証を追加する
今回は Next.js に対して Auth0 の認証を追加するチュートリアルを利用して、ログインができるところまで進めていきます。
Previous
NextShowing 1 to 12 of 80 results