Type declaration in NextJS project

Question

I am new to both NextJS and typescript. I am creating a project for practice and I was wondering will it a good idea to store all my type definitions in one file like global.d.ts? or keeping all the type definitions in one file will effect the project performance? if so, what is the proper way to store my type definition when working with typescript?

I was trying a Next JS project with Typescript.

Answer 1

Defining types could be done in app/lib/definitions.ts however I think it is a personal preference. Also the naming convention of Types are usually PascalCase.

For example within the definitions file we could define them such as:

export type TypeName = {
  id: string;
  name: string;
};

Then we could import in the .tsx file (or which ever file it's being used) such as:

import { TypeName } from '@/app/lib/definitions';

The advantage of defining our types in a separate file such as the definitions file we don't have to define them mulitple times with in separate .tsx files.

• Please note this would be for the app router Next.js projects versions > 13.

Answer 2

Your type definitions should be stored where they are being used. If you have a users domain for example then put the user type in that folder.