0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【個人開発/学生】ポートフォリオの描画内容を管理するヘッドレスCMSを作成しました。

Last updated at Posted at 2024-08-09

はじめに

Next.js + NestJS + Cloudflare R2 + Neon + Koyeb でポートフォリオの描画内容を管理するヘッドレスCMSを作成しました。

リポジトリ

作成した動機

・新しいバージョンのNestJSTypeORMを学びたかった。
インターンシップの業務内容に似たアプリケーションを開発したかった。
の2点です。

デモ画像

・選択画面

image.png
image.png

・既存のカードを一つ選択した画面 (update側)

image.png
image.png

・新しい作品を登録するカードを選択した画面 (create側)

image.png
image.png

・左上に存在するredeployボタンは、SSGで描画しているポートフォリオサイトをデプロイし直して、DBに存在している最新データを反映します。

技術構成図

portfolio-cms-tech-flow.png

改善点

データがどのように循環するか考えずに実装を始めてしまったため、やらなくて良いようなデータ変換をしてしまったように感じました。
このため、readされるデータ構造が決まっている場合は、そのデータ構造のままテーブルを作ってしまうのが良いと思いました。
また、入力値をBFFでテーブルに沿うように型を変えるのが綺麗に循環しそうだなと思いました。

さいごに

KoyebでもDBが使えるっぽかったので、neonを使わずにデプロイ・DBどちらもKoyebを使えば良かったな~と思いました。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?