I am learning how to use typescript with react and I am new to all those technologies.
In the example below why do we write the codes like that; I am studying from a code base and the Redux tool kit has been used and the logic is written in this way as below: why do we have interfaces and initial states separately? I know that I am missing a lot of basic. Thank you for your help.
export interface ProjectState {
projectId: number | undefined;
project: Project | undefined;
projectInfo: ProjectInfo | undefined;
fields: Array<Field> | undefined;
const initialState: ProjectState = {
projectId: undefined,
project: undefined,
projectInfo: undefined,
fields: undefined,
first is good to recall the basics, an interface in typescript is like a contract within an object and the shape it should implement. So another thing is you can't create an instance of an interface, you will never see something like this.
export interface ProjectState {
...
}
const project = new ProjectState;
This is why you are watching the initial state and the interface separately. The principal reason why the people prefer to create an interface insted of using type, is to export it and re-use the same contract in others part of the application.
Keep in you learning process, you are doing great!