Untitled Deck Flashcards
(99 cards)
What is Single Page Applications (SPA)?
Single Page Applications (SPA) are web applications that load a single HTML page and dynamically update content as the user interacts with the app.
What are the phases of a React component lifecycle?
The phases of a React component lifecycle are Mounting, Updating, and Unmounting.
What are important CSS properties while creating animations?
Important CSS properties for animations include ‘transition’, ‘animation’, ‘keyframes’, and ‘transform’.
Give an example of passing parameters to event handlers in React.
An example is: <button onClick={(e) => this.handleClick(e, param)}>Click Me</button>.
How do state and props differ in React?
State is managed within the component, while props are passed from parent to child components.
How does JSX render elements differently than traditional JavaScript?
JSX allows you to write HTML-like syntax directly in JavaScript, which is then transformed into React elements.
Name a few React Bootstrap components.
React Bootstrap components include Button, Modal, Alert, and Navbar.
What are transitions in CSS, and how are they implemented in React?
Transitions in CSS allow property changes in CSS values to occur smoothly over a specified duration. In React, they can be implemented using CSS classes or libraries like React Transition Group.
What is inline styling in React, and what are its limitations?
Inline styling in React is done using the ‘style’ attribute with a JavaScript object. Limitations include lack of pseudo-classes and media queries.
Why is the Context API preferred over prop drilling in React?
The Context API is preferred because it allows for easier state management and avoids the need to pass props through many layers of components.
Explain template literals in ES6.
Template literals are string literals that allow embedded expressions, using backticks (``) and ${expression}
syntax.
Explain destructuring in JS.
Destructuring is a syntax that allows unpacking values from arrays or properties from objects into distinct variables.
How do arrow functions differ from traditional functions in JavaScript?
Arrow functions do not have their own ‘this’ context and are syntactically shorter.
Explain the purpose of CSS grid in building React layouts.
CSS grid provides a two-dimensional layout system that allows for complex responsive designs in React applications.
How does let differ from var in JavaScript?
The ‘let’ keyword has block scope, while ‘var’ has function scope.
How do arrow functions improve code readability in React?
Arrow functions provide a concise syntax and maintain the context of ‘this’, enhancing readability.
How is async/await implemented in JavaScript?
Async/await is implemented using the ‘async’ keyword before a function and ‘await’ before a promise, allowing for asynchronous code to be written in a synchronous style.
How is CSS flexbox used in React layouts?
CSS flexbox is used to create flexible and responsive layouts by defining the direction and alignment of items in a container.
What are ES6 features that improve React code?
ES6 features that improve React code include arrow functions, destructuring, template literals, and modules.
List the types of input elements in HTML5 used for better user experience.
Types include text, email, password, date, number, range, and checkbox.
What are the benefits of using promises over callbacks?
Promises provide a cleaner syntax, better error handling, and avoid callback hell.
What are CSS modules, and how do they prevent naming conflicts in React?
CSS modules are a way to scope CSS by automatically generating unique class names, preventing naming conflicts.
What is destructuring, and how is it applied in React?
Destructuring allows extracting values from arrays or properties from objects, commonly used in React for props and state.
What are the differences between React Bootstrap and traditional Bootstrap?
React Bootstrap is built specifically for React, using components instead of jQuery, while traditional Bootstrap relies on jQuery.