React Tutorial #10 - Input Refs

Hey, in this React tutorial for beginners, I'll introduce you to input Refs and how we can use them to reach into the DOM and retrieve information about elements, such as an input value that a user types into a form field.

----- COURSE LINKS:

---------------------------------------------------------------------------------------------
You can find more front-end development tutorials on CSS, HTML, JavaScript, jQuery, WordPress & more on the channel homepage...

========== PSD to WordPress Playlist ==========

============== The Net Ninja =====================

================== Social Links ==================

[uhNid]

Seriously, the way you go from talking about what something like the onSubmit will do then proceed to follow through the app to explain where things will occur makes it sooo much easier to visualize how this all works. You're a fantastic teacher.

[rahulthampi]

You are doing a world of good for new developers like me... came across your channel two days ago... and man i can tell its best i've seen so far... Thanks man!!

[notNewlyBorn]

wonderful!.. can't wait for the 'very next lesson' :)
I have a suggestion+request for tutorial series - Building a fullstack app with
1. Bootstrap or any css framework,
2. React+Redux/flux,
3. Nodejs+Express
4. gulp and/or webpack
5. etc.

The purpose should be to understand the fullstack app building process and where and how these technologies fit and integrates. Thank you!!

[zfnqdyn]

I have no idea why the videos have only 2-3k views.
Best react tutorial ever!

[tanvirhaider]

this is truly awesome. thanks so much for putting together these tutorials. you made react learning so easy.

[Sckbt]

Your tutorials are the best one can find online, thanks!

[girlandhercomputer]

Like the way you explain Refs, I learned things, great thanks~

[MaxBodak]

7:04 the code should be changed to
<form id="add-todo"
<input type="text" required ref={(input) => { this.newItem = input; }} />
<input type="submit" value="Add item!" />
</form>
And in handleSubmit:
due to new rules =)

[StyleTrick]

Thank you for these tutorials! Means a lot man! Thank you once again!

[sjirjis]

If I could give you 10 thumbs up I would! This was fantastic!

[TheInterestingInformer]

Awesome vid dude! Me and my dad have been watching you to learn how to Code/Program since you are the best step-by-step tutorial creator on YouTube! Just a Random Question: Have you ever considered making a mogoDB tutorial?
Thanks,
FightOnGaming.

[daristotell]

NOICE!
What are you going to do next?
More React and maybee Redux?
pls?
love your work man.

[robertbl]

index.js line 44: updatedTodos should be a copy of the array, not point to the original array. So it would read...
var updatedTodos = this.state.todos.slice();

[rohitbhargava]

Hey Ninja,
I followed you from the beginning of my web development learning and found you the best available on youtube....:)
I saw your videos and know most of the things like HTML5, CSS3, Bootstrap, Javascript, Modular JS, ES6, Webpack etc...

"React" is the future and its better than angular 2. So my question is if i start with React only without learning the Angular 2 and j query, will that be fine...? I know little bit about jquery and have used it but no experience on angular js.

[youee]

which package do u use in Atom so it shows you the values of stuff when you hover above them?

maybe can you also share some of the packages you installed for a better Atom framework?

[rnvdrs]

Would
this.refs.newItem.value = ""
be the correct way of cleaning up the input after we hit the submit button?

[ericellison]

you need to add bind(this) to the handlesubmit function on onsubmit...

[youee]

You are a Total web university!
thank you so much !¡

is this react tutorial is over? or will there be some more leasons in the future?¿

[lonely]

Hello Ninja, sorry for that shitquestion, but what font and color-syntax are you using in atom?

[mayankdutta]

hii !!
could you share font name you are using in vscode.