When it comes to learning, there are not so many absolute rule that applies to all about how to do it. I, for instance, love to understand the theory, the main concepts and think about it. So I often take this path.

But many people I know tell me they learn the best by directly tackling problems and learning on the way. I see that in many cases this approach might work better, be more efficient and more effective. In my experience, when it comes to knowledge that is already widespread and you can have an environment to experiment and get feedback without a considerable cost of failing, this is the best way.

For instance, to learn a new programming language or paradigm, to experiment different tools and for generall social skills such as public speaking and job interviews.

Here I will share my experience with learning React. My first contact with it was probably back in 2019 with a software engineering lab where we had a groupwork project to build a web application and the frontend was in React, a version of this. Back then I had very very little interest in frontend and just did when was absolutely necessary on the frontend (I focused on the architecture and the backend).

Fast forward to 2023 and I decide to learn more frontend since I had to implement a couple pages in Angular back when I was at Itaú. So I took the opportunity to learn React and did the classic tic-tac-toe game tutorial. After some time I saw this video that really helped my to grasp the concepts of React.

Then, in 2024 I had to implement a chatbot to give insights to customers about their transactions at Finbits. Then, once again, here I was with React. This time I had some knowledge and could advance more, specially with the help of GenAI tools like ChatGPT. But it also became clear that those tools, though said to be a future replacement for software engineers, aren’t even so helpful when you don’t understand the underlying concepts. For example, I tried implementing a very complex component to be able to render Markdown when there was already a component ready for that on the project. But I learned once again by doing that.

And lastly, this year I decided to advance my knowledge by building on top of the tic-tac-toe game, improving the interface, adding new features and practicing my AI skills. So here it is, my open-source Tic-Tac-Toe game - Alte (means old woman in German, which is the Portugues name for tic-tac-toe). Below you can learn about some important react concepts and also about a clever and efficient symbolic AI algorithm to either win or draw the tic-tac-toe game.

React

State management Element/component manipulation

Symblic AI

MiniMax with alpha-beta pruning