Right Answer: A Single Page Application (SPA) is a web application that loads a single HTML page and dynamically updates the content as the user interacts with the app, without requiring a full page reload.
Right Answer: HTML5 is the latest version of HTML, which includes new features such as native support for audio and video, new semantic elements (like `<article>`, `<section>`, and `<header>`), improved parsing rules, and better support for web applications with APIs like local storage and canvas. HTML, on the other hand, refers to earlier versions that lack these enhancements.
Right Answer: Frontend development refers to the part of a website or application that users interact with directly, including the layout, design, and user interface. Backend development involves the server-side, focusing on databases, server logic, and application functionality that users do not see.
Right Answer: Semantic HTML elements are tags that clearly describe their meaning in a human- and machine-readable way, such as `<header>`, `<article>`, `<footer>`, and `<section>`. They are important because they improve accessibility, enhance SEO, and make the structure of the web page clearer for developers and browsers.
Right Answer: The box model in CSS describes the rectangular boxes generated for elements in a document tree and consists of four areas: content, padding, border, and margin. The content is the innermost area, surrounded by padding, then the border, and finally the margin, which is the outermost area.
Right Answer: A web server handles an HTTP request by following these steps:
1. **Receive Request**: The server listens for incoming HTTP requests on a specific port (usually port 80 for HTTP or port 443 for HTTPS).
2. **Parse Request**: It parses the request to extract the method (GET, POST, etc.), URL, headers, and body.
3. **Process Request**: The server determines how to respond based on the request. This may involve retrieving files, querying a database, or executing server-side scripts.
4. **Generate Response**: It creates an HTTP response, which includes a status code (like 200 for success), headers, and the requested content (like HTML, JSON, etc.).
5. **Send Response**: The server sends the response back to the client (usually a web browser) over the network.
6. **Log Request**: Optionally, the server logs the request details for monitoring and analysis.
Right Answer: In CSS, a class is defined with a dot (.) and can be applied to multiple elements, while an ID is defined with a hash (#) and should be unique to a single element on a page.
Right Answer: Cookies are small pieces of data stored on the user's computer by the web browser while browsing a website, used for tracking and remembering information about the user. Sessions are temporary storage on the server that keeps track of user data across multiple requests during a single visit, typically expiring when the user closes the browser. Local storage is a web storage feature that allows websites to store data in the user's browser persistently, even after the browser is closed, with no expiration time.
Right Answer: Flexbox, or the Flexible Box Layout, is a CSS layout model that allows items in a container to be arranged and aligned efficiently. It works by defining a container as a flex container using `display: flex;`, which enables its direct children (flex items) to be laid out along a main axis (horizontal or vertical). You can control the alignment, direction, spacing, and size of these items using properties like `flex-direction`, `justify-content`, `align-items`, and `flex-wrap`. This makes it easier to create responsive layouts without using floats or positioning.
Right Answer: Responsive design is an approach to web development that ensures a website looks and functions well on various devices and screen sizes. It is implemented using flexible grid layouts, fluid images, and CSS media queries to adapt the layout and content based on the device's screen size and orientation.
Right Answer: Block elements take up the full width available and start on a new line (e.g., `<div>`, `<h1>`). Inline elements only take up as much width as necessary and do not start on a new line (e.g., `<span>`, `<a>`). Inline-block elements are similar to inline elements but can have width and height set, and they respect margins and padding (e.g., `<img>`, `<button>`).
Right Answer: JavaScript is a programming language used to create interactive and dynamic content on websites. It allows developers to manipulate HTML and CSS, handle events, and communicate with servers, enhancing user experience and functionality in web development.
Right Answer: `var` is function-scoped or globally-scoped and can be re-declared and updated. `let` is block-scoped, can be updated but not re-declared in the same scope. `const` is also block-scoped, cannot be updated or re-declared, and must be initialized at the time of declaration.
Right Answer: JavaScript closures are functions that remember their outer scope even when the function is executed outside that scope. They work by capturing the variables from their surrounding environment, allowing access to those variables even after the outer function has finished executing. This is useful for data encapsulation and maintaining state in asynchronous programming.
Right Answer: The DOM (Document Object Model) is a programming interface for web documents that represents the structure of a webpage as a tree of objects. You can manipulate the DOM using JavaScript by selecting elements (e.g., using `document.getElementById`, `document.querySelector`), modifying their properties (e.g., `element.innerHTML`, `element.style`), adding or removing elements (e.g., `element.appendChild`, `element.remove`), and responding to events (e.g., `element.addEventListener`).
Right Answer: Event bubbling is a JavaScript event propagation method where an event starts from the target element and bubbles up to its ancestors in the DOM hierarchy. Event delegation is a technique that involves attaching a single event listener to a parent element to manage events for multiple child elements, leveraging event bubbling to handle events efficiently.
Right Answer: AJAX (Asynchronous JavaScript and XML) is a web development technique that allows web pages to communicate with a server and update content asynchronously without reloading the entire page. It works by using JavaScript to send requests to the server, which can return data (often in JSON or XML format) that the browser can then use to update the webpage dynamically.
Right Answer: Synchronous code executes sequentially, meaning each operation must complete before the next one starts. Asynchronous code allows operations to run independently, enabling other tasks to proceed without waiting for the previous ones to finish.
Right Answer: Promises in JavaScript are objects that represent the eventual completion (or failure) of an asynchronous operation and its resulting value. They allow you to handle asynchronous code more easily by providing methods like `.then()` for success and `.catch()` for errors.
`async` and `await` are syntactic sugar built on top of promises. An `async` function always returns a promise, and within an `async` function, you can use `await` to pause execution until a promise is resolved, making the code easier to read and write as if it were synchronous.
