Developer Guides and Projects

 Nextjs is a powerful Reactjs framework which has a good developer experience. In this post I like to show you how to import JSON data file into the Nextjs project with Typescript Type.

In my recent Nextjs project, need to shape object array to a different type.  Mapping through the entire array in my arrow function and return the new object. Even though the return statement work. The type is still unknown. So, I have to covert the result into array of my type. Mapping Array Type export type LatestInvoiceType={ id:number; amount: number; customer:{ name:string; email:string; image_url:string; } } New Type export type LatestInvoice = { id: string; name: string; image_url: string; email: string; amount: string; }; Solution to the problem Here is my solution to the problem const latestInvoices = invoices.map(invoice => { return{ id:invoice.id.toString(), amount:invoice.amount.toString(), name:invoice.customer?.name, email:invoice.customer?.email, image_url:invoice.customer?.image_url }; }) as LatestInvoice[] ;