Google Frontend Interview With A Frontend Expert
Рет қаралды 1,034,474
2 жыл бұрынIn this video, I conduct a mock Google frontend interview with a frontend expert, Conner Ardman, who's also the FrontendExpert course creator and an ex-Facebook software engineer. As a Google Software Engineer, I interviewed dozens of candidates. This is exactly the type of frontend coding interview that you would get at Google or any other big tech company.
Check out the Google Frontend CSS interview that we filmed on Conner's channel: • Frontend CSS Coding In...
AlgoExpert: www.algoexpert.io/clem
SystemsExpert: www.systemsexpert.io/clem
MLExpert: www.algoexpert.io/ml
FrontendExpert: www.frontendexpert.io/clem
ProgrammingExpert: www.programmingexpert.io/clem
My LinkedIn: / clementmihailescu
My Twitter: / clemmihai
My Instagram: / clement_mihailescu
Prepping for coding interviews or systems design interviews? Practice with hundreds of video explanations of popular interview questions and a full-fledged coding workspace on AlgoExpert - www.algoexpert.io - and use the promo code "clem" for a discount on the platform!
@clem 2 жыл бұрын
Wanna build the next FrontendExpert? We're hiring course creators to build out new products on AlgoExpert! Learn more and apply here: www.algoexpert.io/jobs
@somerandomchannel382 2 жыл бұрын
young people trying to sound expert by using Promise all and some very basic JS code examples with document.createElement and append? This isn't even pair with a shorter Frontend Course in 3 weeks. Heaven almighty.
@caolijun2010 2 жыл бұрын
@@somerandomchannel382 u should tell young man how to pick up javascript and what is source code of "doucment.createElement" in c or c++ by chrome or safari
@ibrokhimjalalov2685 Жыл бұрын
Why not event deligation.
@ConnerArdman 2 жыл бұрын
Thanks for having me on, it was a lot of fun! 😀
@arnasjuskevicius4193 2 жыл бұрын
Conner, you are a beast! Great interview example, was super clear! I can learn to communicate ideas loudly from you! I would console.log at the end of every step to check if data is what I expect, even I know that code should work haha. :D
@universecode1101 2 жыл бұрын
Great ✌🏻
@brockharris8169 2 жыл бұрын
This is very cool. Great video Conner.
@ConnerArdman 2 жыл бұрын
@@brockharris8169 Thanks! Hope you're doing well, it's been a minute 😅
@ConnerArdman 2 жыл бұрын
@@arnasjuskevicius4193 Thanks, communicating ideas is definitely something I try to focus on a lot in interviews. And nothing wrong with adding console.log statements in every step. In hindsight, I probably should have logged out the result of each of the transformation functions after writing them. It can be a good sanity check, and it helps make sure you don't lose the interviewer along the way.
@shadestorm3995 2 жыл бұрын
I guess this is what the difference is between an experienced developer and someone like me... I would have run my code 10 times before writing another function... my man is writing logics with such confidence...
@biggestthreattoyourexistence 2 жыл бұрын
It's not a real interview Conner is a genius.
@mr.mystiks9968 2 жыл бұрын
@@biggestthreattoyourexistence it’s pretty realistic for candidates that know how to interview well. doesn’t take a “genius” to do this.
@vulcanvulcan2963 2 жыл бұрын
My manager will write hundreds of lines of code before testing anything and he gets it 99% correct every time. He’s been doing it for around 8 years and the biggest difference between someone like him and a beginner is that they have a very strong understanding of how they are going to solve the entire problem from the beginning, even complex problems. Lots of beginners try to come up with the steps to a solution as they develop and will get confused because they don’t have a clear understanding of what their final solution should be.
@mileicampeonmundial 2 жыл бұрын
to be fair it was too basic
@shinchannohara9511 2 жыл бұрын
@@vulcanvulcan2963 thanks for the comment❤😃
@Skalexsong 2 жыл бұрын
This is such a great example of a very confident interview, gotta learn a lot to be more like that.
@eliotlnguyen7329 2 жыл бұрын
Because of your youtube interview content, I've bought your algo expert course for a full year. The marketing worked.
@clem 2 жыл бұрын
I present to you Conner, also known as FrontendChad. 💪😎 Check out the CSS interview that we did on Conner's channel! kzfaq.info/get/bejne/l9Fko5qkybGugas.html
@davidardo4466 2 жыл бұрын
@clemnt please answer me
@masternobody1896 2 жыл бұрын
Juat got rejected from Google xD
@masternobody1896 2 жыл бұрын
Lol
@osborndelangel5994 2 жыл бұрын
Yo Clem, I just want to say you and Conner are great teachers. You guys have explained concepts that were “scary” and now they’re not.
@DriveandThrive 2 жыл бұрын
The speed in which he did this in is quite impressive. Makes me realize how far I have to go!
@yafetbefkadu8508 2 жыл бұрын
Idk why I feel like watching these just teaches me more things Iv never seen or tried before you can always learn from others and try it yourself
@farazcsk 2 жыл бұрын
Also, the courses are very very good, thanks for creating them. Looking forward to “Mobile expert”!
@hamidubawe4496 2 жыл бұрын
Me too
@loristnorton3723 5 ай бұрын
Thinking about the solutions is one thing. But properly articulating it with a coherent accuracy is without a doubt a mark of someone with confidence and experience.
@leeboyin945 2 жыл бұрын
Great demonstration! As both interviewer and interviewee, I learned a lot from this video, thanks.
@hemantprasad1018 2 жыл бұрын
Thank you Clement 💓💓💓. Was waiting for it for so long....
@user-tw7ox8dd2b 2 жыл бұрын
That's just very cool, a few times ago I couldn't explain how works with the DOM. It's just really simple and very useful.
@CoderGrammer Жыл бұрын
As a primarily back end dev, this was eye opening! Thanks buddy
@MatejDrbohlav01 Жыл бұрын
Exactly what I thought, I 100% agree, it is just beautiful and fulfills the picture.
@RockstahRolln 2 жыл бұрын
Thank you for this Terrific video! I needed exactly this to practice my interview questions! Great job to you both!
@RockstahRolln 2 жыл бұрын
@Nikola B. Ethics and problem-solving are two different things, perhaps you should learn the difference first. On my own, I am learning how to solve problems. In fact, I have been doing so at the different companies I have worked for several years. I would like to have a fighting chance by learning how to pass certain interview questions and this right here demonstrates that. If you find this unethical, then you should'nt be here. Have a Blessed day!
@RockstahRolln 2 жыл бұрын
@Nikola B. Oufff This right here, what you have said "Can you at least treat me as a fellow human being and spit to my face without pretending you're kind?" why would I spit on your face when you were the one to come at me about ethics? I did not ask for cheat codes, so please do NOT imply that or, simply assume so. I am merely learning here as do everyone else who has positively commented on here. So yes, thank you, I will feed the right wolf that I choose. If you choose what I have said to be poison, then so be it. Your choice.
@030426101993 2 жыл бұрын
Thank you for making this video. This is just awesome and super helpful for my upcoming interview.
@havefun5519 2 жыл бұрын
Really cool, detailed explanation and good enough speed.
@neeeeeck9005 2 жыл бұрын
Do Front-end devs at google get specific type of algorithm questions? Or are those universal, same as for software engineers?
@dongwong297 Жыл бұрын
Loved this video! I am new to coding and have never seen frontend, so this is was real fun :)
@DebashishGhoshOfficial 2 жыл бұрын
This shows how important it is to choose a proper data structure for the problem. Otherwise it would be difficult to navigate the code and understand what is being done.
@nnlniclb 2 жыл бұрын
I have been learning to code for the last month or so but I still don't understand what you mean by a proper data structure for the problem. Can you please explain like I'm 5?
@joni062443 5 ай бұрын
Very true. Fundamentals is always key, frontend or backend. DSA is king. Lots of practice and build lots of things.
@MrJettann 2 жыл бұрын
instead of creating every element on the page, can we use template and fill it's fields with our info? It template tag not recommended now?
@benjaminmoseslieb9856 2 жыл бұрын
Can someone explain why he didn't use an HTML template strings and opted for creating javascript elements? I must be missing something, because that's what I would have gone for.
@omrtheater7244 2 жыл бұрын
Why do we need to await inside the fetchAndAppendQuestions function? Isn't it enough we used await once during fetch?
@Gugmi 2 жыл бұрын
Is it wrong to use question mark conditionals in this type of interview? Also I’m assuming using a library like Axios is out of the question for this type of interview?
@jahangirakbar4524 Жыл бұрын
My question is: Do you have to work on designing part aswell as a front end web developer?
@aman.social2100 2 жыл бұрын
That was really smooth. STRONG HIRE!! Agree 💯%
@luketutber9326 2 жыл бұрын
Once again, a very good video by Clement.
@9990490677 2 жыл бұрын
Apart from the API building round, my Front End interview for Google did not have any FE specific round.
@MatejDrbohlav01 Жыл бұрын
hey! I am a junior java developer now fo several month and have 1 year BootCamp behind as well (backend java) - I think I now understand what "front-end" development means! And it is beautiful! It fulfills the picture, it is just soooo good :) gl with everything :))
@qweqwe_Flinstone Жыл бұрын
wow i learned so much after almost one hour video :O I hope theres more like this videos on your channel D:
@ATIWatchReviews 2 жыл бұрын
This is fantastic, thank you both
@SMURFPICTURES 2 жыл бұрын
is it really good design to make everything a const? especially when creating an empty object knowing its gonna be populated later?
@explore-learn-share6937 2 жыл бұрын
This is outstanding. Using plain html, css and javascript for wonderful page rendering
@aurelianspodarec2629 2 жыл бұрын
Pretty basics. Would be better off using factories instead and create functions for the API calls, make it abstract etc... Nothing special.
@mrchedda Жыл бұрын
Not the React way unfortunately. 12:30
@rebelshadowrm 2 жыл бұрын
What is the advantage of creating elements vs cloning a template? when creating those question items.
@AndresLobaton 2 жыл бұрын
Awsome, I liked a lot this interview. I hope in a couple of years try to apply to one of this roles. Thank you so much
@deathbombs 2 жыл бұрын
13:05 what Fragments would help prevent repainting if category divi was added?
@17teacmrocks 2 жыл бұрын
when I interviewed for Google FE, they asked me all algo questions? I didn't do anything like this. It was like dfs, bfs, rate limiter, compose pipe, string algos, trie, tree
@adrieleteodoro6551 Жыл бұрын
I just started learning code, and I would like to know, is all the interviews for software developer is like this? Or there other ways of interview?
@sanjeev3799 2 жыл бұрын
Very nice, helpful and motivating. Thank you!
@khaledbenzid5365 2 жыл бұрын
Bro can center a div
@user-nh7vn8nx3h 10 ай бұрын
I'm a junior react devoloper and I want to ask if they will always ask us about vanilla JavaScript, even though I'm using react they will interview my js like this ?
@hoangphan5224 2 жыл бұрын
That's the best FE interview format!
@BinaryAdventure 2 жыл бұрын
Clement are you still rocking the ultra-minimalist apartment? I see a big monitor back there... I'm getting worried 😅
@blaaeeke 5 ай бұрын
Anything wrong with creating these elements with .innerHtml and a couple of string literals?
@ardhiyanah5544 2 жыл бұрын
Some i learned from this video is promise all and replace function, thank you so much for new insight, oh and you miss the progress bar, it was mentioned in the early interview but yeah the code still amazing to me
@levin1160 2 жыл бұрын
Nice function building and logics, could use this to improve mine ^^. How many years of exp did he have?
@licokr 2 жыл бұрын
It's an interesting interview :) So amazing, I hope that here I live frontend engineer interviews would be going like you guys do here. Thank you for the great video!
@johnames6430 Жыл бұрын
I've heard some stories where a company had the candidates build things with pasta for the tech interview in a small groups, there are many insane things when hiring in tech
@VishakhasEngineeredPlans 2 жыл бұрын
This was so so cool and helpful! There are not many frontend interview prep videos, and this is just what I was looking for! Is it okay if I recreate/use the api endpoints to practice this same problem?
@clem 2 жыл бұрын
Sure. Alternatively, buy FrontendExpert and get access to way more problems! 💪 frontendexpert.io
@VishakhasEngineeredPlans 2 жыл бұрын
@@clem Looking into it right now :) Did have a question, does it provide the env like you've shown in the video? I mean will I be able to run and test my code for promises and array problems etc.?
@joelvarghese3370 2 жыл бұрын
@@andreigugeanu Yes, this happens when you call an API from another domain. I don't think there's anything you can do from the front end to solve it. I'm not sure though and maybe others could add to it.
@adsarasin 2 жыл бұрын
@@VishakhasEngineeredPlans yup! You are seeing them use the platform in the video. It would be the same.
@Booyamakashi 2 жыл бұрын
Interesting approach with building the DOM using DOM. My first intuition was to create a template literal and just call functions inside of it. Kind of like templating language.
@tuxsbro Жыл бұрын
Then you have to worry about XSS
@johnames6430 Жыл бұрын
@@bleulejour forget all that and use Svelte?
@FeFeronkaMetallica 4 ай бұрын
This
@Alex-xo1nt 2 жыл бұрын
I learned a lot from this. Thank you!
@riessnico 5 ай бұрын
Why did he choose an object for the questionsByCategory and not an array?
@abhaytiwari6411 2 жыл бұрын
Please bring more video like this one.
@PaulNechifor 9 ай бұрын
How come you write Clement with an accent on e, but you write Mihăilescu without the ă?
@Gringo0517 2 жыл бұрын
Thanks Connor! Great interview
@abhinavghosh725 2 жыл бұрын
The Google Backend interview is going to be interesting !!!!
@salihiyassine2355 2 жыл бұрын
Can you please do the same with backend interview (java, spring, ...), thanks a lot
@MikeBertelsenDK 2 жыл бұрын
The interviewer is really intense.. Kinda stresses me out.. But it was very interesting to watch, great content, challenges and I learned something new so that's always worth celebrating!
@clashwithmoi8926 4 ай бұрын
you can call prototype functions either way. both will work. that's the beauty of it
@rishabhkumarT 2 жыл бұрын
what is the experince level for this interview?
@jitujahagirdar613 2 жыл бұрын
I think when you count the correct counter missing partially correct count in count I am not sure 🤔 I think I might be wrong
@recalltechnique1560 Жыл бұрын
Would the interviewee normally talk through their solution as they build it?
@pratikkumar939 2 жыл бұрын
Was Waiting for this
@ericwango Жыл бұрын
I completely understand the logic and it doesn't seem too hard, but it would take me half a day to actually get the right logic and code it up like he did hahahah
@jialx 2 жыл бұрын
These interviews are super realistic of what its like to be a FE dev.. I always code using a web based IDE, implement features with another dev looking over my shoulder, and explain every decision I make as I make them out loud.
@NathanHedglin 2 жыл бұрын
😂 right? Interviewing is a completely different skillset. Imagine hiring a chef solely based on his ability to sharpen knives.
@jakubnowak7091 2 жыл бұрын
presenting your skills is a part of this job, unless you want to be a underpaid specialist
@aufkeinsten7883 2 жыл бұрын
@@jakubnowak7091 Presenting your solution is only a part of interviewing though, the more problematic part is performing your job while having someone look over your shoulder, that someone being the deciding factor in whether you get the job you want. Without trying to add to stereotypes, I do also think it's fair to say that this is especially bad for people who - on average - tend to be more shy and less skilled in social situations.
@johnames6430 Жыл бұрын
@@aufkeinsten7883 many great people have been denied jobs because they are shy when they might have been really good for it, that's just part of the discrimination that goes on in hiring and if we are going to correct for discrimination based on race and gender we must also correct for discrimination based on shyness, disability, and many other things.
@reikromulis7747 2 жыл бұрын
i see that you hid the url, not sure why as you need to log in, tho bottom left still displays the URL regardless :)
@jordanspano 2 жыл бұрын
Why weren't template literals used? That createCategory function is unreadable.
@bavideomaker29 2 жыл бұрын
I enjoy these, great job. But, I’m old and often can’t see much of the text. Is there any way you can zoom in or use larger fonts in the future so those of us who started coding on Apple II’s can read?
@makkie8593 2 жыл бұрын
I use youtube in browser so i can zoom in
@siposrr Жыл бұрын
In quality 360p or 480p you cannot read the texts properly, even on a monitor. You should try it with min. 720p.
@TheBarthinator Жыл бұрын
after 4 years working in the industry i fully understood everything and would have probably coded it the same way, however, my man is very bold not testing functions throughout i would have tested each one checking the data with not as much confidence as him!
@georgeak4454 2 жыл бұрын
amazing video .what about full - stack or android?? or back end
@vnm_8945 2 жыл бұрын
this interview would be for what seniority?
@Basicallyidonotwrk 2 жыл бұрын
I am just a plain beginner as a developer and I get so afraid of interviews and especially coding interviews Any tips and advice to not get be frustrated and super nervous I swear I won’t be able to say 1+1= 2 in an interview without thinking 20 times
@Aihab1 2 жыл бұрын
The problem with choosing any random category and adding a question into it (for the random complexity question) is that you can't control the number of questions going into one category and as I see on the screen, if the count of random categories was 4, all the questions were almost equally divided into each of the 4 categories. Thoughts?
@laskiri1875 9 ай бұрын
randomize your array of questions first and then come the first questions.length/4 questions into the first category and so on (assuming you have 4 categories. First thing that pops into my mind atleast.
@edited_official Ай бұрын
Always do big companies test frontend developers practically?
@everydaycode1535 2 жыл бұрын
Can u get hire as frontend dev? I’m working angular and react
@bugagashen6ka Жыл бұрын
So you guys do not practice TDD during interviews at all?
@lukasmajerik6439 2 жыл бұрын
Cool demonstration. Thx!
@izopi4a 2 жыл бұрын
a simple page with 3 functions, "fist step is to use react". way to go
@AbmAsadullah Жыл бұрын
Many many thanks, Really helpful for me!!
@alexe3332 2 жыл бұрын
41 min. If you want to order the categories, you have to assign each category as a key then when finished, iterate through the keys and sort them in an array then every time you select, select from the array and use the value to point to the key in the object. Once you get that, you just iterate through that set within the category. I just had to do this myself.
@omrtheater7244 2 жыл бұрын
What's does "for (const [category, questions] of...)" mean? He only defined category and not questions. What does this do?
@darrylbrian 2 жыл бұрын
this is destructuring. const [a, b] = [10, 20]; console.log(a); // output: 10 console.log(b); // output: 20
@grandstarchief3226 Жыл бұрын
Why my google frontend interview asked a leetcode hard similar new question. I finished it and not passed.
@mostafakheibary763 2 жыл бұрын
is it okey to make elements with tamplate string insted of making it with createElements ? for example 'somthing'
@mostafakheibary763 2 жыл бұрын
@nanababes bangkok 👍
@cryzz0n 2 жыл бұрын
Awesome content. Would Google interviewers allow us to use Angular instead of vanilla for implementation questions?
@biggestthreattoyourexistence 2 жыл бұрын
no
@alibadra5367 2 жыл бұрын
Is is this interview quest supposed hard?
@jaysongoku2274 2 жыл бұрын
companies still do live coding interview?
@TheWarmestWaffle 2 жыл бұрын
But... can he center a div?
@universecode1101 2 жыл бұрын
Cool 😎a frontend can apply for frontend position and software engineer or just the first?
@krishnachaitanya4067 2 жыл бұрын
Hi Clem can you share the question with us please?
@mrmiagi6052 Жыл бұрын
wow, I am able to understand the code written in the video but theres no way I could do this within this time frame, would need to do look a bunch of this up to successfully create it. I guess i need to keep practicing javascript and technical questions
@vaggelisk9401 2 жыл бұрын
Hey Clement, great content. Was actually wondering. Do FANG interviewers impose any limitation on JS prototype methods to be used? For example i saw "forEach" and "Object.entries" was used. Is there a scenario where an interviewer will ask everything custom built on a lower level?
@user-mx1ek4sl2m 2 жыл бұрын
No.
@jarrellidk 2 жыл бұрын
Yes and no. They won’t say “don’t use this” but they WILL say “with a max time complexity of X or to keep time complexity in mind” which is basically a more vague version of telling you what not to use.
@YouTubePL666 2 жыл бұрын
this is basically low level as you use built in language features. What they could state is to make something more optimal in terms of memory usage or performance or both
@mitarskoro1087 2 жыл бұрын
Absolutely... its often the case that you are asked to re-implement one of these methods
@omrtheater7244 2 жыл бұрын
Isn't this line is going to make the questionByCategory a constant therefore unchangeable?: const questionByCategory = {}. Isn't he supposed to use 'let' to enter keys and values into the object?
@darrylbrian 2 жыл бұрын
objects and arrays are mutable. even though they’re declared with const you can still add properties to them and change the values of those properties. you just can’t change the type.
@_Sizzin 2 жыл бұрын
That was, surprisingly for what I expected from Google interviews, a quite easy challenge. I would have done the code similarly. Though I'm not confident I would answer the "how would you clean up the code" as well as he did.
@jww0007 Жыл бұрын
if it was harder how would you complete it in 45m. interviews are about communication & problem solving, you'd be surprised how many people can't do this as calmy
@_Sizzin Жыл бұрын
@@jww0007 A harder challenge not necessarily means that it takes longer to complete. Believe me, I've had much more difficult live coding challenges from companies half as big as Google.
@theLowestPointInMyLife Жыл бұрын
No way the real interviews would have something this basic.
@catalineu77 Жыл бұрын
@@theLowestPointInMyLife NoT EvERY OnE iS As SkiLlEd LIkE YoU,ThIS Is MoCK INtErVIew So US ThE UnSkILlED PLeBs CaN LeArN ALoNG ThE Way,ok boss?
@nghiainhtrong8052 Жыл бұрын
it's for junior dev?
@pinpon163 2 жыл бұрын
Would it be okay to use react instead of vanilla JS for something like this? I just realized I have forgotten a lot of vanilla JS
@johnames6430 Жыл бұрын
nope, if you do it the real-life way you don't get the job
@nghiainhtrong8052 Жыл бұрын
@@johnames6430 i code by reactjs. and now there's a lot of vanilla JS code that I don't even remember :(
@93hothead 10 ай бұрын
Please tell me this is for beginners
@seobookpro 2 жыл бұрын
Very interesting there is a more options to achieve tasks like this actually.
@hotdota2 2 жыл бұрын
As I see it was it interview for Junior level, right?
@danielcooke3243 Жыл бұрын
hasOwnProperty checks the entire prototype chain so its not recommended to use it over plain object indexing. So already a mark down for that
@Sindoku Жыл бұрын
I definitely feel I could pass this portion of the interview at Google.
IGotAnOffer: Engineering
Рет қаралды 1 МЛН
Nir Gaming
Рет қаралды 4 МЛН
One More German
Рет қаралды 1,2 МЛН
ALFA TRICKS
Рет қаралды 12 МЛН
Alex Boyko
Рет қаралды 320 М.