PROPS in React explained 📧

#React #JavaScript #tutorial
00:00:00 introduction
00:00:56 props
00:04:49 index.css
00:06:28 multiple components
00:07:49 propType
00:10:18 defaultProps
00:11:47 conclusion
// props = read-only properties that are shared between components.
// A parent component can send data to a child component.
// key=value
// propTypes = a mechanism that ensures that the passed value
// is of the correct datatype.
// age: PropTypes.number
// defaultProps = default values for props in case they are not
// passed from the parent component
// name: "Guest"

Пікірлер: 116

  • @BroCodez
    @BroCodez8 ай бұрын

    import Student from './Student.jsx' function App() { return( ); } export default App import PropTypes from 'prop-types'; function Student(props){ return( Name: {props.name} Age: {props.age} Student: {props.isStudent ? "Yes" : "No"} ); } Student.propTypes ={ name: PropTypes.string, age: PropTypes.number, isStudent: PropTypes.bool, } Student.defaultProps = { name: "Guest", age: 0, isStudent: false, }; export default Student .student{ font-family: Arial, sans-serif; font-size: 2em; padding: 10px; border: 1px solid hsla(0, 0%, 50%, 0.8); } .student p{ margin: 0; }

  • @thecoder1694

    @thecoder1694

    8 ай бұрын

    No word you man priceless help!

  • @arpanshah355

    @arpanshah355

    8 ай бұрын

    @BroCodez !!!! nice to know your not dead :D also, could you do a toutorial for C/C++ windows (kinda like tkinter for python) thx good job on your vids though, helped me a lot. :) super simple and easy to understand otherwise, the perfect combo for beginers

  • @andredubbs4854
    @andredubbs48548 ай бұрын

    I really cannot express how much of a positive impact you’re having on the world. Your videos helped me immensely, the education is poor in my country and i can make it up alot with your videos

  • @codewithdahir
    @codewithdahir8 ай бұрын

    You are so good man, keep going. My whole front end development belongs to you. Thanks a lot.

  • @malikgulraiz3659
    @malikgulraiz36598 ай бұрын

    We want more React tutorials from bro 👇

  • @ursusrursus9325
    @ursusrursus93258 ай бұрын

    Thanks Bro! You are one of those about whom philosophers have said: "The obvious is something that no one sees until someone expresses it in the simplest way."

  • @ff4937
    @ff49377 ай бұрын

    Excellent overview of PROPS!!! Very clear and concise! Please keep going.

  • @AC_Music
    @AC_Music4 ай бұрын

    blessed to have you as a mentor. A thank you is not enough! Much love ❤

  • @tonytodd7011
    @tonytodd70117 ай бұрын

    Thanks Bro! You are really an awesome teacher, and your way of dividing the topic into small lessons are great! That is very much more practical for people to learn than watching a dozens of hours video!

  • @frankmccann29
    @frankmccann298 ай бұрын

    Hey, appreciate you popping in with a great video. Saved it.

  • @sarahwbas
    @sarahwbas19 күн бұрын

    You are an amazing teacher!! No one should teach coding after you!! 👏🏼👏🏼 Thank you for existing!

  • @abdulkadiraminu262
    @abdulkadiraminu2628 ай бұрын

    😭dude idk how u knew I was just learning react but thank you for the videos.

  • @BroCodez

    @BroCodez

    8 ай бұрын

    I'm from the future

  • @ImAbbasious

    @ImAbbasious

    5 ай бұрын

    pls make 10hours tutorial of React.js from Beginner to Expart please and please sir, can't pay for tuitions fee but bro code on KZread bring more than Degrees@@BroCodez

  • @aroshm1682
    @aroshm16822 ай бұрын

    Broo!!! I learned crazy loads of stuff in this 12 mins than I try to learn past 24 hours. Damn good content bro!! Thank you!!

  • @cubingwithshine180
    @cubingwithshine1808 ай бұрын

    Thank you so much for this awesome tutorial

  • @hunin27
    @hunin278 ай бұрын

    Thanks! I just finished watching and I learned a lot from this ❤

  • @mohamedreda6299
    @mohamedreda62998 ай бұрын

    This series is awe-inspiring thank you a lot!❤❤❤❤❤❤

  • @sulaimanmisri6411
    @sulaimanmisri64114 ай бұрын

    I am relatively new to React.js and your explanation make sense and easy to follow. Kudos Bro!

  • @vishalboudhh
    @vishalboudhh8 ай бұрын

    I love your videos ❤ Very simple easy to understand And not to much time taking

  • @dark_camper83
    @dark_camper832 ай бұрын

    Nice explanation buddy. Thank You!!!

  • @magomihaly1741
    @magomihaly17418 ай бұрын

    Love your vids, focus on essence , easy to understand. Thank you Bro!

  • @keisha7586
    @keisha75862 ай бұрын

    Thanks! clear presentation

  • @romyt9816
    @romyt98167 ай бұрын

    The first video I see that explains clearly that props are an OBJECT and defines them with a punctual sentence and not with a vague terms or with comparisons like "parameter of a function" or "pseudo HTML attribute". Thanks, now I understand them better, I'll follow the serie.

  • @SatyabrataOjha-mr5nr
    @SatyabrataOjha-mr5nr2 ай бұрын

    Wow, just nice explanation, love it

  • @user-qj5bg3fp3r
    @user-qj5bg3fp3r4 ай бұрын

    Amazing content, Thank you. God bless

  • @DrClappinCh33ks
    @DrClappinCh33ks5 ай бұрын

    Extremely great presentation ❤

  • @deitunegold4593
    @deitunegold45933 ай бұрын

    First tutorial i watched and i understood thoroughly 🔥

  • @Coder_263
    @Coder_2634 ай бұрын

    Wow 😮so easy to understand! Thank you so much ☺️ I just subscribed ❤

  • @Odidi_Bee6ix
    @Odidi_Bee6ix7 ай бұрын

    Exquisite 🙌🏾

  • @balusubramaniam2335
    @balusubramaniam23353 ай бұрын

    nice viedo very infornative ✌

  • @hongdevp
    @hongdevp8 ай бұрын

    Thanks your tutorial ❤

  • @keisergg8701
    @keisergg87016 ай бұрын

    thanks a ton! u are amazing pls keep uploading.

  • @piouf9850
    @piouf98502 ай бұрын

    easy to understand , thank u

  • @shivanshuhere
    @shivanshuhere6 ай бұрын

    clean and simple , loved it 🌮

  • @JoseSanchez-wg7pe
    @JoseSanchez-wg7pe6 ай бұрын

    tysm, you really helped me with this topic

  • @volodyslove
    @volodyslove8 ай бұрын

    Nice lesson!😁

  • @ulbiomanzano7395
    @ulbiomanzano73958 ай бұрын

    Que fácil se hace aprender react con BroCode, muchas gracias, excelente trabajo.

  • @ykfazzz
    @ykfazzz8 ай бұрын

    please a full React course, even though i'm intermediate in React, your videos are ones i learn the most from

  • @wisdomsamuel-pe2fm
    @wisdomsamuel-pe2fm7 ай бұрын

    God 🎉 bless you.. This is excellently explained 😊

  • @malikgulraiz3659
    @malikgulraiz36598 ай бұрын

    My understanding for programming after watching Bros videos 📈📈📈❤

  • @d1ce966
    @d1ce9668 ай бұрын

    Thank you bro more react videos

  • @CodingChannel1
    @CodingChannel18 ай бұрын

    Amazing 👏

  • @techguykay
    @techguykay8 ай бұрын

    over 2 year ago i decided to change careers and learn coding, i started with your python videos, and today im an intern swe (mobile application development), currently learning react-native and still watch you Bro-Code. My programming Kinng 😤🙌 i wanna see more of this new seriesssss!!!

  • @HimanshuVermayohoho

    @HimanshuVermayohoho

    8 ай бұрын

    hey bro how did you get the job, can help me to know how you did it

  • @nihongo_
    @nihongo_7 ай бұрын

    thanks a million bro

  • @Rae_895
    @Rae_8958 ай бұрын

    After this pls make a typescript version since typescript is mostly used with popular js frameworks

  • @juanmacias5922

    @juanmacias5922

    8 ай бұрын

    I mean, I"ve been using TS, you just have to add the right typing, when the IDE screams at you. :D

  • @juanmacias5922

    @juanmacias5922

    8 ай бұрын

    This was my final code for Student.tsx: interface StudentProps { name?: string; age?: number; isStudent?: boolean; } const Student = ({ name = "Guest", age = 0, isStudent = false, }: StudentProps) => { return ( Name: {name} Age: {age} Student: {isStudent ? "Yes" : "No"} ); }; export default Student;

  • @AH_FS
    @AH_FS8 ай бұрын

    Thank you soo much i love ur videos

  • @alwaysgrowww
    @alwaysgrowww8 ай бұрын

    cool video bro!

  • @benhur221
    @benhur2217 ай бұрын

    props to you Bro

  • @shadownerverdie
    @shadownerverdie8 ай бұрын

    so great

  • @syramoran9270
    @syramoran927025 күн бұрын

    TY ❤

  • @hunin27
    @hunin278 ай бұрын

    Thanks Bro! I really needed this playlist completed as i need to learn react and you arrived just in time ! Respect ❤

  • @primordialatom1478
    @primordialatom14788 ай бұрын

    Nice

  • @user-cs6rz9jn8n
    @user-cs6rz9jn8n8 ай бұрын

    Perfect

  • @oussemaelmzergui7055
    @oussemaelmzergui70558 ай бұрын

    You never miss

  • @riticklath6413
    @riticklath64138 ай бұрын

    Waiting for it Thanks a lot bro ❤ Please make it bit quick 🙏

  • @3X1Z3
    @3X1Z38 ай бұрын

    Love u brooo❤

  • @ahamedsha_jr
    @ahamedsha_jr8 ай бұрын

    not gonna start the series until you complete it anyways for the algorithm 🔥🔥🔥

  • @ThatOnlyArab
    @ThatOnlyArab8 ай бұрын

    YOUR BACK 🎉🎉🎉🎉

  • @arealmemeist6421
    @arealmemeist64218 ай бұрын

    'props' to you for making this video lol

  • @BroCodez

    @BroCodez

    8 ай бұрын

    I loled at that one

  • @LoveandPeace1111
    @LoveandPeace11113 ай бұрын

    Live it

  • @antoniobanderas1287
    @antoniobanderas12878 күн бұрын

    perfect ;P

  • @_sf_editz1870
    @_sf_editz18708 ай бұрын

    sensei waiting for the next video

  • @drididali1755
    @drididali17557 ай бұрын

    hoooks bro

  • @namesjeff5213
    @namesjeff52138 ай бұрын

    👑

  • @Yesterday_i_ate_rat
    @Yesterday_i_ate_rat8 ай бұрын

    ❤❤

  • @_sf_editz1870
    @_sf_editz18708 ай бұрын

    sensei

  • @aureusvisions
    @aureusvisions8 ай бұрын

    wow

  • @user-ni9rs2wk4g
    @user-ni9rs2wk4g8 ай бұрын

    Can you do a video with a full course of Visual BASIC Programming language??

  • @tukkinum
    @tukkinum6 ай бұрын

    i love this, but i have a question. how would we go about different images for each student? ive tried to figure it out myself but to no avail. thanks!

  • @silverfoxcr5194
    @silverfoxcr51948 ай бұрын

    Bro you have to finish the Playlist in less than 3 months I'm doing my final computer science proj using React and I need your explanation ❤

  • @GATIF786
    @GATIF7868 ай бұрын

    Kindly, make a complete video on React Js and React Native (Including User Login Authention from Mysqli database).

  • @acosmic7841
    @acosmic78418 ай бұрын

    Are you making a longer react tutorial slated to release in 2024?😊

  • @Delicatamente
    @Delicatamente2 ай бұрын

    huge thanks!

  • @user-dz3lq5hb8m
    @user-dz3lq5hb8m8 ай бұрын

    Be like bro code Absolutely legendary BROgramer

  • @animatsuki5345
    @animatsuki53453 ай бұрын

    кайф!

  • @jiazhiong8273
    @jiazhiong82738 ай бұрын

    bro, pls make a full course on android mobile application programming, maybe with Java or Kotlin. Thank you for your courses!

  • @21Kqaile-
    @21Kqaile-8 ай бұрын

    W

  • @thashreef2125
    @thashreef21258 ай бұрын

    waiting for react Hooks and CRUD operations

  • @tavidev
    @tavidev8 ай бұрын

    could you also make a deno fresh series?

  • @tonich81
    @tonich817 ай бұрын

    Can you do nodejs tutorial 😆 Your videos its easy to understand

  • @tee-hee9553
    @tee-hee95538 ай бұрын

    The proptypes and the defaultprops does not have any color, beside white on my visual studio code what should I do ?, I know it's working but I want color to check if I type wrong or not please help

  • @pastuh
    @pastuh8 ай бұрын

    Strange why not called propDefaults

  • @ABM200_
    @ABM200_8 ай бұрын

    assalomu alaykum qales Muhiddin aka

  • @chakrounmohamedslim8748
    @chakrounmohamedslim87488 ай бұрын

    Please give us a blazor tutoriel after. Net 8

  • @darkworldgaming5580
    @darkworldgaming55808 ай бұрын

    bro bros voice change a lot in 2years

  • @lf00t
    @lf00t4 ай бұрын

    Bro, is there a way to enable autocomplete/ intellisense for prop.[dot] ... ? coming from java, this is really annoying and easy to make silly typos

  • @user-cs6rz9jn8n
    @user-cs6rz9jn8n8 ай бұрын

    Lessons

  • @Gunz1234
    @Gunz12348 ай бұрын

    I think yt spies me cuz I am on a course and I'm on the props part n this shows up

  • @dwwe-xt5ys
    @dwwe-xt5ys8 ай бұрын

    make a full couse on x86 assembly language

  • @ImAbbasious
    @ImAbbasious5 ай бұрын

    Sir, we need 10Hours React for total Begnner please

  • @fatouz5104
    @fatouz51048 ай бұрын

    How do you know I have a react project for college😭thank you

  • @adonissss1881
    @adonissss18818 ай бұрын

    Hi! I have a python project. And i want to create a gui for it. How do i? I dont know. Can you teach me or how do i learn it?

  • @hunin27

    @hunin27

    8 ай бұрын

    use a gui library for python

  • @adonissss1881

    @adonissss1881

    8 ай бұрын

    @@hunin27 how?

  • @noicefrog
    @noicefrog8 ай бұрын

    bro code is da besstt

  • @rodeotcd
    @rodeotcd8 ай бұрын

    This is

  • @focusedstudent464
    @focusedstudent4648 ай бұрын

    16th comment

  • @aletondaX
    @aletondaX8 ай бұрын

    Do you still love pizza?

  • @BroCodez

    @BroCodez

    8 ай бұрын

    always and forever

  • @protibadimon4169
    @protibadimon41698 ай бұрын

    Hey bro, can you help me by coding chess game?

  • @noicefrog
    @noicefrog8 ай бұрын

    bro code pls colab

  • @kaungkinzone2448
    @kaungkinzone24488 ай бұрын

    random comment 3.0

  • @noicefrog
    @noicefrog8 ай бұрын

    what

  • @emanueleconte506
    @emanueleconte5068 ай бұрын

    i'll ask you a full Java Spring Boot course

  • @mahamanebana4410
    @mahamanebana44104 ай бұрын

    You made my day. Thank you. What's your email ?