Web Programming Frontend Frameworks and Tools 1 — Questions and Answers
Question 1: What is the virtual DOM in React?
- A real browser DOM element
- A lightweight in-memory representation of the real DOM used to optimize updates (Correct answer)
- A server-side rendering technique
- A CSS-in-JS library
Correct answer: A lightweight in-memory representation of the real DOM used to optimize updates
React's virtual DOM is an in-memory JavaScript object tree that mirrors the real DOM, allowing React to calculate minimal updates before applying them to the real DOM.
Question 2: In React, what is JSX?
- A JavaScript testing library
- A syntax extension allowing HTML-like code in JavaScript files (Correct answer)
- A state management tool
- A CSS framework for React
Correct answer: A syntax extension allowing HTML-like code in JavaScript files
JSX is a syntax extension for JavaScript that looks like HTML and is used in React to describe what the UI should look like, compiled to JavaScript by Babel.
Question 3: What does npm stand for?
- Node Package Manager (Correct answer)
- New Project Manager
- Node Program Module
- Network Package Module
Correct answer: Node Package Manager
npm stands for Node Package Manager, the default package manager for Node.js used to install, share, and manage JavaScript dependencies.
Question 4: What is the purpose of a package.json file in a web project?
- To store user session data
- To define project metadata, scripts, and dependencies (Correct answer)
- To configure the web server
- To store environment variables
Correct answer: To define project metadata, scripts, and dependencies
The package.json file is the manifest for a Node.js project, containing metadata like name, version, scripts, and the list of dependencies.
Question 5: What is the main purpose of a CSS preprocessor like SASS?
- To minify CSS for production
- To extend CSS with variables, nesting, and mixins for better maintainability (Correct answer)
- To automatically add vendor prefixes
- To convert CSS to JavaScript
Correct answer: To extend CSS with variables, nesting, and mixins for better maintainability
CSS preprocessors like SASS add programming features to CSS such as variables, nesting, mixins, and functions, which are then compiled down to standard CSS.
Question 6: What is the purpose of webpack in web development?
- A CSS grid framework
- A module bundler that combines JS, CSS, and other assets into optimized bundles (Correct answer)
- A unit testing framework
- A backend web server
Correct answer: A module bundler that combines JS, CSS, and other assets into optimized bundles
Webpack is a module bundler that processes and bundles JavaScript modules and other assets like CSS and images into optimized files for the browser.
What is the virtual DOM in React?