The Key to Understanding React: Why Keys Matter

Подписаться 16 тыс.

Просмотров 9 тыс.

50% 1

In this video I talk about the importance of keys in react when rendering a list of elements. When rendering a list of elements in react you get a warning if you don't supply a key. What's the point of this key? Why is it so important?
----Hire Me As a Mentor----
If you would like to hire me as a 1 on 1 mentor you can do so by following this link!
codingwithchai...
Here is the best part.... You only pay for the session if you are completely satisfied!!
So book a session and level up your web development skills today!

Опубликовано:

20 окт 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 56

@AurelioPita Год назад

I wanted a video to send to junior react developers, this is the video. Well done.

@Pareshbpatel 2 года назад

The importance of Keys in React. Beautifully explained. Thanks, Chaim {2021-11-18}

@grandmaster-yo-yo 9 месяцев назад

Was looking for videos that could help me understand what is happening with the keys. Finally got it. Beautiful demonstration, thank you!

@vaibhavrawat251 3 года назад

I finally understood this concept in depth! Thanks!

@muhammadjawadurrahim4883 3 года назад

Awesome explanation !!! Want to see more of these videos. Hope your channel blowsup

@MsLemons12 3 года назад

Perfect explanation. I just got nailed by this on my first junior dev interview 😔

@sthefanocarvalho2823 3 года назад

Awesome! This perfectly explains why this is so important for React. Thanks for sharing :)

@ffedchik 3 года назад

I am curious about why the hell Chaim's video playbacks are always on default 1.5 speed indstead of normal 1.0?

@art4thesoul 2 года назад

I'm guessing that your excellent way of reasoning and explaining comes from the way of studying rabbinical discourse ;) --- love it!

@CodingWithChaim 2 года назад

Could very well be! This is probably my favorite comment I have gotten yet, so thank you!

@MaRy1988 3 года назад

Your channel is a treasure! Please, make more videos🙏

@CodingWithChaim 3 года назад

Videos starting up again real soon

@cassioscabral 3 года назад

Man, your videos are great. Really appreciate it. Thanks for sharing!

@ironheadmedia1625 2 года назад

Eminem teaches why keys are important in React, lol :) Thanks for the video , you really helped me to understand better.

@damo190 2 года назад

Omg. Such a beautiful explain !!!

@jonahg6564 3 года назад

Another amazing and quality vid! Thanks!

@harshitchawla1991 3 года назад

Amazing explanation 👍🏼 just a word of advice if you want to reach out more people in countries where English is no the primary language, speak a little slowly .

@sanjarcode Год назад

Identity. The word I was looking for. It's also used to force remount a component, BTW.

@masoudf46 2 года назад

Excellent explanation, thank you.

@brunokozina4361 3 года назад

I feel like I am at the auction ... tnx for the explanation btw. :)

@27455628 2 года назад

Definitely one of the best rapping performance from a programmer 😀

@aashayamballi 3 года назад

Very informative! Thank you 🙏🏼

@CodingWithChaim 3 года назад

You’re most welcome!

@music_around_us7154 Год назад

so does it checks only the key and not the data if so then we it should be displaying the wrong output .The output should now be 1 to 9 as there keys are same and the last 10 should not be displayed as there are 9 items to be mapped.

@zlackbiro 3 года назад

You can use key={"element" + index}, and thats good, for the next group of elements in your jsx, use key={"group2" + index). You can combine key={el.name + index} If you need specific element to render on every component update, you can use key={Date.now()+index}

@bltz5058 3 года назад

Such as good explaination thank you .

@ghostrgp01 3 года назад

It makes sense now, thank you!

@mosheritterman3472 3 года назад

Glad you threw in a Cars (object) example ;)

@CodingWithChaim 3 года назад

I wasn’t gonna let you down

@developerfriendly 3 года назад

Hi Chaim, thanks for the video. What is your opinion on Angular? Can you also do videos about Angular?

@CodingWithChaim 3 года назад

I have never used angular, and I don't see that happening in the near future unfortunately. There are things that seem more exciting to me personally that I want to dive into

@akashsxo 3 года назад

What is the "any type" warning in typescript jsx ?

@aakashsrivastava5557 3 года назад

Great great great....Thanks a lot :)

@geopadu Год назад

This is so cool!

@roprop7339 3 года назад

אח יקרר מאיפה אתה?

@Teteu.freitas 3 года назад

Nice Video!

@endernator 2 года назад

what do you have on your head?

@min-of8cv 3 года назад

Just found your channel & realized that you haven't uploaded new content for months..

@jonahg6564 3 года назад

Is that a new mic? It sounds so good

@CodingWithChaim 3 года назад

Thanks! Actually not a new mic, I just finally started taking the time to learn how to use the thing! Turns audio is a beast to learn about and there is so much more to learn

@jonahg6564 3 года назад

@@CodingWithChaim it sounds amazing. Def heard the difference! Keep it up 👏🏼

@HimanshuKumar-xz5tk 3 года назад

Wonderful!!!!!!!!!!

@serjio8781 3 года назад

what if I don't really have anything else that's unique?? No ids or anything like that

@CodingWithChaim 3 года назад

You can use an id generation library like uuid

@serjio8781 3 года назад

@@CodingWithChaim is there a chance that's it's gonna generate something that's not unique? like if I have a huuuge array which has thousands of elements or that's absolutely excluded?

@CodingWithChaim 3 года назад

Yea thats technically possible, but super unlikely.

@serjio8781 3 года назад

@@CodingWithChaim Thanks man. Great stuff as always. I didn't even know It's not a good idea to use indexes. I just wanted to feed it something so the annoying warning would shut up xD

@urge-bull 3 года назад

why aren't you making video. Closed this channel?

@CodingWithChaim 3 года назад

Already have a few new videos in the works. Should be getting back to it in the near future

@urge-bull 3 года назад

@@CodingWithChaim Glad to know. As i have learened alot from you con tent. 🔥

@akhil.r4747 3 года назад

Your explanation is good but you are saying very fast please from next video try to explain slowly

@MN-fl3hb 3 года назад

Play at 0.75 for english.....

@emmanuelibe1896 2 года назад

You are too fast😅

@ivancastillo3893 3 года назад

Your devTools that you're telling us to look at in your video, are literally not being shown in your video lol. I didn't understand what you were talking about. Might've helped me a lot if I could actually see your devTools :)