Fetching data from API with nextjs returns nothing

Question

I am playing around with nextjs lately, and I don't know why my code does not work. So it's a simple call to REST API:

import Head from 'next/head'
import Image from 'next/image'
import styles from '../styles/Home.module.css'

const defaultEndpoint = 'My_probably_problematic_api';

export async function getServerSideProps(){
  const res = await fetch(defaultEndpoint);
  const data = await res.json();
  return{
    props:{
      data
    }  
  }
}
export default function Home({data}) {
  const {results = []} = data;
  return (
    <div className={styles.container}>
      <Head>
        <title>Create Next App</title>
        <meta name="description" content="Generated by create next app" />
        <link rel="icon" href="/favicon.ico" />
      </Head>
      <main className={styles.main}>
        <h1 className={styles.title}>
          playing
        </h1>
        <p className={styles.description}>
          AROUND
        </p>
        <div className={styles.grid}>
          {results.map(result => {
            const {id, title} = result;
            return(
              <div key={id}className={styles.card}>
                <h2>{ title}</h2>     
              </div>
            )
          })}        
        </div>
      </main>
      <footer className={styles.footer}>
        <a
          href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
          target="_blank"
          rel="noopener noreferrer"
        >
          Powered by{' '}
          <span className={styles.logo}>
            <Image src="/vercel.svg" alt="Vercel Logo" width={72} height={16} />
          </span>
        </a>
      </footer>
    </div>
  )
}

If I run this, no data is fetched. I know that this code works because when I switch it to "https://rickandmortyapi.com/api/character" - it returns data correctly (on the front). I can console.log the response from my API. Could it be something wrong with my API response, like structure maybe? It looks like this:

[
    {
        "date": "02/02/2022, 20:10:21",
        "description": "Google Paid Search ads are one of the best digital advertising methods to target people who are actively searching and in the market for the products or services that your business offers. However, if you’re not experienced with Google Ads then you may fin",
        "id": "29dc9f038b5ee4bd68e96298627d5806c72e1f927b73077d725a86239a97d94f",
        "image": "https://activebusinessgrowth.ca/wp-content/uploads/2022/02/TN-23-Improve-ads.png",
        "link": "https://activebusinessgrowth.ca/5-ways-to-drastically-improve-your-google-ads/",
        "tag": "Digital Marketing",
        "title": "5 Ways To Drastically Improve Your Google Ads"
    },
    {next item, etc}

The API response which returns correct data(https://rickandmortyapi.com/api/character), looks like this:

{
    "info": {
        "count": 826,
        "pages": 42,
        "next": "https://rickandmortyapi.com/api/character?page=2",
        "prev": null
    },
    "results": [
        {
            "id": 1,
            "name": "Rick Sanchez",
            "status": "Alive",
            "species": "Human",
            "type": "",
            "gender": "Male",
            "origin": {
                "name": "Earth (C-137)",
                "url": "https://rickandmortyapi.com/api/location/1"
            },
            "location": {

Of course I am changing {title} to other matching keys from Rick and Morty API. Still - I don't know why on my own API - nothing happen. Forgive me if it's trivial question, these are like my first days with nextjs and I can't find the solution.