I am really new and I cant seem to find the solution just by googling it and the only solution it seems is to make an API to fetch the data which seems overkill for just one variable.

To run the script before Next.js runs, you can use the getInitialProps function in your page component. This function is executed on the server-side before the page is rendered, allowing you to fetch data or run scripts.

Here's an example of how you can use getInitialProps to run your script and store the config data before rendering the page:

1. Create a file called config.js that reads the config file and exports the variable:

// config.js
const configData = readConfigFile(); // Replace with your logic to read the config file

export default configData;

2. In your page component, import the config.js file and use the getInitialProps function to run the script and store the config data:

// YourPage.js
import configData from './config';

const YourPage = ({ config }) => {
  // Use the config data to render your table
  return (
    <table>
      {config.map((item) => (
        <tr key={item.id}>
          <td>{item.name}</td>
          <td>{item.value}</td>
        </tr>
      ))}
    </table>
  );
};

YourPage.getInitialProps = async () => {
  // Run your script here to fetch the config data
  const config = await runScriptToFetchConfig(); // Replace with your logic to run the script

  return { config };
};

export default YourPage;

By using the getInitialProps function, the script will be executed on the server-side before the page is rendered. The fetched config data will be passed as a prop to your page component, allowing you to map through it and render the table.

Note: The getInitialProps function is available in Next.js versions up to 9.x. Starting from Next.js 10, you can use the getServerSideProps or getStaticProps functions for server-side data fetching.

ill assume its the same with getserverside and getstaticprops

?

Do not paste chat gpt as a response. This is your only warning.