PROPS in React explained 📧

Поделиться
HTML-код
  • Опубликовано: 24 ноя 2024

Комментарии • 143

  • @BroCodez
    @BroCodez  Год назад +41

    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 Год назад +7

      No word you man priceless help!

    • @arpanshah355
      @arpanshah355 Год назад +5

      @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
    @andredubbs4854 Год назад +59

    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

  • @ursusrursus9325
    @ursusrursus9325 Год назад +12

    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."

  • @codewithdahir
    @codewithdahir Год назад +10

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

  • @wilmermedina7258
    @wilmermedina7258 5 месяцев назад +2

    Bro, just 12 minutes was enough to perfectly understand this topic. I've watched several videos about it, but this one is just perfect. Thanks a lot!

  • @malikgulraiz3659
    @malikgulraiz3659 Год назад +14

    We want more React tutorials from bro
    👇

  • @AC_Music
    @AC_Music 9 месяцев назад +2

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

  • @romyt9816
    @romyt9816 Год назад +1

    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.

  • @sulaimanmisri6411
    @sulaimanmisri6411 9 месяцев назад +2

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

  • @sarahwbas
    @sarahwbas 5 месяцев назад

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

  • @tonytodd7011
    @tonytodd7011 Год назад +2

    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
    @frankmccann29 Год назад +1

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

  • @Ji.Hikari
    @Ji.Hikari 2 месяца назад

    Omg, best video I've seen about props AND with extra useful informations ! Thanks a lot.

  • @ff4937
    @ff4937 Год назад +1

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

  • @guilhermecarvalho1167
    @guilhermecarvalho1167 Месяц назад

    Dear @Broce, I am immensely grateful for an exceptionally didactic class. Even though it was something simple, it made a lot of difference. Thanks

  • @vivekyadav2566
    @vivekyadav2566 Месяц назад

    you explained in very simple & clear langauge..thanks..loved it 🏴‍☠

  • @malikgulraiz3659
    @malikgulraiz3659 Год назад +1

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

  • @aroshm1682
    @aroshm1682 7 месяцев назад

    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!!

  • @beqagagua
    @beqagagua 3 месяца назад

    Love you videos , easy to understand and is also easy to repeat with you at the same time .

  • @deitunegold4593
    @deitunegold4593 8 месяцев назад

    First tutorial i watched and i understood thoroughly 🔥

  • @hunin27
    @hunin27 Год назад +1

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

  • @techguykay
    @techguykay Год назад +1

    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 Год назад

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

  • @abdulkadiraminu262
    @abdulkadiraminu262 Год назад +4

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

    • @BroCodez
      @BroCodez  Год назад +5

      I'm from the future

    • @ImAbbasious
      @ImAbbasious 10 месяцев назад

      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 RUclips bring more than Degrees@@BroCodez

  • @vishalboudhh
    @vishalboudhh Год назад +2

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

  • @cubingwithshine180
    @cubingwithshine180 Год назад +1

    Thank you so much for this awesome tutorial

  • @mohamedreda6299
    @mohamedreda6299 Год назад

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

  • @magomihaly1741
    @magomihaly1741 Год назад

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

  • @ykfazzz
    @ykfazzz Год назад

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

  • @annahuzair4671
    @annahuzair4671 2 месяца назад

    This video is so cool...thank you! For explaining so well

  • @wisdomsamuel-pe2fm
    @wisdomsamuel-pe2fm Год назад

    God 🎉 bless you.. This is excellently explained 😊

  • @hunin27
    @hunin27 Год назад +2

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

  • @ulbiomanzano7395
    @ulbiomanzano7395 Год назад +2

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

  • @Rae_895
    @Rae_895 Год назад +4

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

    • @juanmacias5922
      @juanmacias5922 Год назад +1

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

    • @juanmacias5922
      @juanmacias5922 Год назад +1

      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;

  • @ahamedsha_jr
    @ahamedsha_jr Год назад

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

  • @DrClappinCh33ks
    @DrClappinCh33ks 10 месяцев назад

    Extremely great presentation ❤

  • @kevz_codes
    @kevz_codes 9 месяцев назад

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

  • @dark_camper83
    @dark_camper83 7 месяцев назад

    Nice explanation buddy. Thank You!!!

  • @BrianMwaura-p1q
    @BrianMwaura-p1q 9 месяцев назад

    Amazing content, Thank you. God bless

  • @keisergg8701
    @keisergg8701 Год назад

    thanks a ton! u are amazing
    pls keep uploading.

  • @shubhamrathod9249
    @shubhamrathod9249 2 месяца назад

    My suggestion is to also tell why it's necessary to use props and what will happen if we don't use it.

  • @SatyabrataOjha-mr5nr
    @SatyabrataOjha-mr5nr 8 месяцев назад

    Wow, just nice explanation, love it

  • @face_realitiy
    @face_realitiy 5 месяцев назад +1

    Excellent ❤❤❤

  • @peaceomole
    @peaceomole 2 месяца назад

    Thank you for this!!!
    You made it so simplified
    When using props for cards
    How can I add an image to just one card

  • @1750-q4y
    @1750-q4y Год назад +2

    Be like bro code
    Absolutely legendary BROgramer

  • @nihongo_
    @nihongo_ Год назад

    thanks a million bro

  • @rbcookingchannel-cg7xs
    @rbcookingchannel-cg7xs 24 дня назад

    Nice sharing

  • @hariprasad361
    @hariprasad361 21 день назад

    ❤ very nice explanation sir

  • @keisha7586
    @keisha7586 8 месяцев назад

    Thanks! clear presentation

  • @theavalontech
    @theavalontech 9 месяцев назад

    Awesome Explanation bro

  • @shivanshuhere
    @shivanshuhere 11 месяцев назад

    clean and simple , loved it
    🌮

  • @Odidi_Bee6ix
    @Odidi_Bee6ix Год назад

    Exquisite 🙌🏾

  • @JoseSanchez-wg7pe
    @JoseSanchez-wg7pe 11 месяцев назад

    tysm, you really helped me with this topic

  • @balusubramaniam2335
    @balusubramaniam2335 8 месяцев назад

    nice viedo very infornative ✌

  • @GATIF786
    @GATIF786 Год назад

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

  • @professorpoke
    @professorpoke 3 месяца назад

    This video helped me. Thanks 👍👍

    • @professorpoke
      @professorpoke 3 месяца назад

      I checked your account. And its an instant subscribe from my side. Hoping great content from your side.

  • @Cet.w1p
    @Cet.w1p Год назад +1

    Thank you soo much i love ur videos

  • @JafarbeXudoyqulov
    @JafarbeXudoyqulov Год назад +1

    Perfect

  • @piouf9850
    @piouf9850 8 месяцев назад

    easy to understand , thank u

  • @bilalshahid5118
    @bilalshahid5118 4 месяца назад +1

    bro in react 18 in defaultProps its gives warning

  • @oussemaelmzergui7055
    @oussemaelmzergui7055 Год назад

    You never miss

  • @DimitrisKoliomichalis
    @DimitrisKoliomichalis Год назад

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

  • @riticklath6413
    @riticklath6413 Год назад

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

  • @shubhamrathod9249
    @shubhamrathod9249 2 месяца назад

    nicely explained

  • @hongdevp
    @hongdevp Год назад

    Thanks your tutorial ❤

  • @ThatOnlyArab
    @ThatOnlyArab Год назад +1

    YOUR BACK 🎉🎉🎉🎉

  • @d1ce966
    @d1ce966 Год назад

    Thank you bro more react videos

  • @kamaleshpramanik7645
    @kamaleshpramanik7645 24 дня назад

    Thank you very much Bro ..

  • @prakashnavin6245
    @prakashnavin6245 2 месяца назад

    really best explanation of this topic
    @BroCodez is the best

  • @silverfoxcr5194
    @silverfoxcr5194 Год назад

    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 ❤

  • @vladyslav-py-js-cs
    @vladyslav-py-js-cs Год назад

    Nice lesson!😁

  • @DeepikaDecodes
    @DeepikaDecodes Год назад

    Amazing 👏

  • @alwaysgrowww
    @alwaysgrowww Год назад +1

    cool video bro!

  • @4thGe
    @4thGe 12 дней назад

    Thank you!

  • @benhur221
    @benhur221 Год назад

    props to you Bro

  • @arealmemeist6421
    @arealmemeist6421 Год назад +1

    'props' to you for making this video lol

    • @BroCodez
      @BroCodez  Год назад +2

      I loled at that one

  • @namesjeff5213
    @namesjeff5213 Год назад +1

    👑

  • @jiazhiong8273
    @jiazhiong8273 Год назад

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

  • @acosmic7841
    @acosmic7841 Год назад

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

  • @_sf_editz1870
    @_sf_editz1870 Год назад

    sensei waiting for the next video

  • @tukkinum
    @tukkinum 11 месяцев назад

    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!

  • @shadownerverdie
    @shadownerverdie Год назад

    so great

  • @3X1Z3
    @3X1Z3 Год назад +1

    Love u brooo❤

  • @yurisouza4874
    @yurisouza4874 5 месяцев назад

    Thanks Bro!

  • @otabekmadaminov-z2i
    @otabekmadaminov-z2i 2 месяца назад

    Thank you bro

  • @tonich81
    @tonich81 Год назад

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

  • @mawuenajoy9313
    @mawuenajoy9313 17 дней назад

    quick question. if we are to import App() in another function as the parent, how can the props be passed from the App() to its new parent since its now a child to that function?

  • @LoveandPeace1111
    @LoveandPeace1111 8 месяцев назад

    Live it

  • @khannah-k7y
    @khannah-k7y Месяц назад

    I just subscribed

  • @syramoran9270
    @syramoran9270 6 месяцев назад

    TY ❤

  • @JohnSamuelOlamide
    @JohnSamuelOlamide 19 дней назад

    Thanks

  • @antoniobanderas1287
    @antoniobanderas1287 5 месяцев назад

    perfect ;P

  • @pastuh
    @pastuh Год назад +1

    Strange why not called propDefaults

  • @aureusvisions
    @aureusvisions Год назад +1

    wow

  • @TheFenixus
    @TheFenixus 3 месяца назад

    Hey Bro and other bros,
    I am following the course along and I am a bit stubborn to use my onw examples. I am have managed to debug 99% of my practice application to this point but I am stuck when it comes to propTypes. I am doing the following
    Card.propTypes = {
    img: PropTypes.object,
    title: PropTypes.string,
    text: PropTypes.string,
    stressTester: PropTypes.bool,
    groupMembers: PropTypes.number,
    and all is well but I feel when it comes to images PropType should not be Object as I am getting the following error:
    Warning: Failed App.jsx[random_value]:10
    prop type: Invalid prop `img` of type `string` supplied to `Card`, expected `object`.
    Now I see that app is expecting the string and I set an object. Just want to know is there a prop type for image or I should just go with a string instead?
    Also Bro BIG thank your for all the knowledge that you are sharing.

  • @chakrounmohamedslim8748
    @chakrounmohamedslim8748 Год назад

    Please give us a blazor tutoriel after. Net 8

  • @tavidev
    @tavidev Год назад

    could you also make a deno fresh series?

  • @drididali1755
    @drididali1755 Год назад

    hoooks bro

  • @ImAbbasious
    @ImAbbasious 10 месяцев назад

    Sir, we need 10Hours React for total Begnner please

  • @Matheus-mr4tl
    @Matheus-mr4tl 4 месяца назад

    there is no need of import defaultProps in the Students.jsx file?

  • @thashreef2125
    @thashreef2125 Год назад

    waiting for react Hooks and CRUD operations