Define the Store Type
This lesson preview is part of the Fullstack React with TypeScript Masterclass course and can be unlocked immediately with a single-time purchase. Already have access to this course? Log in here.
Get unlimited access to Fullstack React with TypeScript Masterclass with a single-time purchase.
[00:00 - 00:06] Define the store types. Create a new file, as you see, Utils, Types, T.S.
[00:07 - 00:12] And inside of it, Define the type for our state. Expert, Type, Root, State.
[00:13 - 00:20] It should contain the current stroke of type stroke, and the stroke array. Strokes, Array of Type stroke.
[00:21 - 00:27] Right now it contains two fields. Current stroke, it's an array of points corresponding to the stroke that is currently being drawn.
[00:28 - 00:33] And strokes, it holds an array of already drawn strokes. Let's define the missing stroke type.
[00:34 - 00:42] Expert, Type, Stroke has points. It's an array of type point, and it has color, of type string.
[00:43 - 00:48] Each point on stroke has X and Y coordinates. Let's define this type.
[00:49 - 00:57] Expert, Type, Point has X number and Y number. Those hold horizontal and vertical coordinates.
[00:58 - 00:59] Alright, and we have our root state type defined.