Can't get data from Strapi (NextJS/Strapi/Axios)

Question

So I'm trying to get data from Strapi, I've set everything up according to their QuickStart Guide. But I get nothing logged in either the terminal or the browser.

When I go to the url http://localhost:1337/api/products with the server running it shows everything I need but I still can't seem to be able to get that data to show up in my nextjs project.

This is how I've set up my page in the directory app/products/page.js

import React from "react";
import { fetchQuery } from "../utils";

export default function Products({ products }) {
    return <div>Products</div>;
}

export async function getServerSideProps() {
    const products = await fetchQuery("products");
    console.log("Hello");
    return {
        props: {
            products,
        },
    };
}

And this is the fetchQuery function:

const baseUrl = process.env.BASE_URL;
async function fetchQuery(path, params = null) {
    console.log("In the query");
    let url;
    if (params !== null) {
 url = `${baseUrl}/${path}/${params}`;
 else {
 url = `${baseUrl}/${path}`;
    }
    const response = await fetch(`${url}`);
    const data = await response.json();
    return data;
 }
export { baseUrl, fetchQuery };
 

This is definitely a noob mistake on my part since I can't figure out something so simple after so many retries and making the project again and again.