Day 3 - React in Practice – Understanding Components and State Management

🚀 Day 3 of my 30 Days of Learning Challenge

Next day's learning session focused on something I’ve been looking forward to for a while: React.

After diving into JavaScript and TypeScript over the last two days, exploring React gave me a new appreciation for how the frontend is actually structured and built in modern applications.

React introduces a component-based mindset. Instead of thinking of the UI as a static layout, I began thinking of it as small, dynamic, and reusable building blocks. I created a counter app and a to-do list, each using useState for state management and simple JSX to structure the layout.

At first, the JSX syntax was a bit odd — HTML inside JavaScript?! But after seeing how clean and readable it made my components, I started to like it. Using hooks like useState gave me control over dynamic UI changes — from updating counts to managing input fields. We also touched briefly on useEffect and the concept of side effects, though I still need to explore that more deeply.

What I appreciated most was how easy it was to test small features. I could tweak something, see the change instantly, and really grasp how state and props work.

While I didn’t use Next.js yet, understanding raw React first helped me build confidence. This foundation will make it easier to integrate frameworks later.

💬 Question for Readers:
What was the first component you ever built in React, and what confused you the most starting out?