I have started webdevelopment and reached at backend. I was doing some express&ejs code but I’m getting some errors PleaseHelp

I am writing a code like basic instagram where i have some my own data –

{
  "cats": {
    "name": "cats",
    "followers": 25000,
    "following": 5,
    "posts": [
      {
        "image": "https://plus.unsplash.com/premium_photo-1677545182067-26ac518ef64f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MXx8Y2F0c3xlbnwwfHwwfHx8MA%3D%3D&auto=format&fit=crop&w=800&q=60",
        "likes": 200,
        "comments": 17
      },
      {
        "image": "https://images.unsplash.com/photo-1592194996308-7b43878e84a6?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8Y2F0c3xlbnwwfHwwfHx8MA%3D%3D&auto=format&fit=crop&w=800&q=60",
        "likes": 312,
        "comments": 19
      },
      {
        "image": "https://images.unsplash.com/photo-1577023311546-cdc07a8454d9?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Nnx8Y2F0c3xlbnwwfHwwfHx8MA%3D%3D&auto=format&fit=crop&w=800&q=60",
        "likes": 1065,
        "comments": 200
      }
    ]
  },
  "dogs": {
    "name": "dogs",
    "followers": 75000,
    "following": 150,
    "posts": [
      {
        "image": "https://images.unsplash.com/photo-1598133894008-61f7fdb8cc3a?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Nnx8ZG9nc3xlbnwwfHwwfHx8MA%3D%3D&auto=format&fit=crop&w=800&q=60",
        "likes": 3000,
        "comments": 41
      },
      {
        "image": "https://images.unsplash.com/photo-1552053831-71594a27632d?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MTd8fGRvZ3N8ZW58MHx8MHx8fDA%3D&auto=format&fit=crop&w=800&q=60",
        "likes": 2500,
        "comments": 32
      },
      {
        "image": "https://images.unsplash.com/photo-1537151608828-ea2b11777ee8?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MjB8fGRvZ3N8ZW58MHx8MHx8fDA%3D&auto=format&fit=crop&w=800&q=60",
        "likes": 500,
        "comments": 6
      }
    ]
  }
}

This was my data.json file and i was writing code for it
this is my index.js file –

const express=require("express");
const app=express();
const path=require("path");
const port=8080;

app.set("view engine", "ejs");
app.set("views", path.join(__dirname, "/views"));

app.listen(port, ()=>{
    console.log(`Listening on port ${port}`);
});

let instaData= require("./data.json");

app.get("/ig/:username", (req, res)=>{
    console.log(instaData);
    let { username }= req.params;
    console.log(instaData.username);
    let data=instaData[username];
    console.log(data);
    if(data){
        res.render("instagram.ejs", data);}
     }else{
         res.render("error.ejs");
     }
});

my instagram.ejs file –

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Profile</title>
</head>
<body>
    <h2>This page belongs to @<%= data.name%></h2>
    <button>Follow</button>
    <button>Message</button>

    <p>Followers : <%= data.followers%> &nbsp; &nbsp;&nbsp;&nbsp; Following : <%= data.following%> </p>

    <hr/>

    <% for(post of data.posts){ %>
        <img src=" <%= post.image %>" alt="some img">
        <p>
            comments : <%= post.comments %> &nbsp; &nbsp;&nbsp;&nbsp;  likes : <%=post.likes%>
        </p>
    <% } %>
</body>
</html>

this is what i am getting as output at my terminal

at the browser its keep laoding and at the terminal it is showing me instaData[username] is undefined

what is this happening please help