What I Wish I Knew Before Learning React

This content originally appeared on DEV Community and was authored by Code WithDhanian

I thought I was ready for React.

I’d done a bit of HTML, CSS, JavaScript.

Then I opened the React docs and thought,

“This is just another library. I got this.”

I was so wrong.

React was more than I expected—it rewired the way I think about building apps.

And I made a ton of mistakes that I don’t want you to repeat.

So here’s everything I wish I knew before I started learning React—from one developer to another.

1. Master JavaScript First — Seriously.

React exposes your JavaScript weaknesses real fast.

I struggled with concepts like:

map(), filter(), and reduce()
Arrow functions
Destructuring
Closures
The this keyword

If you’re shaky on JS, React will feel like learning to swim during a tsunami.

Take time to solidify your JavaScript fundamentals.

And if you’re learning React anyway, make sure you’re learning both side by side.

2. Components Are Functions, Not Just UI Blocks

React isn’t just about making UIs prettier—it’s about building UI logic with functions.

function Welcome({ name }) {
  return <h1>Hello, {name}</h1>;
}

Once I understood that components are just JavaScript functions that return JSX, it clicked.

But it took me a while to see that:

State makes them dynamic.
Props make them reusable.
Hooks make them powerful.

It’s not just about HTML in JS—it’s JS in control of HTML.

3. `useState()` Feels Weird at First

const [count, setCount] = useState(0);

If this syntax confused you, you’re not alone.

React state hooks were so new to me that I almost gave up.

It took me a while to realize:

useState is a way to remember values across renders.
It doesn’t mutate directly—you must use the updater function.
It’s part of React’s reactivity model.

Once I got used to thinking in state, my apps became smarter.

4. You Will Misuse `useEffect()`

This one humbled me.

useEffect(() => {
  fetchData();
}, []);

It seemed simple, but then:

I created infinite loops.
I forgot dependency arrays.
I fetched data too often.

Understanding useEffect() is crucial—it controls side effects, timing, subscriptions, and more.

Don’t skip it. Learn it deeply.

5. JSX Isn’t HTML, But It’s Close

I wrote this and wondered why it broke:

<div class="container">Hello</div> // wrong

In JSX, it’s:

<div className="container">Hello</div> // right

Also:

Use htmlFor instead of for
Everything must be in one parent tag
You can write JavaScript inside {}

It’s weird at first, but you’ll get the hang of it.

6. You Don’t Need Redux on Day One

This one is important: Don’t overwhelm yourself.

I jumped into Redux too soon and got burned.

Start with:

useState
useContext
Maybe useReducer

Only adopt Redux, Zustand, or Jotai when your app genuinely needs global state.

7. Styling in React Is a Journey

You’ll see:

Inline styles
Styled-components
Tailwind CSS
CSS Modules

My advice? Start with regular CSS.

Then try TailwindCSS once you’re comfortable.

Styling shouldn’t be the thing that holds you back.

8. React Isn’t Just React

You’ll eventually run into:

React Router (for navigation)
Formik / React Hook Form (for forms)
Axios / React Query / SWR (for fetching data)
Framer Motion (for animation)

Don’t try to learn all of this at once.

Learn React first, then explore tools as your projects demand them.

9. Build Projects, Not Just Follow Tutorials

Tutorials are great. But you need to:

Break things
Debug
Solve real problems

Build:

A To-do app
A weather dashboard
A note-taking app
A simple blog

And when you’re ready to go deeper, I wrote a full beginner-to-pro guide for React.

It’s packed with everything I learned, explained in a simple, project-based way:

Grab my React eBook here →

If you’ve enjoyed this article, this eBook will take your skills to the next level.

10. It’s Okay to Feel Dumb

I felt like quitting many times.

React can be frustrating.

You’ll question yourself.

You’ll stare at a component and wonder why it’s not rendering.

You’ll console.log more than you ever have.

But that’s the beauty of learning.

You’ll wake up one day and say, “Wait, I finally get this.”

And it’ll feel amazing.

Final Words

React changed how I build websites.

But it didn’t come easy.

If you’re on this journey—I’m rooting for you.

And if you want a shortcut to avoid all my mistakes, my React eBook is the guide I wish I had when I started:

Get the React eBook →

Also, follow me on X for more dev tips, threads, and tutorials:

@e_opore

Let’s build better apps, together.

— Dhanian