- 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で共有する
著者の各種アカウント
フォローいただけると大変励みになります！
フォローいただけると大変励みになります！
関連記事
【Three.js】カスタムシェーダーでトゥーン+背面法アウトラインを実装する
2026-02-15
【Three.js】Three.js入門 - シーン構築・モデル読み込み・ポストプロセスまで
2026-02-15
【Astro】Astroの使い方と複数UIフレームワーク(React、Vue、Svelte)を組み合わせるサンプル
2026-02-01
【Houdini21.0】3Dビル群っぽいブログヘッダー画像を作成する
2026-01-10
【VSCode】ドラッグ&ドロップで画像ファイルをリサイズ・保存する拡張機能を作る
2025-11-22
【ゲーム数学】第十回 p5.js(+α)で学ぶゲーム数学「複素数とフラクタル」
2025-11-02
【ゲーム数学】第九回 p5.jsで学ぶゲーム数学「フーリエ解析」
2024-05-12
【Node.js】廃止されたAmazonアソシエイト画像リンクをAmazon Product Advertising API経由で復活させる
2024-01-08