React Junior Developer Interview (Questions & Challenge)

[@cosdensolutions]

Hope you enjoyed the video! I also have a really cool and unique course that will teach you way more than this video. You'll learn how to build an actual complex project with React. It's called "Project React" and you can find it at cosden.solutions/project-react. Also, I have a free weekly newsletter called "Import React" with tutorials, news, and cool stuff about React! You can sign up at cosden.solutions/newsletter?s=ytc

[@pawanthakuni996]

I m looking for react developer job, I have more depth knowledge than him

[@ReQBR]

My man, thanks to this interview I was prepared, a lot less stressed and I actually landed an internship! Thank you both for great work.

[@cosdensolutions]

damn, congrats!

[@keifer7813]

This was great. I'd love to see more mock interviews like this. Both the behaviour section and the practical section. Keep up the vids and shoutout to Bogdan. He's a braver man than I

[@Mecagothits]

for real

[@electro46475]

Thank you both and especially Bogdan for being brave to do this!

[@IoanAlexandruAndrei]

I have a little thing to add on top of this awesome coding interview at 37:20, defining a function, let be it arrow func or a simple function, it becomes part of the component's main body. If it's added into the dependency array, everytime the component rerenders, the function will change ( functions are basically objects in JS and on every render are destroyed and recreated ) because it will become a new instance so it will trigger the logic in the useEffect. This won't create an infinite loop, but it will certainly run more than once. Anyways, great interview!

[@hatimtagmi5415]

You right

[@webb-developer]

good notice.

[@RadimArcelios]

the function reference changes, thats why if you need to call a function in useEffect and also depend it in the dependency array, you either have to define the function outside the component (doesn't change reference on re-render), OR wrap it in a useCallback. It should be more performace efficient in the first case (def func outside), rather than using useCallback on top, but thats diving into too much detail :)

[@harag9]

I've seen many videos on react since I started learning it. Never seen one like this and really enjoyed it. I tried to answer the questions before he did and I even surprised myself on how many I got right. Hope to see more content like this!

[@cosdensolutions]

that's a great way to approach it!

[@tomasburian6550]

What a great video. I was actually amazed by how much I know about React since I could offer an answer to each of the questions after 3 years in the business, but this helped me to refresh and learn some new facts. Definitely useful.

[@yasserassi3276]

This was fantastic, and I would appreciate additional simulated interviews similar to this one, encompassing both the therotical and practical parts.

[@JadesFitnessBucketList]

this was fantastic! please do more interviews as videos and pair programming exercises. I paused the vid and did the fetch countries exercise myself before watching the second half of the video just for practise!

[@olalekanemmanuel6767]

I love how you teach and your approach. I wish Frontend Interviews were like this really

[@hakusaan]

The approach with 2 useEffects is better IMO because each would be responsible for 1 thing (1 fetch all, 2 fetch capitol) then it would be easier to code split. Also you don't need second fetch because you fetched all in 1st call, just filter it with JS. Additionally I think that fetch in useEffect that listens on a variable change is a bad practice, you should always fetch on js event when possible, if it's not possible then on useEffect trigger.

[@scvkurt03]

Would it not be better to just filter the list of capitals in state rather than make another API call? Handle locally what you can handle locally, no?

[@hichamKM]

from my perspective, it seems that he's using the second call of filtering in the useEffect only because he has the filter api endpoint. If he didn’t have it, he should definitely use a js event to update the country

[@valdoryon]

Excellent video, the interviewer explaining and giving insight of the issues and ways to work around them is perfect, great job both!

[@DeJourFord]

as someone trying to land my first Jr Role, this video is helpful. I appreciate both of you!

[@tafseelshorts]

Did you got any job brother?

[@DeJourFord]

@@tafseelshorts yeah I did but not as. React Developer. We just use vanilla HTML, CSS, and JS

[@tafseelshorts]

Congratulations ❤️ genuinely felet happy reading your commnet brother. As I am willing to land a junior developer job, can you give any suggestion?

[@DeJourFord]

@@tafseelshorts my biggest suggestion would be to build an application that you’re passionate about. Don’t just build something because everyone else built it. The best projects are those that you worked on from inception.

[@keshavakumar9828]

i have been learning so much from your react videos. i have fairly 2 YOE & i always find myself refreshing and learning new things from your videos

[@조연정-f1y]

I enjoyed this video! You seem really kind. It'd be nice to be able to work with a senior developer like you. As a junior developer, I will watch your videos often. Hope to see more content like this in the future.

[@personalquests]

This is fantastic! I thoroughly enjoy this type of content. Keep up the good work, @Cosden Solutions!

[@Kelz_369]

This was great. I'd love to see more mock interviews like this. Shout out to that kid for his attempt 👏 .

[@ngayathri1818]

Appreciate the effort by your friend. It's really awesome. It is not easy to code if someone is watching us. He did a great job. Thank you for organising and preparing all the questions for us...

[@stevenvaughn7460]

More of these please. This was awesome. Good job bogdan!

[@egimuhammadmegantara7321]

this is what i need, thank you so much for both of you. you are doing great job

[@justinrivera6749]

As someone self learning and hoping to switch careers. This was a tough watch. Makes me feel like I should be applying right now but I can’t imagine this is “junior” level.

[@endera782]

do you think the junior level role would be easier questions?

[@justinrivera6749]

@@endera782 I could see the confusion, I was more referring to the person being interviewed. I feel like the questions were on par with what I would imagine

[@Drayken]

@@justinrivera6749 Yeah the person being mock interviewed has 4 years of experience. Really wish they would do these kinds of videos with people are either aspiring juniors or recently hired juniors.

[@abdelrahmanhossam1916]

I am in the same spot , self learning and hoping to switch careers. Did you make it ? and if yes then how? 😅

[@KeganVanSickle]

Kudos to him for making himself vulnerable. Good job!

[@SakshamDubey-vv2ms]

Thanks for giving me more confidence that if Bogdan has 4 YEO and was struggling with this level, I am surely gonna get selected

[@rohitghadage3220]

You are the one the best youtuber i have seen so far So, be motivated and Keep Making your great quality content ✨ Thanks alot

[@cosdensolutions]

Thank you for the kind words!

[@moestaxx286]

great content bro i hope you keep this type of stuff up it is very helpful for devs like me trying to get a react dev job so i kan know what things i need to improve on!

[@sedmidivka]

I am thankful for this because I'm learning by myself and I have no idea what level I am right now, if I'm a complete noob or if I am ready for job interviews. Under stress and for a video I have no idea how I would do, but the challenge was pretty easy and I was telling the guy answers 😂 so maybe I am actually ready. I was intimidated by the challenge at first because right now I'm not using react, I'm learning something else, but the tutorials did something right because when I went step by step it just was working. I'm an very happy right now because I needed a little boost to be more brave with my skills. thank you both!

[@immigrationtime]

As an interviewer, it is better to listen more. Don’t be nervous, you are doing great :) and it is still interesting to watch

[@yaro_05]

Great educational video. Shout out to Bogdan. Thanks a lot!

[@re.liable]

Thank you for the content. I had some issues with the challenge. Mainly from understanding the given problem (which sounds so bad I know...) I got confused with the functionality of filtering the countries by capital. I couldn't shake off the thought "Why would we need to filter by capital? Don't countries only have a single capital? Are there countries that have more than 1 capitals?" stuff like that. If I was in the interview I would've clarified this with the interviewer. Not having a view of the UI also gave me troubles just like the guest haha I think I got the storing of the current filter "key" correct. However I would've fetched the country list only once. And then I would've derived a `countriesToDisplay` list which filters the "master" list using the currently selected capital. This might be wrong on some parts though... since with this approach I wouldn't "need" the `/capital/{capital}` endpoint at all. I could just go through the master country list and see which countries match the current capital Also I would've definitely tried visiting the API links manually at the start just to see what sort of response they give

[@DevDesignerdotpk]

I would say this is an actual junior developer interview, because the candidate is actually a junior and knows everything the same as a junior developer, unlike other mock interviews where the candidate for a junior role is actually a lead software engineer, great work brother.

[@Drayken]

The canditate has at least 4 years of experience and knows fullstack, not JR.

[@umaid7877]

After watching this video, I gained more confidence. Even though I am a fresher without a job, I still know these concepts better than a developer with 2+ years of experience. Should I be sad or happy 😭

[@t0m4sk8]

Wow the useEffect solución at the end was great, very interesting aproach. I learnt a lot from this video thank you

[@nanonkay5669]

I've been doing react professionally for 2 years and exposure to it for 4 years, but actually learned some new stuff today that i thought was just convention but didn't know why we actually do it

[@Bhushankadam011]

3:44 We don't put JS in html. We put html in JS functions.

[@ahmedjaber8595]

Learn JavaScript well before learning TypeScript and ReactJS. I love this. I hope you can do that with a senior.

[@ariyoujahan9662]

First of all thank you Bokdan (sorry if i didn't spell it correctly) for your courage and your time. There are lots of people with big talk but never dare to stand there and being interviewed (with so much viewers and being recorded specially). And thanks you codsen for this content. It was amazing. I hope for more content of this type. Mybe you could try other level interviews such as senior with more complicated challenges. (Please like if you are agree with me)

[@philipjohn2038]

lovely content, am a junior and I learnt alot, thanks 👍

[@AnuMessi10]

This is great content, I came here from your instagram page and would love to see another interview with advanced questions and senior developers.

[@vivekkumar-pc1xy]

great Interview, this interview really helps to prepare for the really one.

[@fcku09]

wish my interview looked like this i had my first tech interview a few days ago, and i def haven't passed it it was junior react position, but seems like the guy wanted me to know completely everything in deep about js methods..

[@jaffaisaac6186]

thank you so much for these react videos

[@ruslan_yefimov]

No pressure - JUST do your BEST. I love it, lmao

[@helenasdiaries515]

Enjoyed watching this !

[@bobmagrega]

I would've loved to participate in an interview like that since there's a great shortage of real react interviews for junior devs. Thanks for the video, really educational

[@ankitbal2240]

Please make this kind of videos which are really helpful for freshers ❤

[@Dave_devProjects]

This video was extremely useful to me. Thanks alot.

[@0xZurvan]

I loved the video, more like this please!

[@abhinavdhama3014]

Great interview . Again amazing content bro ❤❤❤❤

[@AsmaaRefaat-h8c]

Awesome!! I am a react junior as well and that resembles me soo much and my senior when she reviews my PR and suggests really concise, more efficient way of doing stuff 😄❤ and i am always like "WOW that's was way cooler!!"😂

[@adiazwise]

Great Mock Interview , Thanks

[@computeraidedyami]

I love how at the end the interviewer became Super Saiyan lol

[@cosdensolutions]

Hahahahaaha nice

[@angelogaspar364]

This is very helpful, thank you very much.

[@VitorDias-n8r]

Great content! As a mid level junior, around 1-2 years coding, I could see I really know a lot. Coding takes time, study and code obviously. 90% of questions I was abble to aswer, and sounds very weird he doesn`t use more basically react tools

[@mladenorsolic370]

Being a senior react dev, the only question i had a problem with was the jsx one lol.. like how do i explain what it is.. so funny :)

[@manasuniyal2897]

Amazing interview ........great questions .

[@LakeCountryGames]

Love these! If you're looking for more interviewers I have 3 years experience working at a fortune 500 insurance company. Would love to do something similar sometime :)

[@ebrahimafridi689]

Please make more such videos love this one.

[@Gangbuster74]

As a developer who has working experience of 1.5 years with react, I was not expecting such answers from him🤨🤨

[@WTH20236]

no hate to the guy but hows he not used useRef with over 2 years of react or not knowing what a controlled input is?

[@samirelmahdy4892]

I'd love to be interviewed :D Great video, and a very good applicant :)

[@Gangbuster74]

Let's take you interview

[@lalaalal7847]

This is a prime example of why you shouldn’t start off using so many libraries- you will miss the fundamentals

[@cosdensolutions]

Fundamentals are super important I agree! But I also think he did well

[@lalaalal7847]

@@cosdensolutionsyou’re being kind. Imo he struggled way too hard with the API call, something you’d expect from an intern

[@catalincatalin4101]

@@lalaalal7847 except he might not be fetching data every day at his current job and he really kept this real without preparing a "script" of what Darius will ask him. Yes, an intern would have this knowledge fresh probably and would answer it faster. I wouldn't personally be so judgy with someone having a live coding session interview, but hey, I respect your opinion. I am sure he was expecting that some ppl will judge his knowledge when he had the balls to accept this interview 😂

[@cosdensolutions]

nah dude, you haven't seen what interns really can do. This was great, and he was also unprepared we did this spontaneously

[@cosdensolutions]

that's exactly it actually

[@ArpithaIndira]

Please do record more videos of these type..please it’s a humble request 🙏❤

[@yuliasereda5671]

I have a thought. In condition that we get the all 250 countries, we could just find counrtries by capital like countries.find((country) => country.capital ===value) without fetching. but if we have 20 countries from 250 this approach wouldnn't work. of course.

[@r3tutorials679]

He said he haven't used anything, so is he really a React Developer or just HTML developer?

[@krzysztofrozbicki1776]

I have one performance question about the last part. And would really appreciate if you would answer me this: You are fetching the all countries list no matter what when the component is mounted. It means that countries in the Component always will be array of 250 objects (as the capital on first render is not set). If we already have the array of all these objects in our component state then why should we repeat the fetch for single capital/country on the onChange on Select component? It seems like unnecessary queries to our server/database - which i don`t think is the best performance and with big scale (like thousands of users that could easily be some issue). Wouldn`t be better just to filter the array that we already have in our component state (countries) Or maybe even better, maybe we don`t want to filter whole 250 elements everytime user interacts. So then we prefilter our 250 elements array with the FILTERABLE_CAPITALS and return the new array filterableCountries - with only 6 elements. This would be only 2 operations on mount component - fetching the array once, and filtering it once. And then onChange on our Select we would filter our small compact filterableCountries - 6 element array instead of fetching data from server for every user input. Now we have only 2 functions that could potentialy slower the application - once the fetching - which can take X time depending on the server response. And secondly prefiltering our fetched data witch should be quite fast unless we receive like dozens of thousands elements (but then we shouldn`t fetch it all in the first place ;) For me it seems like a more reliable solution, less depending on server, creating less network transfer and all in all would be faster therefore better for the User Experience. If i am wrong please correct me.

[@jacksparrow4628]

Oh bro you are a genius, what are you doing here on KZbin? You are supposed to be at a senior position in a tech giant corporation, kinda feels weird to me that you would have enough time to watch someone else's interview and then try to find mistakes in their attempts rather than caring about your own one. The efficiency of application ofcourse does matter but this is an interview where the interviewer is testing his logical thinking, of course performance optimization is mandatory, but not in a small react interview, everyone is not as gifted as you to show brilliant presence of mind while at an interview.maybe he was too nervous to think that way.

[@oliverhughes169]

Hey it's a good question, nice insight. In this example, with 250 fetched elements, yes you could easily just fetch the list of countries once, and then filter countries from your original fetch. This would be faster in this scenario, but probably the interview wanted to demonstrate you can perform dynamic network requests on filter value change. However like you noted, this approach doesn't scale. Lets say you're working with a different set of data, like fetching invoices of which there could be tens of thousands. In this scenario, you'd most likely never fetch "all" invoices, you would just fetch a paginated set of them. Then for filters, you still need to issue a network request to get a filtered set, since you'd never have the full set to work with.

[@buwithegoat]

If only the real interview is this easy I would have been a junior react dev by now lmao

[@Volat123]

Thanks a lot for the video. I liked it very much and I made the test solution on my enviroment to test my skills ))) So, would you hire Bogdan in this case? Looks like he did not answer some of the questions but he's defenitely able to write code and complete some tasks.

[@saifsiddiqui8017]

Came across your vedios, learnt alot my frien thanks❤❤❤

[@techsavy5669]

I am confused. At 37.00 writing that fetch function outside of use effect like so.. let fetch = a sync () => { // inside code whatever }; use Effect(() => { fetch(); }, [ ]); Works good. So why did he say all that !!

[@cosdensolutions]

It works but you get lint errors because fetchData has to go inside the dependency array. And if you do that, it will run the effect infinitely. By defining it inside the use effect you don't provide it to the dependency array and you don't have this issue

[@techsavy5669]

@@cosdensolutions in above code I haven’t provided it inside dependency array. Works. No console warnings too. I am new to react.

[@TheSbunch]

This was terrific. Loved your knowledge drops during the interview. Is there any way we can get a copy of the code?

[@HENDZZ_SHORT]

Thanks, Its very inspiring

[@adnanrruka5152]

I wish to have a intervew like this :)

[@nayandey5010]

Hey can you add some links of them to whom you interview, like bogdan. Also do you use vim edition extension if yes then name a video of it please, I want to use this on my setup too

[@compilexfaiz]

Which camera you guys use to record your video?

[@KING-ej5qj]

Need more interviews like thus

[@ragnarez9680]

why do you doublefetch if you already have all countries in state ? just sort it

[@aryandhakal7961]

I also want to do a react interview mockup with you. How could it be so??

[@shoaib3103]

Without useRef, there's also a way with using an id and making dom manipulation with it to focus....

[@aliplaysgtr]

Very useful, thanks! Unfortunately, Bogdan doesn't really looks like a 2y experienced dev, he's kinda avoiding every question. But thanks for the video!

[@anastasijaradulovic8377]

Great interview! I am also Junior React Developer, and this means a lot. Bogdan looks like a guy from my contry Serbia, do you have his KZbin Channel or Linkedin to watch more?

[@cosdensolutions]

He doesn't have youtube hahaha he's just a friend I worked with at a company! And he's Ukrainian! But believe it or not, I'm currently living in Belgrade (but I'm not Serbian)

[@anastasijaradulovic8377]

Oh what a coincidence 😂 Hope you like it here! @@cosdensolutions

[@EvgeniyaJZ]

​@@cosdensolutionscan you share his github?

[@perisicnikola37]

​​@@cosdensolutionswow great haha. Didn't expect that. Hope you like it

[@Mecagothits]

they did a good job, but sure I guess its your friend

[@othersidesss1]

This bro, who's applying the interview..judging on his answers - I doubt that he can be even a junior react dev...not talking about the middle level...

[@reprovedcandy]

I'm about to go into a technical interview for a senior level position involving React. Pay is $175K/yr. I have 6 weeks experience. I'm so fucked.

[@IbrahimSowunmi]

how did it go?

[@xanstas3309]

how was it?

[@akmal5027]

Bro how did you land an interview for a senior level position with 6 weeks of experience? Or did you mean 6 years?

[@reprovedcandy]

@@IbrahimSowunmi I actually got the offer. No joke.

[@reprovedcandy]

@@xanstas3309 i thought it went terrible, I only solved 3 parts of a 4 part problem (3hr technical interview so it was a large problem) but then they made me an offer. Go figure hah

[@nathandunn1007]

Thank you for the video. Completely unrelated, but what chair are you using and do you recommend it?

[@cosdensolutions]

it's from ikea, I really like it but I'm not sure of the model haha but it's pretty common

[@methmaaravinda5107]

this is good interview and love it learn from it

[@djordjetodorovic7794]

Can someone if needed add some more questions if we need anything more then this? im getting ready for interview.

[@ferez_]

duuude i want you to interview me ! haha

[@SeyfadinAbdela]

eventhough it is fake, i learned much more

[@AmitKumar-cp6mx]

How can he forgot useState 11:15

[@ahmetalsan]

I enjoyed it. Can you do more?

[@AmitKumar-cp6mx]

Like seriously these kind of questions are enough for junio react developer interview?

[@cosdensolutions]

Yeah what else would you want? 😅

[@0mEtAlx0]

great video, with this I realize how I'm not a junior anymore haha T_T

[@nguyenbalongvu9434]

Im surprised that he is a middle level frontend and he doesnt seem to answer most of the core questions

[@osamajune9]

Wth? No negativity here. But the guy giving mock interview is a freshie not an experienced dev of 2 years

[@LuisMorales-lu2cm]

I have 0 years of professional experience and I could give solid answers and solve the coding challenge of this video, does that mean I’m job ready lol?

[@Abubakr-md6kz]

Yes of course you can, if you can build great things with it then why not

[@alexjando4880]

I started learning react a month ago and i knew way more than thia guy.

[@RAVEAliza]

My worst nightmare for interview dsa with react js...this one somewhat scary interview for me.

[@cruzlee4092]

Great, I love it.

[@ramchand7002]

I refuse to believe that this is a mid level developer with 2+ years of experience. These are the things that KZbin tutorials teach you while you make a todo app. or a weather app.

[@SuperGabruJatt]

True. Not trying to be too hard on the guy but someone with 2+ years of dedicated React experience should definitely know that a map function does not have the index as the first argument.

[@andreisalagean1241]

You always need to account for the fact that a lot of people in tech are not so good with putting thoughts into words, hence all the jocks in the movies. As a dev you also know a lot and write a lot of code from experience, rather than remembering technical definitions. Also, there are LOTS of devs with 2-3 years which are terrible and missing even basic concepts due to the luck they had with the mentors they got in their first job (There are literarily companies that will assign juniors on projects with no experienced supervisor or team colleague).

[@t0m4sk8]

He migth be nervous, having someone watching you code isn't that common

[@basavarajeshkoni9739]

Once manager was sitting next to me and asking me change code and he was testing. It is also same I guess.

[@ramchand7002]

@@andreisalagean1241 ​ Yeah, I'm not actually talking about the first part of the video. That's completely fine, people who learn coding by just creating stuff won't know the definition and most technical words. But if you've been coding for 2+ years, and have problem making API calls, mapping arrays, or you're giving index to the key in a map. that's a completely different issue. Also the last part of the video where he tries to make a different API call entirely for getting a specific capital was also surprising. If he was an actual junior, the skillset seem to match, but as someone with 2+ years, it just doesn't make much sense to me.

[@mrityunjaymishra3857]

Hi, you are doing great. can i get a chance to to give you a mock interview on react?

[@zenoviyfil]

junior react developer does not know the difference between controlled input and uncontrolled? you got to be kiddin me....this is more about like trainy question.