I have developed a todo list application using Next.js 13 in the app folder. I wrote the client and server-side code using Next.js. I can create, delete, and view todos using the Read, Create, and Delete functions. I didn't need to add an update feature. I used MongoDB to store the todos.
I deployed the application on Vercel at https://next-todolist-app.vercel.app/.
However, there is an issue. When I run the project locally, the create, delete, and read functions work fine. But when I deploy the project to Vercel, only the create and delete functions work.
When I enter text for a todo in the input field and click the create button, nothing appears on the screen. However, when I open the browser's dev tools and check the network tab, I can see that the create function is successfully executed and the todo is saved in the database. The same situation applies to the delete function, but I can't say the same for the read function.
The read function runs after every delete and create operation, but it always returns the same data without any errors. It continues to return the same data until I rebuild the project.
I am using the { cache: "no-store" } option provided by Next.js' fetch function specifically for the read operation, but it didn't help.
I have been trying to solve this issue for days, but I haven't found a solution.
Does anyone have an idea?
I want the read function to return the most recent data.
UPDATE: I added the line "export const revalidate = 0;" to the route.ts file where I wrote my listing service and the problem was solved.
Code: https://github.com/aliblackeye/next-todo-app/blob/master/app/api/todos/read/route.ts#LL1