The Interview questions are legit such solid content. This stuff is invaluable to someone like myself trying to prepare for interviews, I think i have a really solid foundation but I get super super nervous when it comes to technical live coding questions. It's nice to have this to mentally prepare.

@anasazkoul4899

Жыл бұрын

I'm in the same position as you, I think I have a solid foundation but the thing that I'm wondering about is that would this be a question for junior position in React cuz this was not easy to be honest.

@ky3ow

Жыл бұрын

​@@anasazkoul4899 i can share my expirience with interview for react trainee position(i had no commercial experience so not even junior) first task was for week in advance, not live coding, just make app like pokedex which fetches pokemons from api, populates grid with them, has button load more which fetches more, and things like filter by pokemon element and show big card of pokemon when you click on it in actual interview there were many theoretical questions about html css js and only a bit of react, live coding was to stop child component(that had props being passed from parent) from rerendering extra times (simple solution to wrap component in React.memo) and extra question how to deal with same problem but if prop is array or object (wrap them into useMemo)

@anasazkoul4899

Жыл бұрын

@@ky3ow wow thank you so much for sharing, it's really informative. I think I still need a bit of extra practice with memo, useMemo and useCallback but not really stressed about it that much. and Are you working as a Developer now? do you feel like you gained more experience?

@ky3ow

Жыл бұрын

@@anasazkoul4899 yeah its my first month as employed developer(its 3 month probation but i get paid so its like i'm just trainee). About feeling gaining experience, 1. its my first time communicating with backend so much, so i look into devtools network tab alot, not only checking what comes from back but also what payload i send 2. project is large, components are sometimes large, so i got used to utilize vscode ctrl+P shortcut(to navigate between files that can just be in totally different folders, or if i need to find where function is Declared i type @functionName in this prompt) 3. i've not really written very new code, but i refactored few very big class components into nicely organised smaller functional components, that felt like getting experience

@anasazkoul4899

Жыл бұрын

@@ky3ow that sounds absolutely great I hope I can get my foot in the door the way you did. Now I'm planning to make my e-commerce full stack project and post it on my portfolio and it will be the first big project I will ever do by myself. I hope this will get employers' attention. The best of luck with your journey :D

Recent subscriber very nice content and to the point for any one starting his React journey. Trying these exercises and then see how you tackle the same problem from the perspective of a senior dev is always interesting to watch. Haven't watched the video yet, but sure I will learn something new.

O man your channel both stresses me out and makes me feel good at the same time, since i do improve by watching every video of yours. Even often i dont get some parts but still its very entertaining to watch you solving problems and explaining in a simple way. Like you would talk to your friend. Thanks

Top notch quality as always! I just can't shake the thought that it could be notably simplified by storing the "grid" values in a single array and letting CSS handle the actual grid.

I enjoy watching your process! I recently had a React interview where the technical question was to create a street traffic controller that cycles through 6 phases of lights (north/south goes from green/yellow/red, then east/west does the same, repeat). It was pretty fun! I'm sure you could have aced it. Thanks for the upload.

@WebDevCody

Жыл бұрын

That’s a cool idea I may do that one if I understand what you mean

I really appreciate the live vibe and honesty good job bro

Thank you so much for this really beneficial content. I need to sit down and do this myself after having watched the video. and I just wanted to say that I'm really amazed with how you can tackle a problem with such relaxed manner and clear thinking.

@WebDevCody

Жыл бұрын

There is some editing going on in this videos, so don’t think I’m a coding guru 😂 , but yeah these are fun challenges, good to understand how to do yourself

omg this is awesome ! the way you explain it and the way you think of problems and how to solve it. I paused at some scenes to push myself to think about it a bit before you make the solution. btw how many years are you working as a developer ? I'm working as a front-end developer for like 3 years now and by watching your videos I realize how much I need to change my perspectives rather than my knowledge of stacks. wrapping up I really enjoy your work thanks for sharing this stuff with us. love from Iran ♥

@WebDevCody

Жыл бұрын

I’ve been coding in the industry for maybe 10 years now. Glad you like my videos!

Man thank you! I'm currently a student and i atleast wanted to learn every single language out there atleast the fundamentals before i graduate

Love these type of videos 🤩

Not sure if someone mentioned it already, but please don't use onClick listeners on non-interactive elements (divs, spans, ...), use a instead. This greatly improves a11y and UX (e.g. native keyboard-only support)

Yes! I so love this kind of content

Amazing quality content, learning a lot. One thing I would personally ask is more Vue3 content.

I find your github project layout, specifically the repo associated with your youtube code, very interesting! I'm curious as to how to go about setting up something like that.

@WebDevCody

Жыл бұрын

I just make one repo and put a sub directory for each project

And this pseudo code also helps copilot by a lot. :D Although it's already very strong.

That's beautiful!

People mad at the titles should just leave KZread because that’s how the algorithm works now haha. I love this content for learning. Feels more real than random leetcode problems. Making it a game makes it 100x better to learn as well.

superb content...!

I do not have the memory nor the brain to do this. Thank you for inspiring me to give up

@WebDevCody

Жыл бұрын

Don’t give up

ill use array of objects for state which will have the key to the other object and another array with the key if objects. ill add the key to they array if the guess was right and boom.

28:25 if we need DOM to update right after we setRevealedGrid, i think we can wrap it in flushSync, i think its easiest way instead of weird trick with setTimeout on hasWon(probably can achieve same with effects, but can't tell right away)

@WebDevCody

Жыл бұрын

oh nice thanks for the info. I think I remember reading about that once but I've never used it before. This is probably a good scenario to use it

Not sure if I'm alone with this. But if I have a fixed row or column length, I think using a single array is better than a 2 dimensional one. Because for one, you only need one map() call And second, you can style it with column grid template and or flex box easy.

@WebDevCody

Жыл бұрын

I think that would work well, I didn’t think of that

@DaviAreias

4 ай бұрын

Thats what they recommend in the react docs, they say to avoid nesting and use flatened objs instead

I'm always prematurely optimizing 😂

What you do in thirty minutes, takes me three hours. Geez, I'll never get through an interview challenge like this in time. Great learning experience though, thank you. I think one thing you can do to simplify is just mapping through the grid like so: const clearSelected = () => grid.map(r => r.map(c => false)). Make sense?

I'm not sure tbh, but i think you took it to a whole other level, why haven't you thought of implementing some conditional rendering? 2 set of states, hide/reveal ? Does that make sense? Great one btw, i appreciate your immense efforts!

@WebDevCody

Жыл бұрын

Not sure exactly what you mean but thanks for watching! I thought i did conditional rendering in this video?

@hymndrazill

Жыл бұрын

@@WebDevCody I'll try to explain it a bit, hopefully none of us get confused xD What i meant is instead of repeating the [] itself, while didn't you simply re render the values, based on the hide/reveal bool states. like a card has 2 sides right? like a flip, but that would change the whole structure i guess

@WebDevCody

Жыл бұрын

@@hymndrazill ahh yeah idk there are a lot of ways to solve this problem. If I redid this I would have only used a single 1d array to solve this problem. It’s hard to say what solution is the best, as long as you solve the problem you should be ok

@hymndrazill

Жыл бұрын

@@WebDevCody indeed! Overall thank you, just wanted to share a thought! see ya in the next one, soon enough hopefully haha

lol I wish interview projects were this straight-forward

can you/anyone make a playlist off all react interview challenges from this channel. it will be very helpful

I have been trying to come up with a solution for this by myself for the past week and its been hard, is this challenge above the junior developers' ability?

Isn't it like easier to make an array of objects. And with the object the fields are turned, solved and number. So when the number is the same as another number both objects are set to solved and will be out of the array. And when the user clicks on 2 objects both fields turned are true and when its both wrong they both will go to turned: false again.

@WebDevCody

Жыл бұрын

Easier is subjective, but sure that’ll solve the problem just the same

Interview questions like that are for Junior Dev ??

Is there a good reason for not using a 1-D array and use flex wrap ?

@WebDevCody

Жыл бұрын

Nope that would work

In react if we decide to not to specify the key, react by default will use index as the key I think, we don’t need to specify the key if we are going to use index as the key. Correct me if my understanding is wrong.

@WebDevCody

Жыл бұрын

Yeah that is correct. I just like to explicitly set it

Would you ever consider interviewing / talking with other tech people for a video ?

@WebDevCody

Жыл бұрын

Possibly, as in I’d interview someone?

@yousafwazir3167

Жыл бұрын

@@WebDevCody it could be a interview or a tech discussion something to get people from the tech space to share new ideas, tech or just stuff you’d find interesting.

@WebDevCody

Жыл бұрын

@@yousafwazir3167 oh, maybe one day. I do plan to do a collab with another youtuber Sunday to learn some new things

Good job babe!!!!

@WebDevCody

Жыл бұрын

Thanks bub!

handleCardClicked() should only update the state and then use useEffect( () => { ..your side effects here }, [previousClick] ); to add any side effects to your state updates :) imo, that would be way cleaner way to do it

@WebDevCody

Жыл бұрын

Sounds interesting, but I disagree. UseEffect makes the code harder to follow imo.

Using a 2D Array to contain the data to show rows/columns rather than just using a flat array and CSS Grid with for styling it into a grid seems an odd choice?

@WebDevCody

Жыл бұрын

Sure?

will you do something for seniors?

@WebDevCody

7 ай бұрын

Seniors probably don’t get these type of challenges

WOW

Bro, the closing div should have a slash in it 4:47

Watching these even tho i applied to over 500 jobs and none have given me something like this. Its all hard leetcode im applying for front end :(

@WebDevCody

Жыл бұрын

That sucks, leet code questions are not very practical, but still challenging. I’d rather be quizzed on something practical

Does"t it have a bug when you click fast on everywhere?

@WebDevCody

Жыл бұрын

Idk didn’t check

Have you considered doing live interviews like this with random people? "fake job interview"

@dimamarius9791

Жыл бұрын

Yes, very good idea!!

24:00

If you have tons of errors, don’t read them, just delete everything and start over. 😂😂😂

@WebDevCody

Жыл бұрын

Sometimes it’s easier than reading these aweful error messages

Dude I like your style of teaching but you really push yourself off-grid and the viewers at times 😑 just slow down a little, we know you're the man here 🙄

@WebDevCody

Жыл бұрын

Sorry about that!

Yeah let me waste a year of my life learning about specific function names so I can build some basic UI.

You need to explain all syntax for beginners. This is nowhere near beginners level. Being so advanced you are out of touch.

@user-ls5pg2wd4i

Жыл бұрын

He never said that the content is meant for junior developers

@WebDevCody

Жыл бұрын

Yeah this isn’t a challenge for someone who doesn’t even understand JavaScript and react syntax

@SeibertSwirl

Жыл бұрын

So rude for no reason

@Kay8B

Жыл бұрын

Its literally in the title " *more* challenging", go to his simpler challenges if you need more of a basic challenge/tutorial.