Next.js Full Stack App Getting Internal Server Error When Deployed-CodePudding

I'm very new to next.js and have been struggling to get my full stack app deployed. I've tried Heroku, Vercel, Netlify, and Nextron and I get pretty much the same error: 500 internal server errror. If I change "getServerSideProps" to "getStaticProps" it works, but with no persistent data. It also works great in development mode and with "next build && next start".

The app has Add, update, delete functionality and uses Prisma and Sqlite. Here is a sample of the update feature:

Home page:

export async function getServerSideProps() {

const meals = await prisma.meal.findMany()

return {
    props: {
        data: meals
    },
    
}

}

Fetch Request:

async function handleSubmit(e) {
e.preventDefault()

onSubmit({
  id: Math.floor(Math.random() * 10000),
  title: meal.title,
  date: formData.date
  
});

const response = await fetch(`/api/update/${meal.id}`, {
  method: 'PUT',
  body: JSON.stringify(formData)
})

return await response.json()

}

Api Route:

export default async( req, res ) => {

const {
    query: {id}
} = req;

const data = JSON.parse(req.body)


const updateMeal = await prisma.meal.update({
    where: {
        id: parseInt(id)
    },
    
    data
})

res.json(updateMeal)

}

I've also tried using incremental static regeneration with getStaticProps but to no avail. Any advice would be much appreciated!

CodePudding user response：

I think that you forgot to create a database that your API route will fetch data from because the code that you've shared is good.

CodePudding user response：

I don't think it is possible to use SQLite with Next.js API routes since SQLite relies on a persistent filesystem and API routes are ephemeral by nature.

Your code looks good so I would try using a different database provider. You can get free Postgres and MySQL instances on Railway.

This guide from Vercel is very comprehensive as well.