Using googleapis to write to spreadsheet with nextjs not working as expected

Question

I am new to nextjs and have some trouble getting googleapis working with nextjs. I am trying to write to an external google spreadsheet emails from my tiny webapp, which tries to use spreadsheet as a DB following this tutorial https://andreaskeller.name/blog/nextjs-google-sheets-cms.

I am running

"next": "10.0.7",
"react": "17.0.1",

I have installed

"googleapis": "^80.1.0"

Which itself produced this error:

error - ./node_modules/google-auth-library/build/src/auth/googleauth.js:17:0
Module not found: Can't resolve 'child_process'
null

Then I found out I should add some nextjs configuration to next.config.js (Module not found: Can't resolve 'child_process' - google-spreadsheet) So I added this to next.config.js

  webpack: config => {
config.node = {
  fs: 'empty',
  child_process: 'empty',
  net: 'empty',
  dns: 'empty',
  tls: 'empty',
};
return config;}

This itself produced this error

error - ./node_modules/googleapis-common/build/src/http2.js:16:0
Module not found: Can't resolve 'http2'
null

So I thought, alright, it is quite weird already, so I added

"http2": "^3.3.7",

Which finally got me to cannot find module ./framer, which I understand says that I am trying to do smt client side, which should be on the server side?

Could anyone point me in the right direction, since it seems I am doing smt fundamentally wrong.

THank you in advance!