React JS Interview Questions ( Password Generator ) - Frontend Machine Coding Interview Experience

🔴 Get my Complete Frontend Interview Prep course - roadsidecoder.com/course-details
#JavascriptInterview #ReactInterview #ReactJS
React Interview Question on building Password Generator will be created in this video along with tips and tricks to tackle your React JS and JavaScript Questions in Frontend Machine Coding Interviews.
👤 Join the RoadsideCoder Community Discord -
/ discord
➡️ Book an Interview Preparation call with me ( 20% OFF for limited time ) -
topmate.io/roadsidecoder
🟪 Follow me on Instagram and u will clear your interview 🤓 -
/ roadsidecoder
🔗 Complete Data Structures and Algorithms with JS Course - • Data Structures and Al...
➡️ Source Code -
github.com/piyush-eon/fronten...
🔗 Frontend Machine Coding Interview Series -
• Frontend Machine Codin...
🔗 Map, filter and reduce -
• Javascript Interview Q...
🔗 Cars24 Interview Experience -
• Frontend Interview Exp...
🔗 Unacademy Interview Experience -
• Frontend Interview Exp...
🔗 Tazorpay Interview Experience -
• Frontend Interview Exp...
🔗 MERN Stack Tutorial with Redux -
• MERN Stack Project Tut...
🔗 React Beginner's Project Tutorials -
• React JS Project Tutor...
-------------------------------------------------------------------------
00:00 Intro
00:05 Problem Explanation
02:33 Initialise a new React App
03:03 Building the UI
13:15 Creating the States
15:55 Checkbox Selection Logic
17:04 IMPORTANT ANNOUNCEMENT
17:38 Password Generation Logic
17:42 Creating a Custom Hook
18:15 usePasswordGenerator Custom Hook
21:58 Password Character Set Generation
24:02 Picking Random Characters to generate Password
26:02 Error Handling
28:52 Copy Password Logic
31:56 Password Strength Checker Component
37:06 Optimising Our Code
37:58 Refactoring Button Component
40:30 Refactoring Checkbox Component
-------------------------------------------------------------------------
⭐ Support the channel and learn from me One on One -
/ @roadsidecoder
Special Thanks to our members -

[@RoadsideCoder]

🔴 Get my Complete Frontend Interview Prep course - roadsidecoder.com/course-details 🟪 Follow me on Instagram and u will clear your interview 🤓 - instagram.com/roadsidecoder/ ➡ Book an Interview Preparation call with me ( 20% OFF for limited time ) - topmate.io/roadsidecoder

[@sush4617]

The kind of efforts you make to put better videos every time is outstanding. More power to you sir

[@pjagannadham2540]

bro i just loved it. Your explanation and code readability is really awesome . take a bow bro

[@XLR8_Coding]

Thanks Bro..! aapke efforts ko Salaam he..!!!!!

[@pushpabhandari619]

Helpful!! Thank you

[@chilibasil8496]

Great tutorial! I hope I did the re-factoring that make the code cleaner. While I'm doing it by myself, I also considered selecting checkbox affects password strength.

[@RoadsideCoder]

Good Job!

[@JulioDx3480]

Thanks! Very helpful

[@itsMohak]

Very magnificent.

[@RavindraSingh-lp9pl]

please make more such videos of machine coding.

[@_jameelmohd756]

Bhai app legend hou.

[@casull6447]

I think there is some bug 😀 You pick random index and it's not guaranteed to cover all options (uppercase, lowercase ,symbol, number)

[@neomaedits]

Yea

[@imkir4n]

AWesoMe

[@yashramdeo5510]

Can u pls make a video on data visualization in React JS for dashboard. And how to implement multiple charts on the same component.

[@mostakahamed6169]

Amazing one.👍

[@RoadsideCoder]

Thanks ✌️

[@ashutoshtripathi8257]

bhai ek full fledged course launch krdo for frontend interview .... we are ready to pay

[@dailyPractice1]

After going through your JavaScript interview questions series, I was literally waiting for React. Thanks a lot 🥰

[@abc-ys1ww]

sir can you pls tell me why you use Label tag to display "Character Length and 4 " at 7:24

[@arupupopadhyay4214]

This is a task for at least 2 sprints, and you did it over a video ? PM will be extremely happy.

[@RoadsideCoder]

yes 😎

[@rishabsharma5307]

2 sprints is way too much for this simple task

[@sdaaz792]

can someone tell me one thing what is used in vscode to select some tags and close them with curly brackets like he did?

[@KanishkaMrunal]

great

[@gyankibaatein798]

@RoadsideCoder could you plz make a video by explaining how to push code from sandbox to github in reactjs

[@rajatpratapsingh3123]

good

[@awais_ansarii]

❤

[@thisishabib744]

Plz make react testing library video video ❤❤ love form Bangladesh 🇧🇩🇧🇩

[@pavankarnati1555]

can i undwestand it without knowing concepts

[@annusingh4694]

Is it to be made live in the interview? Or is it a take-away assignment?

[@RoadsideCoder]

Live

[@JassPlayz_]

Bhaiya redux toolkit pe video bnao plz

[@harshads530]

navigator.clipboard.writeText(password) .then(() => { setCopied(true); setTimeout(() => { setCopied(false); }, 1000); }) .catch((error) => { alert('Error copying text to clipboard:', error); }); Iam not able to copy the password to clickboard why is that so? For me error alert pops up when tried to debug.

[@zerotoherofacts7106]

Give permission to clipboard from chrome setting

[@aaryansj8016]

Anime Fan spotted..!!!😂😂Eren Yeager..!!Loved video man

[@RoadsideCoder]

Haha yeah, Thanks ❤️

[@arkadas2634]

How is the UI getting updated when heis changing the slider for length witout use effect hook! Can anyone explain!

[@RoadsideCoder]

use effect is not used for updating the UI, react handles this internally using state variabled

[@arkadas2634]

Okay. Actually I am trying to simulate this... But somehow when i changr length its not updating the generate password

[@ezekieloyedijo8864]

Really appreciate this. Wanted to join the discord community, but the link is now invalid

[@RoadsideCoder]

here u go - discord.gg/2ecgDwx5EE

[@ezekieloyedijo8864]

@@RoadsideCoder Thanks a lot

[@user-zl2ph2pk3x]

I am getting this error while copy the password "Could not get the stack frames of error: Error: The error you provided does not contain a stack trace."

[@hiteshjagwani1458]

did you fin a soln??

[@ironman-29]

How much time they will give to build this app in interview?

[@RoadsideCoder]

Usually 1 - 2 Hours

[@6.squash.936]

we are waiting for the next dsa video

[@RoadsideCoder]

On the way!

[@devathul]

So this we need to build live and the interviewer will wait for us to complete it?

[@RoadsideCoder]

yes, under 1 or 1.5 hour

[@devathul]

@@RoadsideCoder thanks man , great work

[@show_me_the_moneyy]

Always strike gold here

[@adityaayare8680]

Tatakae Tatakae! 😂

[@prashlovessamosa]

Can we get more videos.

[@RoadsideCoder]

Yes, soon

[@prashlovessamosa]

@@RoadsideCoder thanks will wait.

[@aamirhannan890]

CTC kyaa thaa is company ka?

[@RoadsideCoder]

25L

[@tkz6585]

You have many error in the code , Don't post videos without fixing them and you should split the components in first place not in the end of the of video , Beginners will understand nothing 🤷🤷

[@RoadsideCoder]

which error?

[@parassingh9723]