- 1. 参考書籍
- 2. 全体設計
- 1. SSGのみで構成したい
- 2. 画像データは専用サーバに移行
- 3. 既存記事データとMarkdownデータの棲み分け
- 4. 全体のフォルダ構成
- 3. 使用ライブラリの選定
- 1. 使用ライブラリ
- 1. フレームワーク
- 2. スタイリング
- 3. 開発環境
- 4. 記事ファイル変換
- 5. 記事コンテンツ
- 4. 全体のレイアウトを作成する
- 1. Next.jsプロジェクトの作成
- 2. ESLint、Prettierの設定
- 3. スタイリングの初期設定
- 1. Emotionのインストール
- 2. コンポーネントへのスタイル適用
- 3. グローバルスタイルの適用
- 4. テーマの適用
- 4. Storybookの導入
- 5. レイアウト実装
- 1. 全体のレイアウト
- 2. ヘッダー、フッター
- 3. タイトルエリア
- 4. サイドバー
- 5. Netlifyサーバへのデプロイ
- 6. おわりに
- ホーム
- 20231231_01_app_design
【Next.js】第一回 WordPressブログをNext.jsに移行する 〜全体設計、環境構築編〜
Next.jsReactJavaScriptWordPress関連フロントエンド関連SSGStorybookEmotionNode.jsp5.js
2023-12-31
Next.jsReactJavaScriptWordPress関連フロントエンド関連SSGStorybookEmotionNode.jsp5.js
2023-12-31
記事をSNSで共有する
著者の各種アカウント
フォローいただけると大変励みになります！
フォローいただけると大変励みになります！
関連記事
【mise】複数の開発ツールを管理するmiseの導入方法と使い方【チートシート付き】
2026-09-20
【Next.js】静的エクスポートしたブログに生成したRSSフィードを追加する
2026-09-13
【Remotion】AIと協業できるコードベースのMV制作環境をつくる
2026-09-12
【Remotion】Reactで動画制作！Remotionの基本的な使い方を学ぶ【サンプル付き】
2026-09-08
【Next.js】ブログのローカライズ対応を行ったので内容をまとめる【Elekibear Spark】
2026-08-23
【Node.js】Amazonアソシエイトリンクの取得をPA-APIからCreators APIに移行する
2026-07-20
【Astro × Three.js】エンジニア向けポートフォリオサイトを作る【Plasmo Portal】
2026-06-08
【Three.js】カスタムシェーダーでトゥーン+背面法アウトラインを実装する
2026-02-15