マガジンのカバー画像

Tech Magazine

15
プラスジャムの開発者が、いろんな技術やツールを試してみた成果を綴るマガジンです。誰かのお役に立てば幸いです。
運営しているクリエイター

#nextjs

Draft Modeを活用した画面プレビューの作成

こんにちは、エンジニアのカネコです。 本日は、Next.js(App Router)の新機能、Draft Modeを使って、microCMSのドラフトコンテンツを動的にプレビューする方法についてご紹介します。 この機能を活用することで、開発中のコンテンツをリアルタイムで確認しながら、公開後は高速に静的ページを提供することが可能になります。 この記事では、具体的な実装手順から、実際に開発する際の注意点まで詳しく解説します。 このシーケンス図は、Next.jsのDraft Mo

【 Vercel x Next.js 】Basic認証のススメ

はじめにはじめまして、フロントエンドエンジニアのカネコです。 今回は、VercelとNext.jsを用いたウェブアプリケーションにBasic認証を追加する方法について説明します。この設定は開発、プレビュー、そして本番環境を切り替えることで、環境ごとに異なる認証要件を柔軟に適用できます。 環境変数の設定Vercelでの環境変数の設定は、プロジェクトの Settings > Environment Variables で行います。 BASIC_IDとBASIC_PWDという名