This is great to know how to design a feature/components before jumping into the coding part..! It will be very helpful if you do video on how to convert this design into actual code.
Thank you for a video. Tomorrow i am going to fail my first system design interview :D So at least I know how it is going to be XD I would consider as one of the options to use divs for the table with role attribute. There is a design pattern in UX when table rows become "cards". It may work here. Divs will give much more flexibility in CSS, instead of tr/td Also regarding the performance. Right now we have everything in one state as an object. Which might be shared as properties in different levels of nestings of our table components. And if you going to change one of the value it will trigger a rerender in every state consumer component (correct me if I am wrong). Also if any of state properties is object (or an array), updating even 1 of the property of them will cause all of the consumers to rerender. I mean you do not want to rerender footer or header if you selection items changed. So I would consider here a usage of recoil js.
Also, i am curious, by using event delegation capturing thing, how would you determine which row has been clicked? By having special attributes in rows? Like id to something?
@@madhusudhan4001 It was not a system design. It called "system design" by them for the reason I do not know. But they asked some basic questions like how would it place folders in my project... I think I did not pass the next phase of the interview which was the tech one. I do not remember what was wrong, it was a long time ago.
In the component architecture, you have 2 component inside Header. One is filtering but what is the other component? Please try to make a video on streaming like Netflix or youtube. Thank you for the videos.
![[Front-End System Design] - Data Table Component](http://i.ytimg.com/vi/u6jhTo13_No/mqdefault.jpg)
This is great to know how to design a feature/components before jumping into the coding part..!
It will be very helpful if you do video on how to convert this design into actual code.
Thank you for a video. Tomorrow i am going to fail my first system design interview :D So at least I know how it is going to be XD
I would consider as one of the options to use divs for the table with role attribute. There is a design pattern in UX when table rows become "cards". It may work here. Divs will give much more flexibility in CSS, instead of tr/td
Also regarding the performance. Right now we have everything in one state as an object. Which might be shared as properties in different levels of nestings of our table components. And if you going to change one of the value it will trigger a rerender in every state consumer component (correct me if I am wrong). Also if any of state properties is object (or an array), updating even 1 of the property of them will cause all of the consumers to rerender. I mean you do not want to rerender footer or header if you selection items changed. So I would consider here a usage of recoil js.
Also, i am curious, by using event delegation capturing thing, how would you determine which row has been clicked? By having special attributes in rows? Like id to something?
@@ДенисМалышок did you clear the interview?? you should have posted an update..
@@madhusudhan4001 It was not a system design. It called "system design" by them for the reason I do not know. But they asked some basic questions like how would it place folders in my project...
I think I did not pass the next phase of the interview which was the tech one. I do not remember what was wrong, it was a long time ago.
great video you really went in depth on props and types
This is so useful
We were just talking about it with design system Team.
In the component architecture, you have 2 component inside Header. One is filtering but what is the other component?
Please try to make a video on streaming like Netflix or youtube.
Thank you for the videos.
The other is preferences. It could be used to set the visible columns, page size etc.
@@frontendjirachi5297 Thank you
🎉