Help React bind/this "create-a-controlled-input" challenge

[MarianoFarace]

So, up till React, everything was going alright, now I’m getting frustrated and it takes me waaay to long to move on.

I was trying to solver the “create-a-controlled-input” challenge. I could not. I took a look at the solution. Here, for the first time ever, they are doing the binding inside the return method, despite the fact that the challenge says it has to be done on the constructor, anyways, it is nice to know it can be done in a different way.

On the other hand, I googled about onChange event handler for some examples, because, either I don’t remember how to use it or we haven’t seen it in the curriculum. First result, is this one (React onChange Events (With Examples) - Upmostly). So here the guy does not even use the keyword this. Now I’m completely confused. The important question on this topic is: What is going on? Is that post wrong? how come that he does not even use .this a single time? Am I missing something? Hope you can give me an insight, because I am completely lost and frustrated by this point .

[jsdisco]

The blog you posted isn’t wrong, but they’re using a different way to write React.

In React, you can have class-based components and functional components. The former are a bit outdated, the latter are the most common nowadays, because they’re easier to write (no binding, no “this”).

The FCC curriculum teaches only (mostly?) class-based components, because at the time that the curriculum was created, there was no way in React to have state in a functional component. Those are a newer feature.

So to sum it up - don’t despair. Just remember that if you google a React problem, pay close attention whether they’re using a class or a function.

[MarianoFarace]

Thanks @jsdisco , that’s what I needed to hear. And it also explains why when I installed react I got the starting code as function and not class. I thought class was the newest one and it got confusing. It’s a pity that the curriculum is already outdated.

[jwilkins.oboe]

Frameworks and libraries are always changing so it is tough to constantly update the curriculum.

But there is a whole new project based curriculum that is in development.

Help us build Version 7.0 of the freeCodeCamp curriculum

Hey freeCodeCamp contributors - soon the freeCodeCamp curriculum will be 100% project-driven learning. Instead of a series of coding challenges, you’ll learn through building projects - step by step. Before I get into the details, let me emphasize: we are not changing the certifications. All 6 certifications will still have the same 5 required projects. We are only changing the optional coding challenges. A brief history of the curriculum OK - Version 7.0! Here’s a history of our curriculum ve…

So the curriculum is currently being updated. It will just take a while before the final product is ready.

[Sky020]

@MarianoFarace

It’s a pity that the curriculum is already outdated.

Hey there, just to weigh-in here:

Something important to keep in mind with coming across the outdated content within the curriculum is that, in any existing, real-world job, you are going to come across this, or even older.

Pre-python content, everything taught in the curriculum is used in the freeCodeCamp platform codebase. So, as an example, many/most of the React within the codebase consists of class-components.

Absolutely, you need to learn the current/up-to-date content for potential tools you might use in industry, but do not be deceived in thinking learning ‘outdated’ content is useless/waste-of-time.

Personal example: jQuery is being phased out. I refuse to write new jQuery code, because native JS has IMO superseded jQuery, now. However, I am glad I learnt jQuery, because I come across it so often, and need to read it, and I also transpile it (into native JS).

Yes, it would be excellent, if the current fCC curriculum contained the newer versions of the tools. Unfortunately, it is a scope issue - in that there is no scope.

Otherwise, take time to have a peruse of the work being done on the next version of the curriculum linked by @jwilkins.oboe to get an idea of the updates, and the expansions.

I encourage you to keep learning outwith specific curricula - READ-SEARCH-ASK.

Hope this helps

[jsdisco]

@MarianoFarace

Thanks @jsdisco , that’s what I needed to hear. And it also explains why when I installed react I got the starting code as function and not class. I thought class was the newest one and it got confusing. It’s a pity that the curriculum is already outdated.

Of course it’s confusing at first. I think in the special case of React/FCC, you’ll have to decide whether you want to continue with the curriculum and learn class-based components (@Sky020 has a point, those are still in many code bases), or if you pick a different resource for learning contemporary React with functional components (there’s a lot on YT and I think even FCC videos, just no curriculum), and only start learning class components if you really have to (because your job and the code you’re working with there demands it). I’d recommend the latter, but that’s ultimately your choice, and learning “freestyle” can be more challenging, because you don’t get an immediate feedback “yes your code is correct” like you do in a curriculum.

But maybe just being aware that there’s two “ways” in React has already armed you with what you need to efficiently search for solutions, regardless of which way you go.

[MarianoFarace]

@Sky020

the tools. Unfortunately, it is a scope issue - in that there is no scope.

I understand the value of knowing how to , at least, red older versions of code. But since this migth not be the first time a post about this has been written, it would be really nice just to put a nice warning or headsup, on the lesson. Learning this topics can be confusing, and sometimes what may seem to be a natural conclusion for someone, may not be for another one. Thanks for your reply @Sky020