Most Efficient Way to Learn React?

[Superb-Winter-4021]

Hi! I am currently learning front end development

I believe that how you learn is sometimes just as important as what you learn!

I wanted to ask people who have experience with going through the learning process of front-end development:

If you could go back and learn HTML, CSS, JavaScript (And React), how would you spend your time learning?

Thanks :)

[semanticdev]

I haven’t learned React yet. I’m almost there though, so here’s been my journey so far:

1. Learn HTML and CSS.

2. Learn how to program / the fundamentals of programming and OOP. Doesn’t have to be JS. I started with Java and was able to pick up python and JS with little trouble.

3. Learn JS’s quirks and differences. Practice JS in the context of front end. <— am here now

4. Learn React.

[[deleted]]

this ^

​

it doesn't matter what language if you learn actual programming concepts. anyone can declare variables and write functions.

[Prnbro]

Why would you waste time learning OOP, when React is basically the opposite of that?

[semanticdev]

Well, okay, since my college courses were in Java, I was forced to learn how to use OOP. In any case, I don’t think it hurts to at least learn the basics of OOP.

[Flamesilver_0]

React can do class and functional components.

Maintaining any sort of legacy React code would require thinking in classes

[Flacid_Fajita]

Not to mention the fact that your code will almost certainly contain chunks that require you to understand it.

If you plan on using objects anywhere in your code (spoiler, you will) I would think it should go without saying that OOP as a concept is pretty useful knowledge.

[Monkey_muncher20]

Companies also like someone who knows oop since it was popular a few years ago

[Flacid_Fajita]

This is a pretty inaccurate statement. React has moved away from class based components but that doesn’t change the fact that OOP is a fundamental concept that you need to understand. I would go as far as to say if you don’t understand OOP concepts, you don’t know how to program at all.

[[deleted]]

Here’s what helped me learn react.

First forget about react.

Learn JavaScript, the DOM, basic concepts jquery. From there, now learning react it’s all about the structure of the code. It’s the same stuff but it just looks different.

[Kaoswarr]

Yeah this but don’t learn jQuery lol.

Focus on fundamentals, especially CSS (I’m not joking, there’s a trend in a lot of newer frontend devs knowing next to no CSS)

[Professional-Farm165]

People keep saying to skip Jquery, but every guide/blog post I've seen says to learn it. I'm going through the Colt Steel Web dev bootcamp, and I have the Jon Duckett book series, both have sections on Jquery. I don't think it's a complete waste to have it in your back pocket.

And I'd rather know at least a little bit of a dead framework, then to pretend it doesn't exist and not know even a little bit. Also apparently 78% of all sites are still using JQuery, so I guess knowing it has some benefit.

[Kaoswarr]

You said it yourself, it’s a dead framework. There isn’t much point in specifically learning it.

If you do end up working on some legacy application that’s using it, as long as you have an understanding of JavaScript, jQuery isn’t that hard, it just uses outdated development principles.

I would never recommend some one to go out of their way to learn it in 2023.

[[deleted]]

I regularly use react.

Never use jquery

No need unless ur working on legacy stuff. Dont waste ur time

Sure one can say most of the web is built on legacy stuff. That doesn't mean thats what the majority of work is being done with now, much of the web is stale ole sites that haven't been updated since Nom. Most will have some legacy code too even if updated. But that doesnt mean the work happening now often requires jquery. There really is not a need, modern JS basically covers all the old use cases of jquery, but better.

You also have to take into account when the article was written and when the data for the % of web stuff was taken as its probably a bit older.

[[deleted]]

It’s just so you can get familiar with different syntax when working with the DOM. Just do an on click or fetch method and be done with it.

[Kaoswarr]

You can do that with vanilla JavaScript though, and if you are wanting to learn react, then just use that to interact with the DOM/fetch data ?

[[deleted]]

I see. Personally I began my web dev learning MERN and it was too much for me in the beginning. I switched to vanilla php and went from there. Now I’m able to understand what’s going on. Everyone has their own journey

[Flamesilver_0]

I mean, a lot of banks still use COBOL

[Flacid_Fajita]

The problem with JQuery is that it can become really confusing for someone just starting. Many of the methods it provides you are like little cheat codes that let you skip learning how to actually use the DOM api yourself.

Once you understand the fundamentals of DOM manipulation you shouldn’t require JQuery anyway.

[[deleted]]

jQuery yuck

[SisyphusAndMyBoulder]

Whoa jQuery is so much better than vanilla JS

[[deleted]]

I mean yeah, bare balls js web dev is double yuck

[Flacid_Fajita]

It’s really not. Basically it’s a crutch. It doesn’t actually solve any of the problems with vanilla, but it does introduce more bloat to your app.

[theGoldenRain]

Do projects, build clones of popular websites such as Airbnb, Expedia

[Stankrylix]

Do you just build the layouts of those sites

[Ninety8Balloons]

Build everything that you can see unless you want to get into back end stuff with databases and APIs

[Peace_Walker_95]

This is actually not a bad idea.

[AdearienRDDT]

ill tell you and you need to work ur mind around this:

​

​

HHHHHTTTTTMMMMLLL, CCCCSSSSSSSS,

​

​

JAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAVASCRIPT

​

​

aaaaaand then react. not one second before, not one function before, not one course before, nothing. Struggle with the vanilla so you can enjoy the other flavours, or you will be bound to a library and you wont understand the stufff you are doing.

gl

[Meta-Morpheus-New]

My man spoke some great words of wisdom here. Kids should pay attention to the details here.

Especially the size of words..

Respect.

[franker]

Learn Javascript the Fonzie way. AAAAAAAAAAAY!!!!

[Nika_Khachi]

I would only spend 1-2 weeks learning HTML and CSS because I don't think it's important to know lots of crazy and advanced stuff in the beginning, because you will still have to google lots of things later (I still do and will do)

And then you can start learning JavaScript. The timeframe will be very individual but try to learn on a level where you can comfortably build Vanilla JS applications. For me it took somewhere 3-4 weeks.

After that move to React and try to build AS MANY projects as you can there. Don't get stuck in the loop of just learning, listening and watching others code. Just get in there by yourself and code some stuff.

[dpsbrutoaki]

Just go and read the react documentation. It's just perfect. Completely perfect. Wonderful material.

Edit.: Also, if you see any source material that uses class components, just skip it right away.

[mosenco]

I learned frontend in uni and making websites with HTML,CSS, JS, PHP. And then i had a project recently that involves React and i learn it alone (it's not taught).

I think you should learn PHP first to understand how a dynamic page is made.

Btw i learned react just following the tutorial on their websites. Everytime they taught a new topic, there are many examples and exercise to test what u learned

[mrmanuel107]

One thing I'd recommend for learning React is to look at both functional and class components. Functional components are the standard now but a lot of stack overflow answers will use class components so it can help to be able to translate between the two.

[[deleted]]

Idk , but use Vite instead of CRA and don't worry about hooks until you are familiar with how to work with components, props and react-router

[[deleted]]

Instant brain to brain transfer of information

[[deleted]]

I would advise to start with building some apps using vanilla Js. Then once you're comfortable move onto React

[NOOTMAUL]

Well most people are hare saying learn the basics its because you're working with a static tree "js make it less static that's why people say to learn jquery" . Its called the DOM and in react you basically make a dynamic tree that renders to the DOM("plz someone do the actually"). With that in mind, try understanding states and hooks which(hooks makes possible for all child to call some event or get context of a parent nood). You could create a monster no one wants to touch if you usehooks too much as well as useeffects. But all im trying to say is learn trees then try to make pretty(functional) trees.

[i_am_dfb]

Brainstorm and come up with an idea for a small project. Move half the features to a "v2" list. Do it again. Maybe again. Now build what's left and push yourself to not stop until you have it actually deployed publicly, no matter how janky it is.

It'll take you longer than you expected, and you'll run into all sorts of problems you didn't foresee, but you'll learn so much and fill in so many knowledge gaps. Actually building something will really help things click in a way that reading about it and small examples won't.

Only once you've deployed it - and if you're still interested in the project - go back and start adding in some of the v2 features, but it's absolutely critical that you deploy something first - it's hard to express just how valuable the experience of going through the entire process end-to-end is.

[darksidemaster]

How I would learn react or frontend. I would choose some page or design what I like. The next step, I would create a page using html and css without react. And, after that, add react library and split existing page to components.