Is it necessary to use getStaticProps
in order to render static data from a JSON or typescript file, or can the data be imported without using getStaticProps
? The documentation I read didn't provide a clear answer.
projects.tsx
const projects: [
{
id: "6853939";
name: "Project 01";
title: "Title 01 ";
previewImg: "/images/projectThumbnails/image01.jpg";
},
{
id: "6853939";
name: "Project 02";
title: "Title 02 ";
previewImg: "/images/projectThumbnails/image02.jpg";
}
];
export default projects;
names.json
{
"names": [
{ "name": "Full Name 01", "age": 34 },
{ "name": "Full Name 02", "age": 22 },
],
}
index.tsx
import projects from "../data/projects.tsx";
import names from "../data/names.json";
const IndexPage = () => {
return (
<>
<div>
{projects.map((i) => (
<div key={i.id}>{i.title}</div>
))}
</div>
<div>
{names.names.map((i) => (
<div key={i.name}>{i.name}</div>
))}
</div>
</>
);
};