What is the best practice to fetch non-api data in Next.js(deploying through Vercel)

Question

I am trying to fetch my own data before rendering my application. Fortunately, Next.js provides getStaticProps() for fetching data.

I am currently using fs module to fetch my data from json file in local directory.

export async function getStaticProps() {
  const rawData = fs.readFileSync('./dataset/test.json');
  const data = modifyData(JSON.parse(rawData));
  return {
    props: {
      data
    }
  }
}

But the problem is, for securing my raw data, I didn't push them to the GitHub remote repository. Forgetting this, when I tried to deploy my app through vercel, it couldn't read any data from my GitHub repository as the repository does not contain any data to fetch from...

I don't want to push my raw data to GitHub.

I would like to know

the best practice to fetch raw data without pushing any of them to the remote repository

If there are some fundamentals of Next.js or any other I missed, please let me know and correct me.

muratgu · Accepted Answer · 2021-01-11 01:42:13Z

2

Being "serverless", you've got to host your data somewhere, in a database or as a file.

answered Jan 11, 2021 at 1:42

muratgu

7,3213 gold badges27 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

kyle ausk Over a year ago

Could you please elaborate it more? I read links you provided and googled some more. It seems like, if I want to use a file as a data, then I should upload it in serverless (such as AWS S3) and fetch it using api in Next.js. Is it right? Before I deep dive into each concepts, I will be happy if I roughly understand the whole process

Collectives™ on Stack Overflow

What is the best practice to fetch non-api data in Next.js(deploying through Vercel)

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related