TicTacToe (Project)

demo | github | tutorial

Key Takaways

To start my React journey, I decided to follow the official tutorial on reactjs.org.

Components

The tutorial, unfortuantely, uses class based components which is fine for an intro guide. I learned the basics of components, sibling and child components and how they interact with each other. What was interesting is how changes made to state of parent componenets automatically re-rendered child componenents that depended on the data.

Stateful Componenents

The tutorial also gave a basic introduction to maintaining state in a web app. The app being built was TicTacToe and so examples state included:

• Current and past moves
• If next move is ‘X’ or ‘O’

JSX

I thought JSX (JavaScript XML) was very convenient. The fact that you can seamlessly weave HTML elements with JavaScript logic and use them as pure JS objects makes it easier to create UI elements. It was a bit difficult to get used to especially when you use them together with for loops and conditional statements.

Finally

I am really excited with how React works overall and hope to implement numerous projects going forward!!