⚡ Next Prisma Data
Next.js React used with a Prisma database to display a simple data table
Note: to open web links in a new window use: ctrl+click on link
📄 Table of contents
📚 General info
Full-stack app with Next React frontend and Prisma as the backend
There is not a lot of styling - most aplied to the data entry form
📷 Screenshots
📶 Technologies
💾 Setup
Install dependencies using npm i
npm run dev
runs the Next app in the development mode. Open http://localhost:3000 to view it in the browser.
npx prisma studio
opens up a useful browser CLI for the Prisma database on http://localhost:5555/
🔧 Testing
💻 Code Examples
pages/index.ts
async function to fetch all data from the Prisma database
export async function getServerSideProps ( ) {
const movies = await prisma . movie . findMany ( ) ;
return {
props : {
data : movies ,
} ,
} ;
}
🆒 Features - Frontend
The Prisma CLI browser interface is quite cool
📋 Status, Testing & To-Do List
Status: Working
To-Do: Change use of item.id as key in React list of films as it is not best practise. Could be developed with styled cards etc. on frontend to display data
👏 Inspiration/General Tools
📁 License
✉️ Contact