Intermediate React.js Coding Interview (ft. Clément Mihailescu)

Поділитися
Вставка
  • Опубліковано 21 лис 2024

КОМЕНТАРІ • 479

  • @bawad
    @bawad  3 роки тому +118

    Checkout the video we made on Clément's channel where I do an intermediate Algo interview: ua-cam.com/video/4tYoVx0QoN0/v-deo.html

    • @alhajee
      @alhajee 2 роки тому +1

      That smile on your face at 13:00 seeing Clement over-engineer. Simply maping the values would have solved the problem

  • @clem
    @clem 3 роки тому +1273

    This intermediate React interview was fun, but now I wonder…
    How fun would a *hard* React interview be? 👀

    • @neethology
      @neethology 3 роки тому +7

      Good question, no sweat for you.

    • @Yassinebridii
      @Yassinebridii 3 роки тому +19

      An advanced coding Interview would be cool to see too.

    • @robinsu3796
      @robinsu3796 3 роки тому +12

      I think it’s time for redux then

    • @ryanspivey1819
      @ryanspivey1819 3 роки тому +5

      bro you need to shave

    • @tkdevlop
      @tkdevlop 3 роки тому +5

      Implement react Reconciliation
      In 45 mins

  • @merlin6962
    @merlin6962 3 роки тому +554

    I have never seen someone over engineering a simple task like that. Respect!

    • @samgord4669
      @samgord4669 3 роки тому +24

      this is the comment i was looking for. #respect

    • @brothercaleb
      @brothercaleb 3 роки тому +1

      😂

    • @qreamybean
      @qreamybean 3 роки тому +10

      I came looking for this comment. I was in awe the entire time! haha

    • @Maxwellpaulwall
      @Maxwellpaulwall 3 роки тому +7

      Yeah I was thinking the same thing. Wtf?? Was there a point to that?

    • @Jindujun
      @Jindujun 3 роки тому +2

      yeah, I was shaking my head sometimes but I guess thats how amazing minds work xD

  • @firstdev1653
    @firstdev1653 3 роки тому +299

    Ben: can you flatten this simple object?
    Clément: sure here is a recursive linear time complexity algorithm to flatten every possible object in the world

  • @jihadkhawaja
    @jihadkhawaja 3 роки тому +703

    Fun fact, Ben was too lazy to do it so he made this interview up so Clement finish it for him

  • @Justenphelps
    @Justenphelps 3 роки тому +95

    Ben, your smug smile during the interview would simply make me shit myself thinking I was always wrong.

  • @efdezpolo
    @efdezpolo 3 роки тому +72

    We started with a table, now we have an AbstractTableHeaderGeneratorFactory

  • @xit
    @xit 3 роки тому +297

    The title should be "Dynamically flattening objects in javascript with Ex-Googler - Clément Mihailescu " XD

    • @sammusaev5883
      @sammusaev5883 3 роки тому +45

      "Babe, it's 4pm. Time for your dynamic object flattening. "

    • @smoothbeak
      @smoothbeak 3 роки тому +8

      That dude worked at Google :P?

    • @xit
      @xit 3 роки тому +2

      @@smoothbeak Yeah! No Cap XD

    • @Avoidlol
      @Avoidlol 2 роки тому

      lmao, so true. never heard the word "flattened" so many times in 30 minutes

  • @josesoto3594
    @josesoto3594 3 роки тому +276

    Man i was like shit they think so fast... then I realized i watch yt on x2

    • @shamimahmedrian4222
      @shamimahmedrian4222 3 роки тому +4

      This is hilarious

    • @satyasrikar709
      @satyasrikar709 3 роки тому +1

      this is so funny xD

    • @vinayvarma266
      @vinayvarma266 3 роки тому +1

      Same with typing speed

    • @splasher2119
      @splasher2119 3 роки тому +7

      It's hard to believe that you were watching on 2x and never noticed 😕 maybe say something more realistic next time

    • @unarei
      @unarei 3 роки тому +7

      @@splasher2119 I watch everything on 2x so I don't notice it usually

  • @crvlwanek
    @crvlwanek 3 роки тому +44

    Look at how happy Ben is when there's not a graph matrix involved

  • @is-zzal
    @is-zzal 3 роки тому +184

    me: I know React, Vue, Svelte and SEO best practices.
    my interviewer: good. please solve riemann hypothesis with the least space & time complexity. I will give you 10 minutes to solve. good luck.

    • @cryptonative
      @cryptonative 3 роки тому +71

      lucky they didn’t ask to center a div

    • @gountaa
      @gountaa 3 роки тому +6

      @@cryptonative #myUglyDiv{
      left : calc( 50% - somebullshit value that makes my div looks almost centered);
      }

    • @TheoParis
      @TheoParis 3 роки тому +5

      @@gountaa i just use flexbox

    • @paucolome4298
      @paucolome4298 3 роки тому +3

      @@gountaa bruh

    • @gountaa
      @gountaa 3 роки тому +10

      @@paucolome4298 It's best practice trust me i read it on a 14 years old stack overflow post

  • @Souljacker7
    @Souljacker7 3 роки тому +34

    I love watching people way smarter than me struggling with things that are fairly simple to me!

    • @timm8998
      @timm8998 Рік тому +1

      How do you know he is smarter?

    • @MyKneeHurts
      @MyKneeHurts 8 місяців тому

      maybe because he is at an advanced level of programming within just a couple of years of starting, along with the fact that he did math at uPenn. idk tho@@timm8998

    • @sabukuna
      @sabukuna 6 місяців тому

      @@timm8998 i guess the way he over-engineered it

  • @LoLei3239
    @LoLei3239 3 роки тому +147

    All this dynamic flattening might be neat in other use cases, but since this is TS, and a presumably well-defined API response that doesn't have too many fields, creating an interface and working with defined object keys would be so much easier IMO. Specifying an interface (or multiple) for the API response would have been my first step actually.

    • @jkho8365
      @jkho8365 3 роки тому

      What's ur thought on .then vs await?

    • @danshilm
      @danshilm 3 роки тому +8

      @@jkho8365 I default to using await and only use .then if I have a good reason to.

    • @jkho8365
      @jkho8365 3 роки тому +2

      @@danshilm same I use await too. Seeing Clement do it and not sure if there's a good reason too tho

    • @danshilm
      @danshilm 3 роки тому +5

      @@jkho8365 the 2 are almost identical in the way they work, in performance and the only big difference I've found is when handling errors. There's a long article about it on the v8 blog if you want to read about the technical details of this - this is the relevant section: v8.dev/blog/fast-async#await-under-the-hood

    • @jkho8365
      @jkho8365 3 роки тому

      @@danshilm thanks

  • @lonestarstatechris
    @lonestarstatechris 2 роки тому +3

    I completed a full stack boot camp with js/react/node. It began 9/19, but ended 3/20 right as pandemic started. Knew I wasn’t going to find a job right away so went right into a data science boot camp that promised a job as long as you finish. Got a job as an analyst and hardly even doing any programming now, just a little Python on the side. Originally got into it because I loved learning to code and now getting back into the dev side. I personally love JS and React so much more than Python. I have used a little Flask, but React just seems more enjoyable to me.
    These videos are helpful to get me ready to search for a role that allows me to use both skill sets. Thx

  • @sadhlife
    @sadhlife 3 роки тому +19

    36:28 sort function: works first try
    Ben, knowing the pains of javascript development: "beautiful"

  • @TheAwesomeness490
    @TheAwesomeness490 3 роки тому +18

    Ben is one of the only youtubers that I don’t have any second thoughts about watching videos longer than 30 mins

  • @amysheeter877
    @amysheeter877 Рік тому +4

    Watching Ben watch Clem over engineer is better than any comedy show I've ever seen.

  • @guanxi99
    @guanxi99 3 роки тому +35

    One hour coding without looking anything up on the web or pasting something from stackoverflow?
    Cudos!

  • @thefakedeal
    @thefakedeal 3 роки тому +147

    Watching him flatten the object really made my head hurt

    • @kadensharpin2156
      @kadensharpin2156 3 роки тому +48

      It was unnecessarily over complicated

    • @thesupercoach
      @thesupercoach 3 роки тому +24

      @@kadensharpin2156 Agreed. He read too much into it, got told he read too much into it and decided to keep going anyway.

    • @Aurora99aroruA
      @Aurora99aroruA 3 роки тому +5

      Yeah that got overcomplicated by simultaneously introducing dynamically generating the keys / table headers, which is kind of unrelated other than it becoming more complex in a context of flattening. It is a requirement by itself with pros and cons, the latter being that your table will look different depending on your input (first input in this case). There was no requirement for this at all as I understood the assignment.

    • @wizard_of_az
      @wizard_of_az 3 роки тому +3

      He had overcommitted to his intuition while missing the que from the interviewer to simplify the solution. So fun to come across this while working...

    • @hstandeffer
      @hstandeffer 3 роки тому +9

      I’m sure being around algo based problems all day makes you think the simplest approach is never right when in this case it obviously was

  • @TotallyNotZoid
    @TotallyNotZoid 3 роки тому +15

    I feel good knowing that few years ago I didn't even know what DOM is and now I can easily do all of these things!

  • @mexicanmax227
    @mexicanmax227 3 роки тому +27

    Question for Ben and Clément! Can y’all each make a video for best practices in React in front end and best practices in Python for algorithms?

  • @kevinbatdorf
    @kevinbatdorf 3 роки тому +31

    pro tip: using the index as the key attribute is an anti pattern. Use something unique to the item instead (and make sure it’s a primitive type)

    • @jimmyliaouwu
      @jimmyliaouwu 3 роки тому +3

      Yes, especially you have sorting feature.

    • @joecamroberon9322
      @joecamroberon9322 3 роки тому +3

      Yea I remember reading about this recently. It worsens performance because it messes with React’s reconciliation process. When you have indices for a key and you move elements around, React loses track of what was updated/added/removed due to the same key switching nodes. I think this is how it happened at least

    • @akj3344
      @akj3344 2 роки тому

      @@joecamroberon9322 correct.

    • @kevinbatdorf
      @kevinbatdorf 2 роки тому

      @Sebastian Voráč be careful with that too because it will bust the cache if sorting happens, making your app less performant.

  • @brandongoldsmith1765
    @brandongoldsmith1765 3 роки тому +22

    It’s crazy I literally had to do this this week for my react internship! Wow I’m an intermediate now

    • @kokokok7171
      @kokokok7171 3 роки тому +1

      Not like you can come up with all this from just your mind

  • @brothercaleb
    @brothercaleb 3 роки тому +3

    Kudos to Clement for putting himself on the spot. 👏🏽👏🏽👏🏽👏🏽

  • @fullstack_journey
    @fullstack_journey 3 роки тому +8

    U could store 1 or -1 as sorting direction and multiply them with -1 to get the appropriate return values
    sortingDirection = 1
    if a < b, return sortingDirection * -1
    if a > b, return sortingDirection
    if a = b, return 0

  • @shivamsahil3660
    @shivamsahil3660 3 роки тому +3

    I loved the way this guy implemented recursion effortlessly. I keep struggling a lot with recursion at times... Also I realized I was watching it at 2x speed.

  • @yulongwang249
    @yulongwang249 3 роки тому +5

    Most of the people won’t be able to do this much given the same amount of time, so definitely impressive there. One thing I think would be helpful for the viewers is to explain different ways to structure the code so that the code is more maintainable and performant :)

  • @prasunkumar_
    @prasunkumar_ 3 роки тому +6

    I recently had to implement this kind of table where the table had bunch of row & colum level actions and a annoying nested object to deal with and I can feel Clement here! And to increase the complexity the table was live that is it was continuously getting updates from a live feed and to implement sort, filter to that etc. Was another ball game.

  • @abhishekvishwakarma9045
    @abhishekvishwakarma9045 3 роки тому +66

    Watched 1st part when I am beginner😅 in react now I am working in a company as a full stack it's been so long 😆

    • @DaJukes
      @DaJukes 3 роки тому +1

      working in india?

    • @sur_shrimpster
      @sur_shrimpster 3 роки тому +9

      @@DaJukes why does it matter? smh 😑

    • @ahmadmuslih
      @ahmadmuslih 3 роки тому +5

      @@sur_shrimpster bruh chill he just asked

    • @karthik_sama
      @karthik_sama 3 роки тому

      Where do u work bro?

    • @Vilhena6969
      @Vilhena6969 3 роки тому

      me too :D

  • @dbmscreen
    @dbmscreen 3 роки тому +3

    TIL the Clement full text search. Thank you Clement I like it! Astig!

  • @carloseustaquio7785
    @carloseustaquio7785 3 роки тому +23

    Wow, Clememént struggled with the flat obj stuf man

  • @azsamsiizbrah
    @azsamsiizbrah 3 роки тому +7

    Damn this stringify moment was hilarious! Great creativity, love the interview

  • @ninjaasmoke
    @ninjaasmoke 3 роки тому +2

    What a trip down memory lane!
    I had just started learning React when I saw the previous interview.
    I'm still learning, but ik all the things done in this video

    • @saikumar880120
      @saikumar880120 3 роки тому

      Any tips on learning react?
      good website to study? approach? and all that

  • @forbiddensongs
    @forbiddensongs 3 роки тому +42

    this has to be a good example of over-engineering failing you an interview. not only was it severely over-engineered, it also wasn't really a good solution. why would you ever want to get data from an API and dynamically display everything it returns? you have no control over what you display.
    either way, cool vid ;>

  • @jay-pitroda
    @jay-pitroda 3 роки тому +29

    18:40 Ben: what have I got my self into

  • @samgord4669
    @samgord4669 3 роки тому +9

    ok so, i just wanna share my react interview experience for a job i did not get. i've been working with react on and off in the past 3 years. i watched these two videos to see if i'm ok or not and both of these videos were too easy for me. i also passed the first assigned coding challenge the company gave me, it was nothing but fetching, rendering and filtering data based on an input field and writing some tests for it. but the reason i failed the interview and did not get the job was the following questions that i couldn't answer properly :
    1- what is virtual dom and what are the benefits of it?
    2- how to test an endpoint on the front end ?
    3- we know we should update the state in an immutable way, but why? what happens if we don't ?
    4- what is the event loop?
    5- what are pure functions?
    ----
    there were other questions that i answered like about closures or higher order components. but the 5 above took me down.
    honestly i'm a little mad about the 1st and 4th question, because i don't really understand how knowing the answer to them makes me a better dev. but anyways... make sure you know the answer to these. happy coding!

    • @cosmin4437
      @cosmin4437 2 роки тому

      Do you know the answers now for 2, 3 and 5? 😇

  • @Musa-lf5yn
    @Musa-lf5yn 3 роки тому +6

    I was an Angular developer when I watched the first part. I moved to react recently.😅

  • @ankitbatra270
    @ankitbatra270 3 роки тому +78

    53:01 *Ben bursting out laughing* "Do you have prod code that does this?? 😂"

  • @julian_handpan
    @julian_handpan 3 роки тому +3

    Stackoverflow: flat array js
    Copy, paste
    Continue
    Less than 1 minute
    🤯

  • @Papa_Static
    @Papa_Static 2 місяці тому

    I have an interview coming up, and coded along with Ben's prompts. Clem made me self-conscious 😂😂 I went with simpler solutions at most steps

  • @madomation7984
    @madomation7984 3 роки тому +5

    I like how both of them interview each other

  • @samuelgunter
    @samuelgunter 3 роки тому +7

    I forgot that you can have helper functions *outside* of your React.FC... I've always had them on the inside of the React.FC, but that's inefficient because every instance of the component has to create that callback function upon every render (maybe helped with useCallback), but storing the callbacks outside of the component won't require any duplication. (Like how pre-ES6 classes, we were supposed to add functions to a "class"'s prototype instead of storing the function directly in the class, to reduce duplication)

  • @dan_vl1909
    @dan_vl1909 3 роки тому

    I am grateful that I got Clement's video recommended, these kind of videos does it job when you are not too deep in some stuff. Like in this scenario, frameworks. I've understood a lot about React with these two videos (and also the long video that wrapped all React hooks tutorials)

  • @inordirectional
    @inordirectional 3 роки тому +2

    I was just building a little react app which has a couple table-based displays, was thinking of adding column based sorting and a search function so this is great. Now I just need to get Clem to do a mock interview with me

  • @thomasgipson7120
    @thomasgipson7120 2 роки тому +1

    Ben's subtle smirks make it so funny. Wayyyy too much for that simple task lol

  • @Aurora99aroruA
    @Aurora99aroruA 3 роки тому +1

    I totally respect that this is all on-the-spot (which makes it great to watch but not suitable for educating beginners), so it's a bit unfair to judge you from the armchair, but some remarks anyway. The flattening vs dynamic has been mentioned, but the sorting function sorting on what the sort order will (presumably) become later on, is unnecessary coupling (just reorder the lines so that newSortingDirections is determined before sortData) . Reversing the sort could also be done by switching a and b at the start, or multiplying the result by -1 for reverse. I 'feel' there's a bit much intermediate variable creation to my taste, but Code Complete would probably approve :)

  • @-seoulair
    @-seoulair Рік тому

    My guy made a recursive object flattening linear complexity algorithm in a react codebase. Insane.

  • @yaku-tecnologia2650
    @yaku-tecnologia2650 3 роки тому +2

    I guess Ben had a 10 line code solution for this. Thats why Front End could be so hard and easy at the same time!

  • @okey5818
    @okey5818 3 роки тому +35

    Clement is an algo and interviews hero.
    But I would never let him write production React code :D

    • @JohnDoeX1966
      @JohnDoeX1966 3 роки тому +1

      Why not? He seems smart to me

    • @tiejeevan
      @tiejeevan 3 роки тому +1

      Fuck that, it's 3 line code. Instead he wrote 30 freaking lines

    • @Jindujun
      @Jindujun 3 роки тому +4

      @@JohnDoeX1966 because he overcomplicates simple problems.

    • @JohnDoeX1966
      @JohnDoeX1966 3 роки тому

      Jindujun oh okay

    • @mayankjha7444
      @mayankjha7444 3 роки тому

      @@tiejeevan but he thought and countered on the fly.

  • @provaprovaprovaaaa9667
    @provaprovaprovaaaa9667 2 роки тому +1

    This is more a JS interview than a ReactJS. Only the first question was really about React.

  • @clivend
    @clivend 3 роки тому +25

    possible titles: "why you are ready for FAANG but you don't know yet", "exposing youtube coders"

  • @abhishektripathi1323
    @abhishektripathi1323 3 роки тому +1

    It helped a lot. I was nervous about how much I know. At least now I don't doubt myself.

  • @MattXChrist
    @MattXChrist Рік тому

    I love how both of them couldn't get that smirk off their face... especially clement

  • @mnl_lnm
    @mnl_lnm 2 роки тому

    damn that curly brace smash of JSON.stringify was cold. Thanks to both for the video, it kinda went off track (to me) in the first part with the overengineering but can't complain!

  • @dragonborn1996
    @dragonborn1996 3 роки тому +1

    Just came from the beginner React coding interview with Clement. Again, this was super informative and helpful. A bit let down you didn't make Clement add authentication like you said you would in the previous video but its all good haha. Awesome vid!

  • @HaibertBuilds
    @HaibertBuilds 9 місяців тому

    the way he casually dropped a recursion solution.. sheeeesh

  • @imthiyazmuhammed2517
    @imthiyazmuhammed2517 3 роки тому +5

    I thought ben is introducing clement , when youtube showed me algoexpert's ad 😁

  • @AshutoshSingh-we9nf
    @AshutoshSingh-we9nf 3 роки тому +1

    Thanks guys, I have been failing at interviews, I have got redirection.

  • @dealloc
    @dealloc 3 роки тому

    I always tend to store the transformed data for display in component state, since that state is tied to the UI. This gives you a single source of truth, easier to maintain, and makes debugging much easier, since the state reflects exactly what will be displayed. And as you may have noticed in the video, you can avoid having to change any UI output in some cases-like adding a sorting functionality.
    If I use global state management, I tend to also store the transformed data there, except if a component does something special with the data that is not compatible with other components that share that same state.

  • @DanOhCaptainDaniel
    @DanOhCaptainDaniel 3 роки тому +6

    This is great. Can we do like 50 more of these?

  • @empyrean5330
    @empyrean5330 2 роки тому

    Haha watching this fresh off of the intermediate Algo Interview on Clement's channel. Tons of fun and I hope you guys can take a shot on a 'Hard' mode sometime!

  • @Vilhena6969
    @Vilhena6969 3 роки тому

    I loved the fun vibe around this coding session ;) looking forward for part 3 - hard mode

  • @BG-fo4si
    @BG-fo4si 3 роки тому +17

    18:41 Ben be like "What the heck, Clement XD"

  • @WanderingNasi
    @WanderingNasi 3 роки тому +1

    As many have mentioned, this is why you write pseudo code and save yourself from over engineering something BEFORE you start coding

  • @smoothbeak
    @smoothbeak 3 роки тому +2

    I'm only 8 minutes in, but I have to say this is a really wonderful video, and helpful for those getting in to the industry.
    In addition I also appreciate the high resolution video, that just makes it that little more enjoyable and easier to follow.

  • @oliverhughes169
    @oliverhughes169 3 роки тому +4

    This is great! But you should probably caveat (make it really obvious) that here you're not following best practices, and are just writing quick code to get something working - just in case newer devs think this is a great example to release to prod!

  • @jfklittle
    @jfklittle 3 роки тому +19

    This is gonna be top notch content

  • @marcoriolo9549
    @marcoriolo9549 3 роки тому +3

    Well now I feel more confident in my skills, having it done in a fraction of the time hahaha

    • @Avoidlol
      @Avoidlol 2 роки тому

      the point of an interview like this is not for you to do it as fast as possible, it's to show off the way you approach problems and the way you think. any beginner can do these tasks obviously

  • @tusharpahuja
    @tusharpahuja 3 роки тому +1

    One should never use personIdx as a key. If the length of data changes, react would re-render the existing entries as well. A separate property like id should be used which is unique and consistent.

  • @Ashishhh0
    @Ashishhh0 3 роки тому

    Nice interview, love to watch more intermediate interviews.💓

  • @justanotherhotguy
    @justanotherhotguy 3 роки тому +2

    Interviews are fun. I’m eighteen and will soon will be questioned. Watching you guys helps me to cool down a bit, but I still fear to get negative experience from one. Thank you.

  • @Gohel95
    @Gohel95 3 роки тому +1

    I was waiting for it from a while..
    thanks, ben💕

  • @handsomecat7225
    @handsomecat7225 3 роки тому

    Unbelievably useful video for me. Thank you both!

  • @dante_ele
    @dante_ele 3 роки тому +1

    I like how Ben is gone when the console.log appears

  • @letsgocamping88
    @letsgocamping88 3 роки тому +3

    Ben looks like he’s finally seen some sun! ☀️

  • @stephenmount6181
    @stephenmount6181 3 роки тому +3

    Is ben tricking Clement into building a new startup masquerading as a technical test? 😱😱😱

  • @mohamedsawaed3834
    @mohamedsawaed3834 2 роки тому

    This is great interview.
    I have an interview on thursday for fullstack position.
    Hope it goes well🙏🙏

  • @tny7390
    @tny7390 3 роки тому

    so glad i watched all the way, watching ben laugh at JSON.stringify is priceless

  • @ayanamij
    @ayanamij 2 роки тому +1

    In fairness, I don't think it should count AGAINST someone for using something like Lodash to do things like flatten data PROVIDED the exercise isn't to explicitly write the functionality of whatever is being imported (and evaluate the quality of that code). Several reasons: 1) in a real-world scenario, we do use things like Lodash; 2) likewise, in a real-world scenario, do you really want utility functions with duplicative functionality peppered inconsistently throughout your codebase?; 3) a library is probably going to write the function better than you will, especially in an hour-long interview.
    If the functionality being imported is considered as criterion for the interview, the interviewer should state that as a parameter of the exercise. Alternatively, if the interviewer wants to examine thought process and see if the interviewee will opt to use a library or implement it his/herself, when/if the topic arises (and it usually does), they should be ready to clearly state their preference as to whether or not they use a library or manually implement the functionality. Better, they could ask the interviewee what they would decide and their rationale, which would give insight into the interviewee's body of knowledge.

  • @shrey768
    @shrey768 3 роки тому +7

    These variable names are killing me.

  • @lloydmiller4439
    @lloydmiller4439 3 роки тому +11

    Bro, Clement is a monster. Regular devs would've used reduce, but watching his approach blew my freaking mind.

    • @dadestor
      @dadestor 3 роки тому +7

      His approach is overly complicated and terrible

    • @bonfacenjuguna214
      @bonfacenjuguna214 2 роки тому

      Over engineering mostly

  • @vishnyo
    @vishnyo 3 роки тому

    My quick feedback
    1. He didint mentioned useMemo, useCallback
    2. No any components was created.
    3. What if we want to reuse this fetched data across app?
    4. Everything will be recalculated on each render which is the thing can be improved
    5. If you guys use typescript why just simply not create an interface instead if any?

  • @MaxwellORoark
    @MaxwellORoark 2 роки тому

    This is a pretty good solution! If you’re getting paid by character written 😂

  • @uploadvoice
    @uploadvoice 3 роки тому +4

    Flattening was possible in one line … just by using map()

  • @smoothbeak
    @smoothbeak 3 роки тому +18

    I'm 17 minutes in now and I'd say the following:
    The interviewee is focussing too much on the code, and perhaps missing subtle hints or expressions from Ben suggesting that the way he's going about it might not be the best way.
    My sense is that he's overcomplicating it, and he's probably doing that because he's not fully understanding what is being asked of him.
    Thirdly I think that he's rushing, trying to go too fast. He could probably be much more relaxed, and keep things simple.
    Lastly I think it's worth saying that it's one thing to do an interview, and another to do an interview that you know will be seen by many thousands of people, therefore I can understand the nervousness :)

    • @_thehunter_
      @_thehunter_ 3 роки тому +1

      Ben's face during 15-17 mins.. lol

    • @smoothbeak
      @smoothbeak 3 роки тому

      @@_thehunter_ Haha! I know right

  • @sudeepsuresh2139
    @sudeepsuresh2139 3 роки тому

    clement so happy that he passed

  • @VKD007
    @VKD007 3 роки тому +5

    Why use index as key lol react automatically adds index .
    Keys should be unique , where index can cause rendering issues .
    Also this code is so complex for basic functionality

  • @srvtheone
    @srvtheone 3 роки тому +17

    After the first 15 Minutes, I am definitely not going to hire him😂

    • @Omar-rz3mq
      @Omar-rz3mq 3 роки тому

      why?

    • @thesupercoach
      @thesupercoach 3 роки тому +5

      @@Omar-rz3mq it doesn't look good when he wastes so much time over-engineering things. You can end up hiring a developer that produces magnificent code, but who doesn't listen to direction. This results in a net loss to the company because they spend too much time on "elegant" solutions for simple problems.

    • @kirasmith1147
      @kirasmith1147 3 роки тому +2

      @@thesupercoach It's not over-engineered if it literally doesn't even work at all - he was unable to flatten the data dynamically at all and ben had to help him out to do it manually

  • @whilethehuman
    @whilethehuman 3 роки тому +8

    genuine question - wasn't it easier to destructure person object in map? ie apiPeople.map(({ location: { street: { name: streetName } } }) => // print stuff) ?

    • @pe....
      @pe.... 3 роки тому

      Yes my boy, it was.

    • @wizard_of_az
      @wizard_of_az 3 роки тому

      But he had to dynamically do it... Lol

    • @MaximoJoshua
      @MaximoJoshua 3 роки тому

      that's what I thought too, its so simple to just create an array which maps all the values and sorts it, I don't know why he created all those functions, and random state stuff...he used Object.keys so many times, when he could have just used Object.entries and gotten it all at the same time ....

  • @viet.khoaiegg
    @viet.khoaiegg 3 роки тому

    Learning so much, thanks for good contents 👌

  • @isi1044
    @isi1044 2 роки тому

    when u solve complex problems all day, simple problems begin to look complex

  • @yubin_jo
    @yubin_jo Рік тому

    I was complaining about how the interviewee was flattening the object was distasteful. I sat down and tried it my self and managed to only fetch the api and couldn’t event finish flattening the object in 1 hour. Im humbled.

  • @charlesjeremiahcansino2244
    @charlesjeremiahcansino2244 3 роки тому +3

    that json.stringify made my day 😂

  • @bodolawale5448
    @bodolawale5448 3 роки тому

    I don't really know react but I loved watching this

  • @mahdijafaree5332
    @mahdijafaree5332 3 роки тому

    I love the way you code!

  • @nickwoodward819
    @nickwoodward819 3 роки тому

    This is amazing, do more of this :D

  • @partylover61
    @partylover61 2 роки тому

    I feel like Clement is two variables away from breaking the camera

  • @jaredhead9503
    @jaredhead9503 3 роки тому +5

    Ben almost laughing the whole time has me dying

  • @PraveenrajPattar
    @PraveenrajPattar 3 роки тому

    U can stringify the array object to so that u can access a normal array

  • @oOrbitZz
    @oOrbitZz 2 роки тому

    I think he forgot to ask the question whether to flatten an object dynamically or not. Cause if not a simple destructuring will do. But yeah since this is intermediate it's why he thinks that way. For me this is not over engineering. That is why it is very important to clarify.