The Coding Techniques for TypeScript in React
2 min readAug 13, 2022
How to create a union type for the constant key
How to create a union type of constant values
How to downcast
How to use property types in Material UI
TextField types can be inherited by TextFieldProps
, but if you want to use the name property of a TextField, write the following.
Frequently used comment prefixes and annotated comments
FIXME
: Defective code. It indicates a feature that must be fixed.TODO
: Should be done, but lower priority thanFIXME
.NOTE
: Write the intent of the implementation and the reason for coding.HACK
: The part you want to refactor.WARNING
: Cautions.
How to code a OR sequence in TypeScript(React)
How to code an AND sequence in TypeScript(React)
…
It means a spread syntax. It has a very wide range of uses and must be kept in mind. The following program is an example of the use of the spread syntax.
State management using useState
When the value of a variable is updated, the displayed value is changed at the same time. useState is a split assignment of an array into two variables.
- The first variable is used to display the state
- The second variable is a function to update the state value
forwardRef/createRef
Ref forwarding is a technique for automatically passing a ref through a component to one of its children. This is typically not necessary for most components in the application.