I have been learning to code for a while. A few months ago I started practicing Object oriented Javascript. I just recently started to learn React. I know the basics. Apparently they recommend just one stateful controller. But does not that constrain me to make a mega App class with a massive state object and too many methods?
I guess I can implement the logic from outside. I think in the docs they mention that. But… how?
For example my slide puzzle game, the design is pretty obvious , the classes, Piece, Space, Boards, with their methods, it all makes sense
But now I am not sure how to approach the design from React. I dont even know how to start!
This is the problem that Redux is meant to solve, but you will also learn when to put state in the global state object and when it can be encapsulated in a component.
That’s not quite right: if the state is local to the component, then use local state. The recommendation is for cross-cutting concens: if the state needs to be shared between components, you move the state upwards to a common parent then pass it down via props, it quickly becomes impossible to manage any other way.
Don’t touch Redux until you’ve learned how to manage state by passing props (or using context). You need to go through the pain of state management to learn how React works and to be able to recognize when libraries like Redux of Mobx make sense.
Regarding where to start, I’d say GitHub. Search for something like “react sliding puzzle”, sort results by recently updated and see how people structured their code.
Thanks. You are right. I am now building a very simple app and indeed it is called “Cats & Quotes” go figure lol.
Im finding myself in trouble with what they call “prop drilling” now it is time to properly learn object destructuring and spread operator!.
By the way I found a tutorial that shows very well how to implement react in a complex program.
It is very interesting. The tutorial is here He uses standard object oriented JS to keep all the logic related to the pieces (legal moves, and starting position) and then he just injects the board into the state. The state also contains those variables that will affect the turns of the game and what can be clicked and when)
My guess is that the logic and the core propierties are ok in using normal classes or constructors, and then called in the state. All the 'shallow variables. that will change with the game, counters, toggling elements, belong to the state object"