Blog: My First Steps into React

It’s been a little while since my last blog post, but I wanted to share an update on where I’m at in my coding journey. As part of my Full Stack Developer course, I’ve recently made the jump into learning React — and I’m really enjoying the switch.

What is React, and Why Learn It?

For those who may not be familiar, React is a JavaScript library for building user interfaces, created by Facebook. It’s one of the most widely used tools in modern web development because it helps developers build apps that are fast, scalable, and easy to maintain.

The key idea is that instead of writing one big page of code (like with plain HTML, CSS, and JavaScript), you build your site using components. A component could be something as small as a button, or as large as an entire page section. These components can then be reused, updated, and combined to create more complex interfaces.

This approach makes React feel very different compared to vanilla JavaScript, where you often find yourself targeting elements manually with selectors and updating them directly. In React, the components take care of themselves — you just tell React how things should look, and it handles the updates behind the scenes.

Returning to HTML & CSS (But With a Twist)

One of the first things I noticed about React is how refreshing it feels to work with HTML-like elements again. In React, this happens through something called JSX, which looks like HTML but is written inside your JavaScript code.

For example, instead of creating an element with document.createElement, in React you can simply write:

<h1>Hello, world!</h1>

That might look like plain HTML, but it’s actually JSX being compiled down into JavaScript. For me, this makes React feel natural, because it blends the familiarity of HTML and CSS with the power of JavaScript.

Discovering My Passion for Front-End

Whilst I’ve enjoyed learning JavaScript and getting comfortable writing in the console, I’m beginning to realise that my passion lies in the front end. There’s something exciting about seeing code instantly transform into something visual — a layout, a styled button, an interactive component.

React has brought that feeling back. Even the simplest examples feel rewarding, because I can see my work taking shape in a browser, not just in a terminal.

Building on What I Already Know

Another big positive: React doesn’t start from scratch. Everything I’ve learned so far with HTML, CSS, and vanilla JavaScript is required to learn React. Those building blocks carry over, but React pushes them further.

HTML knowledge helps me understand JSX.
CSS knowledge helps me style components.
JavaScript knowledge helps me work with props, state, and logic that powers interactivity.

That said, I’m still figuring out how it all connects together. The setup and structure of a React app — things like where files go, how components communicate, and how data flows — is still a bit hazy. But I know it’ll start making sense as I build more.

Tools & First Impressions

So far, I’ve been using Vite to set up my React projects. Compared to older tools like Create React App, Vite feels lightweight, modern, and easy to understand. It spins up a React environment quickly, which means I can focus more on learning React itself rather than wrestling with configuration.

At this stage, I don’t have any active React projects to share — but watch this space. I’m already brainstorming ideas, and I’m looking forward to creating something real with React soon.

Looking Ahead

This post is more of a checkpoint than a showcase. I wanted to get something out there (since it’s been a little while!) and mark this new stage of the journey.

Next time, I’ll aim to share a “Part 2” with some small React projects, where I can show more of what I’ve been building and learning.

For now, I’m just excited to be diving into React, enjoying the return to front-end development, and beginning to understand why React has become such a key part of modern web development.