JS TS Upgrade Recommendations - DSGT-DLP/Deep-Learning-Playground GitHub Wiki

1. Remove all PropTypes. TS already does this job for us
2. Use interfaces when possible, not types. See https://stackoverflow.com/a/65948871/11031425
3. Abstract types for simplicity.

// don't do this if the type is too complex
const MyComponent = (props: {
					 propA: string, 
					 propB: string, 
					 propC: string,
					 propD: string
					}) {return </>}

// instead do this
interface MyComponentProps {
	propA: string, 
	propB: string, 
	propC: string,
	propD: string
}
const MyComponent = (props: MyComponentProps) {return </>}

4. Use lint. Install the ESLint extension and follow its recommendations
5. Avoid any if possible. For objects, try { [key: string]: any } instead of just any. Or use typeunknown
6. Finding the type of e is hard. Try to not. Instead, pass in the value from e you want, like e.target.value in onClick={(e) => handleClick(e.target.value)}