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 Autosuggestion or Typeahead Component 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 01:19 Requirement Gathering 03:17 HLD of Autocomplete Component 04:28 LLD of Autocomplete Component 05:25 Setup new React App 08:44 Autocomplete Component Props 11:48 Building the Component 20:44 Rendering Suggestions 26:42 Highlighted Text Logic 28:59 onSelect Logic 29:56 Implementing Debouncing 33:27 Keyboard Navigation, Caching, Accessibility etc ------------------------------------------------------------------------- β Support the channel - https://www.youtube.com/channel/UCIPZVAwDGa-A4ZJxCBvXRuQ/join Special Thanks to our members -
