Front End Mock Technical Interview | JavaScript, CSS, React, and Algorithms
Вставка
- Опубліковано 25 кві 2021
- 🎉 Join Discord - / discord
🐦 Follow On Twitter - / thedonofcode
🌀 Connect On Linkedin - / donthedeveloper
🤝 Get Help From Me - calendly.com/donthedeveloper
❤️ Support What I Do - ua-cam.com/users/donthedevelop...
Are you looking for long-term mentorship as you try to become a frontend developer? Consider joining my frontend mentorship program.
forms.gle/Y9zuGxzVZe154uSz8
-
Disclaimer: The following may contain product affiliate links. I may receive a commission if you make a purchase after clicking on one of these links. I will only ever provide affiliate links for apps that I've used and highly recommend.
My #1 recommended FRONTEND course:
scrimba.com/?ref=donthedeveloper
My #1 recommended BACKEND course (25% off):
boot.dev/?via=donthedeveloper
My favorite todo app (Todoist):
get.todoist.io/lbibntzmg4yg-H
Want to come onto my podcast and ask me a few questions? Just fill out this form: forms.gle/esQMbaRjQt9SkD1XA
---------------------------------------------------
Want to know what a legitimate frontend developer interview is really like? I invited on a developer that had originally interviewed me for my second software engineering position. He interviewed a brave soul from our community that's currently trying to get his first position as a developer. Dan started out with questions to test his knowledge with JavaScript & CSS; moved into the algorithm & JavaScript fundamental portion; and then wrapped up with a React project. I think this interview turned out pretty well. What do you think?
Host/Guests:
Don Hansen - / donthedeveloper
Dan Cortes (Interviewer) - / dan-cortes-8954b345
Noa Kim (Interviewee) - / noanonoa
Here's a code sandbox link to the template for these problems. JS questions are in "/vanilla-js-qs/index.js" and the React app is in "src/App.js": codesandbox.io/s/vanilla-js-react-pokedex-i7clq
I would be super happy to work on a team lead by Dan. Seems like a great mentor and an easy guy to get along with
He absolutely is. He ended up being a great mentor and friend to me.
It looks like this podcast episode was well received. I'm glad it helped so many people! If you'd like to see more mock interviews, what other types of interviews would you like to see? Reply to this comment with your ideas. I'd love to hear them.
Hi there, really loved this one. It's great opportunity for people to get some ideas and preparation for interviews.
How ever, for me it was even better for other reasons, because I'm working on two jobs, when I get home, i don't really have time watching others coding, rather I spent this little time coding on my own.
Though, i have time on my job listening Podcasts etc, that's why I like your channel as well, so I really liked this one, even without watching it I could follow it and even learn something new.
What I would like to find or listen is someone coding their project and talking and explaining steps, similar to what they were doing here. Usually, developers just code, talk here and there what they are doing, but missing lot of things out, and if you aren't really watching, you can't really figure out whole process.
Well, I'm not really sure there's much interest for this, but if you think this would be interesting to your audience, i would definitely like it
Please get Dan to just do a few more of these same type of React focused interviews but with different candidates bc each will have different skill levels and performance which would be great to learn from, seeing the differences from candidate to candidate.
@@philipbeauford Don does whatever Don wants, no need to ask me to get him to do anything, as I really don't have any such power to make Don do anything (though, if I'm completely honest, I'm writing this little sweet script that will make Don make my all wishes come true, but please, don't let anyone knows about this one, this will be our little secret and when I have it done, I'll make Don realise your wish as well, agreed?).
I was simply giving suggestion based on my experience, so can you to as well, and I believe Don understood your wish as writing it for him and not for me, but I couldn't help to make fun of it, I'm sorry
Please make more! At Onja Madagascar, we use this video as an example of good interview technique.
It is really well done!
This is a really great video... i was literally pausing between some of the questions to solve them on my own. Would love to see more interview content like this :-)
I'm finding this also a year later, but thanks for this video! I'm a tech recruiter and often have frontend applicants ask about the on-site interview process. A peek into how things go after we switch hands over to the engineers helps a ton. Both in helping the candidate be well prepared and in me knowing the deeper level things on certain stacks.
As someone who already has experience doing pokedex projects as far back as 2017, I'm so hyped that I could've fully completed the project (with css styling) within the allotted time. If my interviews are anything like this, I'll be a frontend engineer in no time!
This is a great mock interview and as an aspiring developer myself, gives me a lot of insight of what kind of questions I can expect and what my general knowledge/skill should be at. Thank you!
This gives me so much confidence! I think I’m ready for a job! Thank for this!
He's a great mentor who seniors should be, and also the interviewee has a good attitude. Under the pressure, he kept asking questions and requesting feedback, and he was waiting for until the feedback had done. Everyone would face difficulties when they start learning for the first time. I believe that attitude is more important than skills for the future. I'm sure the interviewee is going to be a great senior. Thank you for sharing the video. It's absolutely amazing.
I just released another mock interview today that gives a peak into a senior software engineer interview. Check it out here.
ua-cam.com/video/yju4zwKSriI/v-deo.html
If you'd like to participate in an entry level backend mock interview (on the podcast), just share your email with me here and I'll be in touch.
forms.gle/r6cs4X6kR38sWAZV6
Thanks!
This video is pure gold!!! Thank you so much for this. please have more interviews coming!!!
This is exactly what I need right now. Thank you!
Thank you. This gave me some confidence boost. I am stuck in tutorial hell for such a long time I don't even want to reveal. I always worried everyone codes like in the 30 second fireship vids. Sadly you never see how it really looks like.
Loved this ! Definitely looking forward to more!
Very helpful, informative, and very well put together. I have an interview this week and this video helped A LOT.
Thanks to all parts involved, great stuff.
Good luck with the interview.
the interviewer is an incredibly patient dude, mad props to him. the react section was particularly painful ngl. I hope the guy interviewing for the position has made even more progress since then 🙏🏽☮️
Nice Don! Thanks to Dan and Noa!
This was an amazing interview. Thank you so much for sharing this video it's super helpful.
Thank you for uploading these mock interviews, they really help boost my confidence and show me what I need to improve on.
Glad to hear it. You're welcome.
This was a great watch and very informative. I wrap up my bootcamp next week and will hopefully start interviewing sooner rather than later. Fortunately we had a series of mock interviews throughout the program as practice, but this was really insightful and also reassuring. I think Dan and Noa both did great. I hope I can encounter some interviewers like Dan throughout the process.
Thanks for putting this together and thanks Noa for being wiling to put yourself out there like this. Best of luck!
I'm glad it was helpful. Good luck with the job search!
Hey man. What bootcamp did you attend and how was it? Looking for a great bootcamp. Thanks
This was awesome bro! Thank you so much for this!
Thank you for sharing this! It gives me so much more insight as I’m still on my self-taught journey as a FE Dev. It’s nice to know that they actually give you prompts. I thought they just show you a random website and say, “okay, share your screen and build” - which is extremely intimidating.
I hope this is exactly how majority of the interviews are because my brain isn’t creative enough to just “build” a website. Based off of this video, it really seems like it’s a lot of “how you think” and “what you’re thinking” and “how are you executing this code”.
this was an awesome interview , I haven't gone through any interviews myself yet , but it gives me hope that I'm getting closer to start applying for jobs, since all these tasks seemed to be pretty basic
Wow I got all the HTML and CSS questions correct. Gives me confidence now.
10:20 starts the technical questions
Love this this was very helpful as i will start applying to front end developer jobs next month! great to know what to expect. Please make more of these!
super grateful for this mock interview video. It really helped boost my confidence
function sum(...args) {
return args.reduce((acc, val) => acc + val, 0)
}
const sum = (num1, num2) => num1+num2;
This is awesome! Thank you for this, really appreciate
Most Chilled Interviewee ever born
Nice. Thanks for the interview!
Thank you so much for doing these! They are extremely helpful! I think one thing that would be really cool is having access to the codepen or interview questions so that we can try the problems out ourselves before watching.
You're welcome! You're not the only person to suggest that. I'll reach out to Dan to see if he still has those links available.
me too I lke to try coding this as well
@@DonTheDeveloper Did he have the link?
Awesome insight! Thanks! Greatly Appreciated..
If this is an average technical interview then I'm way beyond ready. Let's go! Got one tonight.
any updates?
The average interview I've had is more challenging than this.
He took it really easy on him. These questions are not to be expected on standard interviews.
Agreed generally they are way harder😭😭
@@UvstudioCaToronto ю
Gold interview. Thank you
this is a gold mine. I had one interview, if I would rate my performance it would be below 50%. I knew what to do, how to build projects(using google, documentation and so on). But, I was unable to explain very simple things in clear way. Anyway, really helpful video, it inspired me, give me bit of hope that I can make it as developer, I need more time to learn, and improve communication and interview skill.
this interviewer is really sweet.
Thanks for your video
it's really helpful for me because I'm not a native English speaker and I searched example frontend interview for my next job in English
I noticed it’s easy to fall into the trap of focusing on and learning a lot of the big stuff like frameworks, JavaScript, databases etc, but not on the small easy fundamental things, so small that it’s overlook and that’s how the interview can catch you off guard. Like css specificity and html webpage formatting, those things are really easy, but so much so that it’s easy to forget about and that’s why it can be challenging. So we should not only focus on the big things but also the small fundamental things.
This is seriously valuable content!
Seriously such a great video! I was feeling really nervous and unconfident for my interview but after watching this I hope it is actually like this. Super confident after watching this. Thanks for making this! Hope you guys can do more like this.
I'm glad this gave you a confidence boost. You got this!
How did the interview go for you?
How did it go!?
This was very helpful and fun to watch! The text was hard to read from time to time, but mostly it was fine.
Just landed my very 1st job with the same api😂, thx for the mock interview , great as always
Please more react fee interviews this was very enjoyable to watch!
please do more mock interviews!!!! loved this!!!!
Don't worry. There will be more.
This was so good!!!!
Great job! I liked it, could you do more front end engineer interviews like this one? There's not a lot of resources on FEE interviews
Thanks. What things would need to be similar and what would need to be different for another FE mock interview to be valuable to you?
@@DonTheDeveloper i think some technical coding interview, like hackerrank etc.
I wish frontend interviews in India were this awesome. All questions that are asked in this interview are used in the day to day life of a FE engineer.
There are some companies here that reject if we don't memorize the latest version of a framework/library.
I've heard many stories similar to what you're sharing. You're definitely not he only person in India that feels that way.
@@DonTheDeveloper true. great video, would be great if you guys can also do this with a senior frontend engineer as the interviewee.
@@xrr-1 As the interviewer or interviewee?
@@DonTheDeveloper interviewee
@@xrr-1 Why’s that?
Thank you Don.
Thanks for this video ! it is gold for me !
You're welcome!
these are really helpful, can you make more such mock interview videos for different types of roles in software engineering
Write a function that takes two strings A and B and return whether B is in A in case-sensitve way
const checkChar = (string1, string2) => {
return string1.indexOf(string2) >= 0;
}
console.log(checkChar("Obinna", "Ob"))
Loved it! Where can I find more templates like this to practice?
The man has some insanely fast typing speed. 🤯
Love the Sufjan Stevens lyrics at 26:43
I have a frontend engineer interview next week!! My dream job!! 🥺 Thank you so much for doing this!! Also, love the Pokemon theme 💚💚💚
Haha thanks. Good luck with the interview.
Hey Gabrielle, How did it go?
Nice interview. And I feel so confident now :) I would pass this one even maybe a bit faster though :)
Do you hire more ppl? 😅
Shout out: --- "I KNOW THIS IS MOCK INTERVIEW BUT IF YOU CAN SOLVE THIS IN GIVEN TIME, WE WILL GIVE YOU JOB IMMEDIATELY" this is epic lol
A pro and con about this interview:
pro:
first, the content is amazing every question is super good and this is how questions will be usually in interviews.
con:
in my experience i was never asked this many questions in that limited amount of time: the algos in this video during the functions part --- i would never go for a predefined method, instead, i would do a proper algo which would almost take 30 minutes of my time.
I hope my interviewers are nice like this..
When he brought out the pokedex problem and wanted him to solve it on the spot, I started to get worried lol. I would shit my pants if they wanted me to put all that together in 25 minutes in an interview. Seems more like a take home problem.
Also, it would be nice to have a link to some of these mock problems. I would like to try the pokedex problem myself.
@29:33 The dot dot dot parameter is known as Rest Parameter. More efficient than the argument keyword (pseudo array-like). I guess!
Front End dev job interview in two days, very useful, thanks guys.
Good luck!
2 years late but how'd it go? Are you a Front End Developer?
@@josh_tes lol Not sure if it was this one, but I got a job in the end. I think the numbers were something like 1000 hours of study, 100 job applications, interviews at 5 companies (some of them up to 3 interviews) and `1 job offer! It was just a contractor job, so worked there for a year and now in my second job, full-time at a very nice company and a great team. To anyone reading this, just hang in there, don't over think it, just keep working and you'll get there.
Awesome video. For any curious about the final, "hardest" question in the JS lightning round (the one that deals with Promises and async/await), here is one solution:
const delay = (n) => {
return new Promise((resolve, _reject) => setTimeout(() => resolve(), n));
}
(async () => {
console.log("Testing delay");
await delay(1000);
console.log("Testing delay end");
})()
Yes, also an even cleaner option is to just do setTimeout(resolve, n), since you aren’t passing any arguments into resolve and you’re only calling resolve in the callback, you can just directly use resolve as the callback.
It realy helps! thx!
thanks guys
This was really an amazing mock interview really gave me a good insight on how a frontend technical interview is , Thanks a lot for sharing, Please would love to get the starter code, if possible for the react interview to try and test myself and also try to time myself while doing it
I just pinned a new comment with the code sandbox link.
@@DonTheDeveloper Thanks alot
Hey there, I am a student, and I haven't had an internship, I would like do a mock interview as it seems like it's really helpful thing to expernice
Would love to see a mid-level to senior level coding interview around 4-5 years of experience kind
Here you go.
ua-cam.com/video/yju4zwKSriI/v-deo.html
I feel like most of the interviews I've had for a Jr role are mid-level 💀💀💀
Is there a sample that I can practice in?
Hey I may be closer than I thought!!
Respect!
Hi, so i am about getting into a bootcamp for web development and its for beginners without prior knowledge at all , is this Interview for entry level pass?
Thank you for this excellent interview! Are these some common questions for entry level positions?
You can expect any of those questions to potentially come up in a frontend interview. The real question is - should you have answers to all of those questions? Definitely yes.
@@DonTheDeveloper this makes me confident. I listened to the podcast version of this and I was answering the questions out loud. I really need to get those projects done and hosted!
Thank you so much Don😊
Do you have any information about Tech Elevator coding BootCamp? Can you do a review.. I was thinking to join this summer but was not able to find any reviews on UA-cam.
Thanks
You're welcome. I'll certainly keep it in mind. Thanks for the suggestion.
Cool Thanks!!!
Great video guys but tiny font zoom the coding area
How long should one take to finish the whole Pokedex App? Great video btw! Very helpful.
Thanks. I don't think finishing the app or timing it was ever a focus. If you practiced building the app yourself and finished it. That's awesome.
Why fe interview no solve struktur data and algorithm like be but just solve interface?
wait.. im a noob at javascript and have been learning react for about a week, and these questions are pretty easy. is this the difficulty of an average frontend technical interview?
this seems too easy tbh.
The real question is how good are they at writing e2e and unit tests.
I have a front-end Engineer III level interview coming weekdays. can anybody help me to provide the technical interview links
bruh I dont know why but I laughed so hard when the venusaur butt got rendered
It's the little things in life
Can i have the codesandbox links?
thx.
I just recently went on a interview where the person ask me to build a single app with react with fetch, saving data, forms, pages, validations, with all methods to save the new data from the form, basically a crud, delete with a popping ui to ask if you are sure of the delete, and all of that 1 hour, i felt really discourage cause i wasnt able of doing it all, and it was my first interview for a junior job...
That is such a large task, especially if you weren't expecting it. I think that interviewing in itself is a skill that we need to work on - I personally am here because I am pretty well established a developer by now, but I never really had to interview for any of the roles I got. Be encouraged, and I that you at least took something away from that interview!
@@eldowado ty, yeah at least it was worth the experience!
Sounds like a lot of fun. Stop focusing so much on finishing the challenge, and enjoy the process. Talk with the interviewer. Have fun!
Good Lord, I'm currently self-teaching in an effort to change careers, if I ever get to the point of applying for jobs, I'm going to die during the interview.
can we really open google while doing tech interview?
Actually, I felt like a pro when I saw him do the plain javascript :D and I would never be hired as a developer for JS. just a thing like doing the sum of arguments function sum(...args) { return args.reduce((a,b)=>{return a+b})}
getnames function, I wrote as function getNames(arr) { return arr.filter(value=>value.hasOwnProperty("name")).map(value=>value.name) }
but I felt stupid when it comes to react lol :)
What is something that you would traditionally do as backend that is now frontend?
Good video
@22:58, having !important in the css is a no-no in my opinion
If this is what Frontend Interview look like, then I'm ready for interview. I don't think anyone can get hired with this preparation. Am I right?
Would this be an "entry level" interview or would this be a mid/senior interview? Trying to gauge the complexity level of the react project from the perspective of someone who is brand new to coding (me).
This is an entry level interview ...back then. It'll be a little more difficult now for entry level developers.
Just wondering which level of position does this interview aim to?
junior
For some reason, this guy has techlead vibe...I don't know why :D
till 13:36
oh boy
Don i appreciate this format of video but there is a issue about 720p quality and that makes hard to read the codes shown.
Thanks again for your content 🙏
Bump it up to 1080p. Looks readable on my end.
@@DonTheDeveloper Ohh , i pressed Higher picture Quality, this option sets no more than 720p.
I put this video on 1080p by accessing Advanced mode option .
Sorry for disturbing 🥲
I wish I got pokedex problem for an interview :)
That'd be so much fun.
I’m going to be honest; I’m very scared on seeming dumb during these interviews… that crazy thing I’m just starting a Thinkful bootcamp and 3 days in my prep and I feel like I’ve just absorbed nothing
wanna talk personally with you is it possible?