ブログページをNext.js/Vercel＋microCMSで構成しました。

本ブログサイトの構築について

本ブログは未経験からフロントエンドエンジニアを目指している、自身のポートフォリオも兼ねています。
技術スタックに関しては下記の記事も参考にさせていただきました。
https://easy-life-tips.com/post/nrkgwkzjd

ブログサイト構築には下記の4つのサーバーが必要です。

①公開用フロントエンドサーバー

②管理者用フロントエンドサーバー

③バックエンドサーバー

④データベースサーバー

｜全体構成

＜技術スタック＞

マークアップ言語：HTML、CSS(Tailwind CSS）

プログラミング言語：TypeScript

JavaScriptライブラリ/フレームワーク：React/Next.js（ver.14/ App Router形式）

①公開用フロントサーバー（デプロイ環境）：Vercel

②管理者用フロントエンドサーバー：microCMS

③バックエンドサーバー：microCMS

④データベースサーバー：microCMS

TypeScriptやNext.js（App Router形式）など、最近のフロントエンドで必要と思われる？技術をかなり盛り込みました。
そのおかげで構築完了までになかなか苦労するはめになったのですが…
chatGPTで質問しまくって、未経験からでもなんとかここまでは実現することができました。

｜個人的に詰まったポイントなど

chatGPTを使っても苦労した点について記載していきます（まだ執筆中です。随時更新していきます）

・環境変数設定

・TypeScriptの型定義

・Next.js（App Router形式）

・cssの記述

｜今後導入したい内容

・SEO対策

・広告貼り付けてみる

・問い合わせフォーム的なやつ