共有は学びです!
このブログは、ソフトウェアエンジニアとしての学びや洞察、そして日常の出来事を記録し、共有するために作成しました。これは私の旅の中で蓄積した貴重な情報の宝庫です。
自分の考えを記録し整理することで、新しい概念や技術への理解が深まります。私の目標は、Web開発や関連技術に興味を持つ方々に有用なリソースを提供することです。
コメントやフィードバックをいただけると、とても嬉しいです🍻。
- 🪤 ホスティングは Vercel。
- 🧱 React 18+ と NextJS 14+ を使用して構築。
- 📊 Umami を使ってウェブサイトのトラッキング。
- 🎉 Typescript を採用し、Conventional Commits でコミット管理。
デモサイト:https://mengke.me
ここでは基本的な手順のみを記載します。初心者の方や、デプロイ中に問題が発生した場合は、メールでご連絡ください:me@mengke.me。
-
このリポジトリをクローンまたはフォークします。
-
依存関係をインストールするために、
npm install
またはyarn
を実行します。
-
ルートディレクトリにある
.env.example
ファイルを.env
にリネームし、値を修正します。 -
/data
ディレクトリ内の各ファイルの情報を更新します。これがブログのデータを含んでいます。
-
Vercelで
Postgres Database
を作成します。 -
以下のような文字列を取得できます:
postgres://default:xxxxx@xx-xx-xx-xxxx.us-xx-x.postgres.vercel-storage.com:xxx/verceldb
。これをDATABASE_URL
環境変数に追加します。 -
npx prisma db push
を実行してviews
テーブルを作成します。 -
各ブログ記事の閲覧数は自動的にこのデータベースに保存されます。