Summary
Keywords
Full Transcript
β‘οΈ My Frontend Interview Preparation Course - https://roadsidecoder.com/course-details (50% off) πͺ My Instagram - https://www.instagram.com/roadsidecoder/ β‘οΈ Book an Interview Preparation call with me - https://topmate.io/roadsidecoder Frontend System Design Question on building a Scalable Nested Comments Component like reddit will be discussed in this video along with Requirement gathering, HLD, LLD and Optimisations on this. We will also discuss tips and tricks to tackle your React JS and JavaScript Questions in Frontend System Design Interviews. π Frontend System Design Interview Series - https://www.youtube.com/playlist?list=PLKhlp2qtUcSaSnNnNffRPIU3DRQ2xAdj8 β‘οΈ Source Code - https://github.com/piyush-eon/frontend-interview-questions/tree/master/frontend-system-design-questions π€ Join the RoadsideCoder Community Discord - https://discord.gg/2ecgDwx5EE π React JS Interview Series - https://www.youtube.com/playlist?list=PLKhlp2qtUcSYQojD5G-ElgHezoCyq2Hgo π MERN Stack Chat App Tutorial - https://www.youtube.com/playlist?list=PLKhlp2qtUcSZsGkxAdgnPcHioRr-4guZf π Complete Data Structures and Algorithms with JS Course - https://www.youtube.com/playlist?list=PLKhlp2qtUcSZtJefDThsXcsAbRBCSTgW4 π JS Interview Series - https://www.youtube.com/watch?v=oUWRxJ19gfE&list=PLKhlp2qtUcSaCVJEt4ogEFs6I41pNnMU5&index=1 π Cars24 Interview Experience - https://www.youtube.com/watch?v=vxggZffOqek&list=PLKhlp2qtUcSb_WQZC3sq9Vw3NC4DbreUL&index=2 π Unacademy Interview Experience - https://www.youtube.com/watch?v=abbdJ4Yfm54 π Tazorpay Interview Experience - https://www.youtube.com/watch?v=q-ylRxSxGcY π React Beginner's Project Tutorials - https://www.youtube.com/playlist?list=PLKhlp2qtUcSa_rX7glmB7HyFsEOEQa0Uk #JavascriptInterview #ReactInterview #ReactJS ------------------------------------------------------------------------- 00:00 Intro 02:00 Functional Requirements 02:41 Non Functional Requirements 03:27 High Level Design (HLD) 04:19 Low Level Design (LLD) 05:09 Setup a New React App 07:49 Comment Data Structure 08:39 Nested Comments Component 09:33 Rendering Comments 19:18 Recrursive Reply Rendering 22:03 DFS to insert a comment / reply 28:57 Edit Comments 35:40 Delete Comments 39:08 Typescript, sorting, accessibility, up/down vote, etc ------------------------------------------------------------------------- β Support the channel - https://www.youtube.com/channel/UCIPZVAwDGa-A4ZJxCBvXRuQ/join Special Thanks to our members -
