Frontend Flashcards by Wambui Mwangi

What is the purpose of HTML in web development?

HTML is used to structure content on the web.

How well did you know this?

Not at all

Perfectly

What does CSS stand for?

Cascading Style Sheets.

How well did you know this?

Not at all

Perfectly

True or False: JavaScript is a server-side programming language.

False.

How well did you know this?

Not at all

Perfectly

What is a CSS preprocessor?

A tool that extends CSS with variables, nested rules, and functions, such as SASS or LESS.

How well did you know this?

Not at all

Perfectly

Fill in the blank: The _______ property in CSS is used to change the text color.

color

How well did you know this?

Not at all

Perfectly

What is the DOM?

The Document Object Model, a programming interface for web documents.

How well did you know this?

Not at all

Perfectly

What is responsive design?

An approach to web design that makes web pages render well on a variety of devices and window or screen sizes.

How well did you know this?

Not at all

Perfectly

What is the main purpose of a CSS reset?

To remove default browser styling to ensure consistent rendering across different browsers.

How well did you know this?

Not at all

Perfectly

What is a JavaScript framework? Give an example.

A JavaScript framework is a pre-written JavaScript library that simplifies development. Examples include React, Angular, and Vue.

How well did you know this?

Not at all

Perfectly

True or False: Semantic HTML improves accessibility.

True.

How well did you know this?

Not at all

Perfectly

What are media queries used for in CSS?

To apply styles based on the device characteristics, such as width or height.

How well did you know this?

Not at all

Perfectly

What is the purpose of Web Accessibility (WCAG)?

To ensure that web content is accessible to people with disabilities.

How well did you know this?

Not at all

Perfectly

What does AJAX stand for?

Asynchronous JavaScript and XML.

How well did you know this?

Not at all

Perfectly

What is the use of the ‘data-*’ attribute in HTML?

To store custom data private to the page or application.

How well did you know this?

Not at all

Perfectly

What is the difference between ‘id’ and ‘class’ in HTML?

‘id’ is unique to a single element, while ‘class’ can be used on multiple elements.

How well did you know this?

Not at all

Perfectly

What is a Single Page Application (SPA)?

A web application that loads a single HTML page and dynamically updates content as the user interacts.

How well did you know this?

Not at all

Perfectly

What is the purpose of the ‘alt’ attribute in an <img></img> tag?

To provide alternative text for an image, improving accessibility and SEO.

How well did you know this?

Not at all

Perfectly

Fill in the blank: The _______ method is used to add an event listener in JavaScript.

addEventListener

How well did you know this?

Not at all

Perfectly

What is the purpose of the ‘viewport’ meta tag?

To control the layout on mobile browsers.

How well did you know this?

Not at all

Perfectly

True or False: A CSS Grid is a layout system for creating complex web layouts.

True.

How well did you know this?

Not at all

Perfectly

What is the purpose of a build tool like Webpack?

To bundle JavaScript files for usage in a browser.

How well did you know this?

Not at all

Perfectly

What is Progressive Enhancement?

A strategy for web design that emphasizes core content first and then enhances the experience for users with better browsers.

How well did you know this?

Not at all

Perfectly

What is the role of a package manager in frontend development?

To automate the installation, upgrading, configuring, and removing of software packages.

How well did you know this?

Not at all

Perfectly

What is a RESTful API?

An application programming interface that adheres to the principles of representational state transfer.

How well did you know this?

Not at all

Perfectly

Fill in the blank: The _______ property in CSS is used to control the layout of flex items.

flex

What is the importance of browser developer tools?

To debug, inspect, and analyze web applications directly in the browser.

What does 'CORS' stand for?

Cross-Origin Resource Sharing.

True or False: Inline CSS has higher specificity than external CSS.

True.

What is the difference between '=='' and '===' in JavaScript?

'==' checks for equality of value, while '===' checks for equality of value and type.

What is the purpose of the 'fetch' API in JavaScript?

To make network requests similar to XMLHttpRequest.

What is a CSS transition?

A way to make changes in CSS properties occur smoothly over a specified duration.

What does 'npm' stand for?

Node Package Manager.

What is the purpose of a CSS framework?

To provide pre-designed styles and components that help in building responsive web applications.

Fill in the blank: The _______ method is used to remove an item from an array in JavaScript.

splice

What is a closure in JavaScript?

A function that retains access to its lexical scope, even when the function is executed outside that scope.

What is the purpose of the 'z-index' property in CSS?

To control the vertical stacking order of overlapping elements.

True or False: The

True.

What is the difference between 'localStorage' and 'sessionStorage'?

'localStorage' persists data even after the browser is closed, while 'sessionStorage' only lasts for the duration of the page session.

What is a virtual DOM?

A lightweight copy of the actual DOM used by libraries like React to optimize rendering.

What does the 'this' keyword refer to in JavaScript?

It refers to the context in which a function is called.

What is a polyfill?

A piece of code that provides functionality that is not natively supported by a browser.

Fill in the blank: The _______ method is used to convert a JSON string into a JavaScript object.

JSON.parse

What is the purpose of the 'async' and 'defer' attributes in script tags?

To control the loading and execution of JavaScript files.

What is the significance of the 'main' tag in HTML5?

It indicates the main content of the document.

True or False: A web component is a reusable piece of code that encapsulates functionality and can be used across different web applications.

True.

What is the purpose of a linter in frontend development?

To analyze code for potential errors and enforce coding standards.

What is a service worker?

A script that runs in the background and enables features like offline capabilities and push notifications.

Fill in the blank: The _______ event is triggered when a user clicks on an element.

click

What is the purpose of the 'hover' pseudo-class in CSS?

To apply styles when a user hovers over an element.

What does 'SVG' stand for?

Scalable Vector Graphics.

What is the purpose of the tag in HTML?

To provide metadata about the HTML document.

True or False: CSS Grid is better suited for one-dimensional layouts.

False.

What is an event delegation?

A technique that involves using a single event listener on a parent element to manage events for multiple child elements.

What is the difference between 'font-size' and 'line-height' in CSS?

'font-size' controls the size of the text, while 'line-height' controls the space between lines of text.

Fill in the blank: The _______ method is used to create a new array from an existing array by applying a function to each element.

map

What is the purpose of the 'transform' property in CSS?

To apply 2D or 3D transformations to an element.

What is a content delivery network (CDN)?

A system of distributed servers that deliver web content to a user based on their geographic location.

True or False: The 'display: none;' property in CSS removes an element from the document flow.

True.

What is the purpose of the 'grid-template-areas' property in CSS Grid?

To define named grid areas for layout purposes.

What is the significance of the

tag in HTML5?

It represents introductory content or navigational links.

Fill in the blank: The _______ event occurs when the user changes the value of an element.

input

What is the role of the 'DOMContentLoaded' event in JavaScript?

It is triggered when the initial HTML document has been completely loaded and parsed.

What is a CSS framework? Give an example.

A CSS framework provides a standard structure and style for building websites. Examples include Bootstrap and Tailwind CSS.

True or False: Semantic HTML helps with SEO.

True.

What is the purpose of the

To define the footer for a document or section.

What is a JavaScript module?

A JavaScript file or block of code that is executed in strict mode and can export and import functionality.

Fill in the blank: The _______ method is used to add an element to the end of an array in JavaScript.

push

What is the purpose of the 'visibility' property in CSS?

To control whether an element is visible or hidden, but it still takes up space in the layout.

What does 'BEM' stand for in CSS methodology?

Block Element Modifier.

True or False: The 'console.log()' method is used to print output to the web console.

True.

What is the purpose of the 'requestAnimationFrame()' method in JavaScript?

To create smooth animations by synchronizing updates with the browser's repaint cycle.