React JS Interview Questions ( Stepper ) - Frontend Machine Coding Interview Experience

Поділитися
Вставка
  • Опубліковано 8 лют 2025

КОМЕНТАРІ • 96

  • @RoadsideCoder
    @RoadsideCoder  Рік тому

    🟪 Get my Complete Frontend Interview Prep course - roadsidecoder.com/course-details
    🔴 OdinSchool React Web Development Course. Apply now - hubs.la/Q02kCrvk0
    ➡ Book an Interview Preparation call with me ( 20% OFF for limited time ) - topmate.io/roadsidecoder

    • @balajiaadi1901
      @balajiaadi1901 11 місяців тому

      Brother please create a search functionality like a industrial way in reactjs ❤ your videos and really helpful for me thanks

  • @bhaskarbhandari6476
    @bhaskarbhandari6476 11 місяців тому +4

    can you please explain the complex steps in a easy way so that all can understand otherwise only few can understand. i know the length of the video will increase but i guess this is the best teaching style that a teacher should know.

  • @MuhammadAdnan2.0
    @MuhammadAdnan2.0 Рік тому +7

    Practical interviews questions should be like this,,, 👍 👌 ❤

    • @javabrain8480
      @javabrain8480 Рік тому +4

      Yes not those jee like dsa questions.

  • @RavindraSingh-lp9pl
    @RavindraSingh-lp9pl Рік тому +1

    Superb video bro....majaa aagya

  • @g-ytub
    @g-ytub Рік тому +1

    extremely useful for candidates. thank you so much.

  • @arain-v9d6p
    @arain-v9d6p 11 місяців тому

    i come from techical suneja yt channel I watch Complete podcast and I learn a lot of things from your podcast such a wonderful podcast love from Pakistan

  • @shahzaib715
    @shahzaib715 11 місяців тому

    Amazing part for calc the dynamic width to osm bro, love u from Pakistan

  • @Mainak908
    @Mainak908 Рік тому

    Very useful video bro...keep sharing such informative content ❤

  • @mowabro227
    @mowabro227 23 дні тому

    Thank you so much!!

  • @nallaparajuamareshvarma8471
    @nallaparajuamareshvarma8471 Рік тому +5

    can you explain the logic of setting the progress bar width couldn't understand probably write a blog it would be helpful

    • @FranklynKogolo
      @FranklynKogolo 8 місяців тому +2

      So for the progress bar you have to to space the '100%-$' line like this: "calc(100% - $". With this spacing it should work

    • @kamalyadav3567
      @kamalyadav3567 3 місяці тому

      Ye banda har videos me bas dusri screen se dekh dekh ke code likhta hai kuch samjhaata nhi h

    • @krithik9961
      @krithik9961 Місяць тому

      Thx​@@FranklynKogolo

  • @deep90402
    @deep90402 11 місяців тому +2

    Please make videos on react interview questions
    ( theory and concepts based)for fresher level.as I m a fresher I don't have any idea about it.

    • @RoadsideCoder
      @RoadsideCoder  11 місяців тому

      I am bringing a complete course on it!

  • @ranveerrajput8101
    @ranveerrajput8101 Рік тому

    Thanks for sharing such valuable content.

  • @63Phyuphyu2
    @63Phyuphyu2 11 місяців тому

    Thanks. Your videos are so informative.

    • @RoadsideCoder
      @RoadsideCoder  11 місяців тому

      Thanks! I have created an indepth course covering all such topics - roadsidecoder.com/course-details

  • @tarundurbha5398
    @tarundurbha5398 Місяць тому

    Thank you Bayya

  • @_booleanValue
    @_booleanValue 11 місяців тому

    Very informative thanks a lot

  • @NikhilPatel-bq7ck
    @NikhilPatel-bq7ck Рік тому +3

    First of all Thanks for making such videos. It's something that people will be referring.
    Just one point I personally felt, that wouldn't it be much better if the component would be a type of Composite Component.

  • @coolwithsaquibaquib
    @coolwithsaquibaquib Рік тому +1

    Can u explain about the use of ref @ 16:10 as I'm unable to understand the ref={ele => stepRef.current[index]=ele } from where ele parameter is coming?

    • @RoadsideCoder
      @RoadsideCoder  Рік тому +2

      u can name "ele" to anything, it just means the current element's ref for the map loop we are already in/

  • @amarchinta4463
    @amarchinta4463 11 місяців тому +2

    why reactjs introduced functional components why the rewrite entire code for functional components ? can u please make a video on that or simply answer. thank you

  • @namratadas5569
    @namratadas5569 Рік тому

    Great video.., could u plz do a video on multistep forms in react..by making the inputs and forms reusable and also adding validations. It would be of great help. Thanks in advance.

  • @jahangirkhan3747
    @jahangirkhan3747 Рік тому

    Another useful and easy to understand tutorial ❤❤❤
    Bro do you have any paid course for DSA using Javascript?

  • @pavankalita1
    @pavankalita1 11 місяців тому

    Very nice discussion. What are your view on "VueJs". I feel more comfortable with "VueJs" than "ReactJs".

  • @rajangupta1554
    @rajangupta1554 10 місяців тому +1

    sir please explain logic rather than writing code faster

    • @RoadsideCoder
      @RoadsideCoder  10 місяців тому +1

      Which part u didnt understand?

  • @kashmirtechtv2948
    @kashmirtechtv2948 3 місяці тому

    I SAW THTA YOU USE MULTIPLE CONDITIONS WHEN THE CONDITON COULD BE SATISFOED BY ONLY 1 CONDITION,, CAN YOU PLEAE EXPLAIN THAT???? 11:16

  • @MiteshSrinivasBirru
    @MiteshSrinivasBirru 4 місяці тому

    at worst case, we can do as a engineer is jugaad., as you did with parogess width.

  • @sourabhkulkarni9012
    @sourabhkulkarni9012 Рік тому +2

    Hi,I cloned this project from github repo but Ibam not able to see the progress bar, could you please help me with the same

    • @MarlonEnglemam
      @MarlonEnglemam 9 місяців тому +1

      he probably missed something on the code he put up on github. I coded based on the video and it worked well, when I copied and pasted the code from github I had the same issue.

    • @DeepakPoojary
      @DeepakPoojary 3 місяці тому

      exactly same issue

  • @yashramdeo5510
    @yashramdeo5510 Рік тому

    Please make a video on WebRTC for file transfer

  • @bharathnaidu4636
    @bharathnaidu4636 Рік тому

    Useful information

  • @Aviralsingh-yw7xx
    @Aviralsingh-yw7xx Рік тому

    Sir amazing content. Can you make an Infinite scroll question-answer.

  • @aashish_stanl
    @aashish_stanl 11 місяців тому +2

    I see only 1 person asked about the progress bar not working excluding me.

    • @FranklynKogolo
      @FranklynKogolo 8 місяців тому +1

      So for the progress bar you have to to space the '100%-$' line like this: "calc(100% - $". With this spacing it should work

    • @DeepakPoojary
      @DeepakPoojary 3 місяці тому

      found fix: correct code
      width: `calc(100% - ${margins.marginLeft + margins.marginRight}px)`, ( notice the space around the '-' symbol)

  • @malliswarithungala
    @malliswarithungala 11 місяців тому +1

    Progress bar is not visible... please suggest me

    • @DeepakPoojary
      @DeepakPoojary 3 місяці тому +1

      same issue

    • @DeepakPoojary
      @DeepakPoojary 3 місяці тому

      found fix: correct code
      width: `calc(100% - ${margins.marginLeft + margins.marginRight}px)`,

  • @028-manikandan3
    @028-manikandan3 Рік тому

    In this stepper component was my task for in my company 😅

    • @prathameshdichwalkar2477
      @prathameshdichwalkar2477 Рік тому

      how did you did it?

    • @028-manikandan3
      @028-manikandan3 Рік тому

      @@prathameshdichwalkar2477 current state, previous and next state,this are the interface not state but the I put logic is video logic state create that value increase according to index > 0

    • @028-manikandan3
      @028-manikandan3 Рік тому

      @@prathameshdichwalkar2477 but I am not completed.he is completed.

  • @amanshlko
    @amanshlko 9 місяців тому

    Can you pls make a video on snake and ladder game in React ?

  • @kiranmahajan778
    @kiranmahajan778 10 місяців тому

    In the CHECKOUT_STEPS config , Is the Component property in the object just a simple function that returns a div or is it some react synatx?

    • @RoadsideCoder
      @RoadsideCoder  10 місяців тому

      U can name it anything, its just a state

  • @Solo_playz
    @Solo_playz Рік тому

    Why don't you write code in typescript?

  • @manojdparmar
    @manojdparmar Рік тому +2

    Everything is fine except one thing, you teach very quickly, which seems a bit difficult to understand. This is my experience, which I am sharing with you. Please pay some attention to this also.
    thank you

  • @sudhirme101
    @sudhirme101 Рік тому

    stepper source code is not yet pushed in github . kindly do it☺

  • @roshanjoshua
    @roshanjoshua 6 місяців тому

    the code and information is really good, but the explanation sounds so complicated. Being a react developer, I couldnt follow you post half of the video. It'd be great if you could slightly slow down while explaining why youre using any particular line, especially calculating the marginLeft attributes

  • @Dev-Phantom
    @Dev-Phantom 7 місяців тому

    cool

  • @MuhammadAdnan2.0
    @MuhammadAdnan2.0 Рік тому

    Mix up Typescript in these interviews thanks..

  • @prathameshdichwalkar2477
    @prathameshdichwalkar2477 Рік тому

    hiii bro how you come up with such logic?

  • @karann3335
    @karann3335 11 місяців тому +1

    50k id too high ... in udemy you will get in 500 rs

  • @KrunalKRG0212
    @KrunalKRG0212 Рік тому

    💖💖

  • @harshverma8580
    @harshverma8580 Рік тому +2

    Aapka progress bar ko align krne ka tareeka thoda kezual h

  • @nagalakshmichelluri8227
    @nagalakshmichelluri8227 3 дні тому

    Provide full code sir

  • @stiphenrobert4469
    @stiphenrobert4469 Рік тому

    Bro you are beauty

  • @bhaskarbhandari6476
    @bhaskarbhandari6476 11 місяців тому

    very overwhelmed and i didn't got it properly 😢😢😢😢😢😢😢😢😢😢

  • @GG-yg2wt
    @GG-yg2wt 11 місяців тому

    Alpha Clasher

  • @abhinavchandurkar1961
    @abhinavchandurkar1961 Рік тому +12

    React is a library and not a framework

    • @ManoharBatra
      @ManoharBatra Рік тому +2

      slip of tongue bhi ho skta hai na

    • @jitxhere
      @jitxhere Рік тому +7

      Not the end of the world if you say it wrong

    • @mijana961
      @mijana961 Рік тому +1

      Chup be

    • @pankajbeniwal988
      @pankajbeniwal988 Рік тому +6

      Kya farak pdta hai framework ya library, he knows how to build stuff thats it

    • @MrCoder-u9y
      @MrCoder-u9y Рік тому

      UI library!

  • @andrewwall2730
    @andrewwall2730 6 місяців тому

    Sorry, way too complex for an online code challenge.

    • @RoadsideCoder
      @RoadsideCoder  6 місяців тому +1

      This is how u get a >100k Job 👀

  • @manojsatwase
    @manojsatwase Рік тому +1

    small bug
    const calculateProgressBarWidth = () => {
    return Math.round(((currentStep - 1) / (stepsConfig.length - 1)) * 100);
    };

    • @chandanmishra1386
      @chandanmishra1386 11 місяців тому +2

      still progress bar is not becoming visible. Are you also facing the same issue?

    • @chandramanikumar8559
      @chandramanikumar8559 10 місяців тому

      DO you get the solution?@@chandanmishra1386

    • @bapanghosh-rq1uh
      @bapanghosh-rq1uh 9 місяців тому

      ​@@chandanmishra1386 .progress-bar {
      position: absolute;
      top: 25%;
      left: 0;
      width: 100%; /* Ensure the progress bar spans the entire width */
      height: 4px;
      background-color: #ccc;
      z-index: 1; /* Set a higher z-index to ensure it's above the step numbers */
      }
      change this one .. then it will work

    • @akash_gupta_2090
      @akash_gupta_2090 9 місяців тому

      @@chandanmishra1386 width: `calc(100% - ${margins.marginLeft + margins.marginRight}px)`, there should be space between 100% "space" - "space". then $

  • @killheist173
    @killheist173 Рік тому +1

    Could you please make a complete React.js tutorial? Because I am learning it from you only. Well, online, all concepts are spread. It is not in an organized way.

  • @parikshitgupta343
    @parikshitgupta343 10 місяців тому

    No point doing
    {currentStep === stepsConfig.length ? "Finish" : "Next"}
    If you're not rendering it
    {!isComplete && (