DEV Community

Cover image for What i knew about react!(These are the things that I've found challenging so far on my react journey.)
Devangi Bhutiya
Devangi Bhutiya

Posted on

2

What i knew about react!(These are the things that I've found challenging so far on my react journey.)

A couple weeks ago I started learning on React js. Not only was it my first React application, but it was also my first React js application, so a lot was new to me all in one go.

here are a few things I wish I knew before I got started.

What’s the difference between a library and a framework?

Let’s use an analogy of trying to build a house. With a framework, you’re essentially given all the materials to build that house, and it’s up to you in what arrangement you put them in. You will very rarely need to step outside the materials you have been given to use something third-party and, in some cases, you may not be allowed to step outside the materials.

With a library, on the other hand, you start with essentially nothing. The library’s materials are a limited set in comparison to a framework’s materials, and you can pick/choose when you want to use them and when you want to step outside that and use third-party materials.

React is a library not a framework

I sort of assumed this was more of a technicality, rather than a key piece of information around which I should redefine my expectations.

React is a UI library

React is a not only a library, it’s specifically for User Interfaces.for the most part, doesn’t change the way you write Javascript that isn’t directly related to your UI, but it heavily controls the way you write HTML and CSS (or the equivalent of it).

useEffect is a major 🔑

The code within a useEffect() block runs on each re-render, we can choose to execute them only when certain values have changed or just once. We do this by passing a second argument to useEffect(), with an array of variables that, if their value should change, we want the function to be run again.

const BetterExamplePage = (props) => {

    const [user, setUser] = useState();

    useEffect(() => {
        getUser().then((u) => setUser(u));
    }, [ /* dependencies */ ]);

    return (
        …
    );
};
Enter fullscreen mode Exit fullscreen mode

If we leave the array empty, that effectively means that the function will only run once.

👋 One new thing before you go

Tired of spending so much on your side projects? 😒

We have created a membership program that helps cap your costs so you can build and experiment for less. And we currently have early-bird pricing which makes it an even better value! 🐥

Just one of many great perks of being part of the network ❤️

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay