課題点
Webサイトのコンテンツをどのように管理するか、悩ましいところです。
WordPressで公開している場合は、Blogや固定ページ、テーマの管理など結構面倒な管理が必要になります。また、Blogデータを再利用しやすい形で保存することが望まれるので、それも課題です。
決定事項
プロジェクトの構成とワークフローに関する決定事項を以下にまとめます。
開発環境
- エディター: Visual Studio Code (VS Code)
- 拡張性が高く、Markdownの編集やGitの統合など、開発に必要な多くの機能を提供します。
- Markdownのプレビュー、Linting、スペルチェックなどをサポートする拡張機能が利用可能です。
コンテンツ管理
- バージョン管理システム: GitHub
- コードのバージョン管理、ドキュメントやコンテンツの共同編集、レビュー、管理に最適です。
- GitHub Actionsを通じたCI/CDパイプラインの構築が可能で、ウェブサイトの自動ビルドやデプロイが行えます。
コンテンツ作成
- 記法: Markdown
- シンプルで読みやすく、書きやすいフォーマットで、ウェブコンテンツの作成に適しています。
- 柔軟性が高く、さまざまなフォーマットへ容易に変換できます。
コンテンツの変換
- 変換ツール: Pandoc
- MarkdownからHTMLへの変換を行い、ウェブページとして公開するための基盤を作ります。
- 強力なドキュメント変換ツールで、幅広いフォーマット間の変換が可能です。
ウェブサイト構成
- 静的サイトジェネレータ: Next.js
- Reactベースのフレームワークで、SSG、SSR、CSRをサポートしています。
- 高性能でSEOに優れたウェブサイトを構築可能。開発者エクスペリエンスに優れ、ルーティング、画像最適化、国際化などの機能を提供します。
追加の検討事項
- ビルドとデプロイの自動化: GitHub Actionsを利用して、MarkdownからHTMLへの変換、Next.jsによるウェブサイトのビルド、そしてデプロイメントを自動化することが推奨されます。
- コンテンツとデザインの分離: コンテンツ（Markdownで書かれたテキスト）とデザイン（Next.jsでのスタイリングやレイアウト）の分離を意識することが重要です。
この構成は、現代的なウェブ開発のベストプラクティスに基づいており、効率的かつ柔軟なウェブサイト開発を可能にします。各ステージでの強力なツールの選択は、開発プロセスの最適化と高品質なウェブサイトの構築を促進します。
コメント