Javascript and React Machine Coding Questions

1. Accordion
2. Carousel
3. Debounce
4. Event bubbling and capturing
5. Reddit comment section -
6. Infinite scroll
7. Pagination
8. Modal
9. Tooltip
10. Dropdown
11. Tab
12. Popover
13. Progress bar
14. Loader
15. Alert
16. Polyfills
    1. polyfill for promise.all
    2. polyfill for promise.allSettled
    3. polyfill for promise.any
    4. polyfill for call
    5. polyfill for apply
    6. polyfill for bind
    7. polyfill for map
    8. polyfill for filter
    9. polyfill for reduce
    10. polyfill for flat
    11. polyfill for find
    12. polyfill for findIndex
    13. polyfill for findLastIndex
    14. polyfill for entries
    15. polyfill for keys
    16. polyfill for values
    17. polyfill for includes
17. Lazy loading
18. Folder structure
19. Context API
20. React Hooks
21. React Higher-Order Components
22. React Refs
23. React Portals
24. React Fragments

https://www.youtube.com/watch?v=v_fwMoTVmqw&list=PLe3J6mZBq1xUs529Z-IHiCix4KBm0uLp1

https://github.com/ghoshsuman845/frontend-interview-preparation-kit?tab=readme-ov-file

useState() useEffect() useCallback() useMemo() useRef() useReducer() useContext() useId() useLayoutEffect()

promises promise.all() promise.race()

promise.allSettled()

https://www.youtube.com/watch?v=3PHXvlpOkf4

https://github.com/ghoshsuman845/frontend-interview-preparation-kit?tab=readme-ov-file#week-3--jumping-to-web-fundamentals

star rating

tabs implementing https://www.greatfrontend.com/questions/user-interface/tabs/solution

traffic light

async operations https://www.greatfrontend.com/focus-areas/async-operations

Implementing Flipkart Search bar functionality using debouncing or throttle

filters, sorting, pagination, infinite scroll and lazy loading for a product catalog

Typeahead/ autocomplete search bar

Implement tic tac toe

Create Images gallery(Use optimations like infinite scroll, pagination, search functionality)

Food Ordering App having Search, Sort, Filter, Add to Cart functionality

Build a calculator (add/subtract... then multiply/divide... then log/pow... etc)

Create a progress bar having start/restart, pause, stop functionality

To-Do List Application Responsive Design Take an existing web page and make it responsive for various screen sizes (e.g., desktop, tablet, mobile) using media queries and CSS.

Fetch API: Use the Fetch API to retrieve data from a JSON endpoint and display it on a web page using JavaScript.

Form Validation: Implement client-side form validation for a registration form using HTML5 and JavaScript. Validate fields like email, password strength, and required fields.

Implement a Drag and Drop Feature: Create a web page with a drag-and-drop interface using HTML, CSS, and JavaScript. Allow users to drag elements and drop them into designated areas.

intermediate

Real-time Chat Application: Build a real-time chat application using a frontend framework (e.g., React, Vue.js) and a backend technology like WebSocket or Firebase.

Responsive Tables: Make HTML tables responsive. Ensure that tables adapt to different screen sizes without horizontal scrolling.

Unit Testing: Write unit tests for a JavaScript function or component using a testing framework like Jest.

Dark Mode Toggle: Create a dark mode toggle button that switches the website's color scheme between light and dark mode.

React Higher-Order Components (HOCs): Create a higher-order component (HOC) to add functionality to existing React components.

React Hooks: Rewrite class-based React components into functional components using hooks like useState and useEffect.

Context API: Use React's Context API to manage and share state or data across multiple components.

React Router: Set up routing in a React application using React Router, with multiple routes and navigation.

https://javascript.info/server-sent-events

https://javascript.info/websocket#chat-example

https://javascript.info/long-polling

https://bigfrontend.dev/design

https://reactbyexample.github.io/getting-started/

https://reactpatterns.com/

https://blog.logrocket.com/optimizing-performance-react-app/

https://blog.logrocket.com/virtual-dom-react/

https://devhints.io/react