shape

個人網頁作品集 - 使用 Next.js 與 Prisma 以資料庫管理履歷

概述

打造無需修改程式碼即可更新履歷的個人作品集網站

技術棧

  • PostgreSQL

    PostgreSQL

  • Prisma

    Prisma

  • Cloudflare

    Cloudflare

  • Vercel

    Vercel

  • TypeScript

    TypeScript

  • React

    React

  • Tailwind CSS

    Tailwind CSS

團隊

1 人(個人專案)

期間

2025.08 ~ 2025.10

相關連結

網頁

詳細內容

  1. 概要
    • 這是我親自以 TypeScript 與 Next.js 打造的個人網頁作品集。
    • 將技術棧、活動、專案細節等所有內容以 PostgreSQL 管理並透過 Prisma 查詢,使我無需修改程式碼即可更新履歷。
    概要 1
  2. 專案詳情彈出視窗
    • 實作為:點擊專案卡片時透過 Intercepting Route 開啟彈出視窗,而直接開啟該網址時則以完整頁面呈現。
    專案詳情彈出視窗 1
  3. 使用技術
    • 以 TypeScript、Next.js、React 實作前端,並使用 Tailwind CSS 進行樣式設計。
    • 以 Prisma 與 PostgreSQL 管理內容,並以 Framer Motion 實作互動效果。
    • 圖片儲存於 Cloudflare R2,並部署於 Vercel。