Here’s how you can build image carousel using two CSS properties.

1. scroll-snap-type

This CSS property is used to control the behavior of scrolling alignment within a container.
In this case, it's set to x mandatory, which means:

• x: Refers to the horizontal axis. This property is specific to horizontal scrolling.
• mandatory: Indicates that the scrolling will always snap to the nearest snap point.

2. scroll-snap-align: start;

This CSS property defines how an element should be aligned during a scroll operation. In this case, it ensures that each image starts at the beginning of the carousel.

60+ React.js Interview Questions

[ For both Beginners & Experienced ]

⇩

Level: Beginner to Medium
Topics:
➊ Introduction
➋ JSX
➌ Virtual DOM
➍ Components
➎ States and Props
➏ Data Binding
➐ Component Rendering
➑ Introduction to Hooks

➊ Introduction

➀ What is React?
➁ What are the latest features introduced recently?
➂ What are the core features of React?
➃ What are the advantages of using React?
➄ Where shouldn't we use React?
➅ What are different rendering techniques?
➆ Difference: CSR v/s SSR

➇ What is SPA? How does it work?
➈ When may an SPA run slower?
➉ What is SSR?
➀➀ Does React support SSR?
➀➁ What is SSG?
➀➂ Key differences between SSR and SSG.
➀➃ What is RSC (React Server Components)?
➀➄ How does an RSC work?

➋ JSX

➀ What is JSX?
➁ Can a JSX code directly run on a browser?
➂ What do we need to convert JSX code to plain-JS code?
➃ Is "import React from react" necessary? If yes, when?
➄ Write a sample JSX code and convert it to its equivalent JavaScript.

➌ Virtual DOM

➀ What is a Virtual DOM?
➁ Why does React use a Virtual DOM?
➂ Advantages of Virtual DOM over normal DOM?
➃ Explain how the Virtual DOM works.
➄ When and how are changes propagated to the real DOM?

➍ Components

➀ What is a component?
➁ How many ways can a component be defined?
➂ How to define a class-based component?
➃ How to define a function-based component?
➄ What are the advantages and disadvantages of defining a component function-based vs. class-based?

➅ Explain the life cycle of a component.
➆ What is a life cycle method and what is its purpose?
➇ Give examples of some life cycle methods and their usage.

➎ States and Props

➀ What is a state?
➁ What is a prop?
➂ Difference between a state and a prop?
➃ What is a stateful component and a stateless component?

➄ How states are set in a class-based component?
➅ How states are set in a function-based component?
➆ How to define props in a class-based component?
➇ How to define props in a function-based component?
➈ Explain the behavior when a state's value is changed.

➏ Data Binding

➀ What is data binding?
➁ What are the different types of data binding?
➂ What kind of data binding does React allow?
➃ Which data is available for binding in React?

➐ Component Rendering

➀ What do you mean by rendering a component?
➁ Where to define rendering logic in a class-based component v/s function-based component?
➂ What may cause the rendering process slower?
➃ What is rerendering of a component and when does it happen?

➑ Introduction to Hooks

➀ What is a hook?
➁ Name the hooks which React provides out-of-the-box.
➂ What are the general conventions for naming a hook?
➃ From where can a React hook be called?
➄ Point out a few places where a hook can't be used.
➅ What is useState?