This article provides information about the changes in Firefox 127 that affect developers. Firefox 127 was released on June 11, 2024.| developer.mozilla.org
This article provides information about the changes in Firefox 126 that affect developers. Firefox 126 was released on May 14, 2024.| developer.mozilla.org
Use the options_ui key to define an options page for your extension. You use this page to enable users to modify your extension's settings.| developer.mozilla.org
Use the options_page key to define an options page that opens in a new tab. You use this page to enable users to modify your extension's settings.| developer.mozilla.org
Fired when the server sends a 401 or 407 status code and a WWW-Authenticate header using the Basic scheme (that is, when the server asks the client to provide authentication credentials, such as a username and password).| developer.mozilla.org
A media type (formerly known as a Multipurpose Internet Mail Extensions or MIME type) indicates the nature and format of a document, file, or assortment of bytes. MIME types are defined and standardized in IETF's RFC 6838.| developer.mozilla.org
The HTML autocomplete attribute lets web developers specify what if any permission the user agent has to provide automated assistance in filling out form field values, as well as guidance to the browser as to the type of information expected in the field.| developer.mozilla.org
The PublicKeyCredentialRequestOptions dictionary represents the object passed to CredentialsContainer.get() as the value of the publicKey option.| developer.mozilla.org
The PublicKeyCredentialCreationOptions dictionary represents the object passed to CredentialsContainer.create() as the value of the publicKey option: that is, when using create() to create a public key credential using the Web Authentication API.| developer.mozilla.org
The signalUnknownCredential() static method of the PublicKeyCredential interface signals to the authenticator that a credential ID was not recognized by the relying party (RP) server.| developer.mozilla.org
The signalCurrentUserDetails() static method of the PublicKeyCredential interface signals to the authenticator that a particular user has updated their user name and/or display name on the relying party (RP) server.| developer.mozilla.org
The signalAllAcceptedCredentials() static method of the PublicKeyCredential interface signals to the authenticator all of the valid credential IDs that the relying party (RP) server still holds for a particular user.| developer.mozilla.org
The isConditionalMediationAvailable() static method of the PublicKeyCredential interface returns a Promise which resolves to true if conditional mediation is available.| developer.mozilla.org
The preventSilentAccess() method of the CredentialsContainer interface sets a flag that specifies whether automatic log in is allowed for future visits to the current origin, then returns a Promise that resolves to undefined. For example, you might call this, after a user signs out of a website to ensure that they aren't automatically signed in on the next site visit. Mediation varies by origin, and is an added check point of browser stored credentials, informing a user of an account login st...| developer.mozilla.org
The get() method of the CredentialsContainer interface returns a Promise that fulfills with a single credential, which can then be used to authenticate a user to a website.| developer.mozilla.org
The create() method of the CredentialsContainer interface creates a new credential, which can then be stored and later retrieved using the navigator.credentials.get() method. The retrieved credential can then be used by a website to authenticate a user.| developer.mozilla.org
Mobile first, a form of progressive enhancement, is a web-development and web-design approach that focuses on prioritizing design and development for mobile screen sizes over design and development for desktop screen sizes. The rationale behind the mobile-first approach is to provide users with good user experiences at all screen sizes—by starting with creating a user experience that works well on small screens, and then building on top of that to further enrich the user experience as the s...| developer.mozilla.org
The Map object holds key-value pairs and remembers the original insertion order of the keys. Any value (both objects and primitive values) may be used as either a key or a value.| developer.mozilla.org
The Storage interface of the Web Storage API provides access to a particular domain's session or local storage. It allows, for example, the addition, modification, or deletion of stored data items.| MDN Web Docs
The undefined global property represents the primitive value undefined. It is one of JavaScript's primitive types.| MDN Web Docs
The Object type represents one of JavaScript's data types. It is used to store various keyed collections and more complex entities. Objects can be created using the Object() constructor or the object initializer / literal syntax.| MDN Web Docs
The JSON.stringify() static method converts a JavaScript value to a JSON string, optionally replacing values if a replacer function is specified or optionally including only the specified properties if a replacer array is specified.| MDN Web Docs
The box-sizing CSS property sets how the total width and height of an element is calculated.| MDN Web Docs
The read-only scrollY property of the Window interface returns the number of pixels by which the document is currently scrolled vertically. This value is subpixel precise in modern browsers, meaning that it isn't necessarily a whole number. You can get the number of pixels the document is scrolled horizontally from the scrollX property.| MDN Web Docs
The read-only scrollX property of the Window interface returns the number of pixels by which the document is currently scrolled horizontally. This value is subpixel precise in modern browsers, meaning that it isn't necessarily a whole number. You can get the number of pixels the document is scrolled vertically from the scrollY property.| MDN Web Docs
The getClientRects() method of the Element interface returns a collection of DOMRect objects that indicate the bounding rectangles for each CSS border box in a client.| MDN Web Docs
In computer graphics, a viewport represents a polygonal (normally rectangular) area that is currently being viewed.| MDN Web Docs
Baseline identifies the availability of web platform features across popular browsers, including APIs, CSS properties, and JavaScript syntax. Baseline describes web features as being either widely available or newly available. Features that do not meet the Baseline criteria are said to have limited availability.| MDN Web Docs
The hover CSS media feature can be used to test whether the user's primary input mechanism can hover over elements.| MDN Web Docs
The any-hover CSS media feature can be used to test whether any available input mechanism can hover over elements.| MDN Web Docs
The URLSearchParams interface defines utility methods to work with the query string of a URL.| MDN Web Docs
A sidebar is a pane that is displayed at the side of the browser window, next to the web page. This page describes sidebars, specifying them, designing them, and examples of use.| MDN Web Docs
The extends keyword is used in class declarations or class expressions to create a class that is a child of another class.| MDN Web Docs
The async function declaration creates a binding of a new async function to a given name. The await keyword is permitted within the function body, enabling asynchronous, promise-based behavior to be written in a cleaner style and avoiding the need to explicitly configure promise chains.| MDN Web Docs
The ResizeObserver interface reports changes to the dimensions of an Element's content or border box, or the bounding box of an SVGElement.| MDN Web Docs
The Barcode Detection API detects linear and two-dimensional barcodes in images.| MDN Web Docs
The debugger statement invokes any available debugging functionality, such as setting a breakpoint. If no debugging functionality is available, this statement has no effect.| MDN Web Docs
An arrow function expression is a compact alternative to a traditional function expression, with some semantic differences and deliberate limitations in usage:| MDN Web Docs
Events are things that happen in the system you are programming, which the system tells you about so your code can react to them. For example, if the user clicks a button on a webpage, you might want to react to that action by displaying an information box. In this article, we discuss some important concepts surrounding events, and look at the fundamentals of how they work in browsers.| MDN Web Docs
Images help bring more color and life to the web. This post describes how images are represented by humans and on different devices, with details about color spaces and vision theory.| MDN Blog
Global Privacy Control (GPC) is on the way to becoming a formal privacy standard with the recent publication of its first working draft. Let's take a look at what the implications are for developers and users.| MDN Blog
Let's have a look at MDN Web Docs content projects in 2024, with highlights of our top picks and recommended reading, and at what's next on MDN for 2025.| MDN Blog
There's a new Learn Web Development section on MDN that merges the MDN Curriculum with the Learn section. Here's the background to these changes, what's new, and what you can expect to see in the future.| MDN Blog
Join JavaScriptmas this December for daily coding challenges designed to boost your skills and bring festive fun. Solve challenges on Scrimba, learn something new, and take part for a chance to win exciting prizes!| MDN Blog
Learn about reading network request waterfalls, identifying common network performance issues, and optimizing page rendering.| MDN Blog
Here are six effective strategies for landing your first developer job. These are especially relevant if you're self-taught or breaking into the tech industry without a traditional CS degree.| MDN Blog
We are thrilled to announce the new MDN community page that will be a hub to recognize our contributors and a place for contributors to get involved.| MDN Blog
Learn about lesser-known web performance bottlenecks connected to excessive JavaScript usage, like long tasks, large bundle sizes, and hydration issues.| MDN Blog
For many of us, the holidays are over, and the time has come to focus. Now is an ideal time to dive into learning web development, and you're in luck — MDN and Scrimba are offering a 30% discount on select courses for the next month!| MDN Blog
This post demonstrates how to use the Streams API in a web application to fetch and transform text on the fly. By processing the data as it arrives, this approach enhances performance, responsiveness, and resource efficiency.| MDN Blog
Learn how to use Intl.Segmenter for locale-sensitive text segmentation in JavaScript to simplify localization, count words or sentences in different languages, and more.| MDN Blog
Learn how to use Git stash to break down large commits. Discover a better approach for saving work when switching branches.| MDN Blog
This post explores what mobile app debugging is, commonly used techniques, and how you can debug mobile apps on multiple devices.| MDN Blog
The 'name' attribute of the HTML details element is gaining more support across browsers. Learn how this feature allows creating exclusive accordions without scripting widgets from scratch.| MDN Blog
This guide explains how to use Static Site Generation in Next.js to build scalable and secure web applications with fast loading times and a focus on performance.| MDN Blog
Interop 2023 has successfully concluded, and the Interop 2024 project is now officially underway. Learn what Interop is, discover the updates from Interop 2023 now on MDN, and find out what's coming to the web next.| MDN Blog
Discover essential tips and tricks for using Visual Studio Code (VS Code), a powerful IDE. Learn how to leverage its integrated editing features and Git support, and explore a few extensions.| MDN Blog
Thinking about making the move from GitHub to GitLab? This guide demystifies the migration process, addressing common concerns for DevSecOps teams that are looking to seamlessly transition between the two platforms. This post provides a step-by-step guided tutorial on how to migrate your data from GitHub into GitLab.| MDN Blog
The new CSS linear() timing function enables custom easing in animations. Explore how linear() works compared with other timing functions used for easing, with practical examples.| MDN Blog
We recently launched a feature called AI Explain, but we have rolled this back for now. In this post, we look into the story behind AI Explain: its development, launch, and the reasons that led us to press the pause button.| MDN Blog
Learn how to use JavaScript to draw any regular shape to a HTML canvas with a single function, and how to modify it to draw multiple shapes.| MDN Blog
The Temporal.ZonedDateTime object represents a date and time with a time zone. It is fundamentally represented as a combination of an instant, a time zone, and a calendar system.| MDN Web Docs
The Navigator.languages read-only property returns an array of strings representing the user's preferred languages. The language is described using language tags according to RFC 5646: Tags for Identifying Languages (also known as BCP 47). In the returned array they are ordered by preference with the most preferred language first.| MDN Web Docs
A lookahead assertion "looks ahead": it attempts to match the subsequent input with the given pattern, but it does not consume any of the input — if the match is successful, the current position in the input stays the same.| MDN Web Docs
The CSS selector list (,) selects all the matching nodes. A selector list is a comma-separated list of selectors.| MDN Web Docs
CSS selectors are used to define a pattern of the elements that you want to select for applying a set of CSS rules on the selected elements. Combinators define the relationship between the selectors. Using various selectors and combinators, you can precisely select and style the desired elements based on their type, attributes, state, or relationship to other elements.| MDN Web Docs
Specificity is the algorithm used by browsers to determine the CSS declaration that is the most relevant to an element, which in turn, determines the property value to apply to the element. The specificity algorithm calculates the weight of a CSS selector to determine which rule from competing CSS declarations gets applied to an element.| MDN Web Docs
The Selectors API provides methods that make it quick and easy to retrieve Element nodes from the DOM by matching against a set of selectors. This is much faster than past techniques, wherein it was necessary to, for example, use a loop in JavaScript code to locate the specific items you needed to find.| MDN Web Docs
The HTTP Set-Cookie response header is used to send a cookie from the server to the user agent, so that the user agent can send it back to the server later. To send multiple cookies, multiple Set-Cookie headers should be sent in the same response.| MDN Web Docs
The grid CSS property is a shorthand property that sets all of the explicit and implicit grid properties in a single declaration.| MDN Web Docs
Welcome to MDN Learning Web Development (also known as Learn). This resource provides a structured set of tutorials teaching the essential skills and practices for being a successful front-end developer, along with challenges and further recommended resources.| MDN Web Docs
Subresource Integrity (SRI) is a security feature that enables browsers to verify that resources they fetch (for example, from a CDN) are delivered without unexpected manipulation. It works by allowing you to provide a cryptographic hash that a fetched resource must match.| MDN Web Docs
Cross-Origin Resource Sharing (CORS) is an HTTP-header based mechanism that allows a server to indicate any origins (domain, scheme, or port) other than its own from which a browser should permit loading resources. CORS also relies on a mechanism by which browsers make a "preflight" request to the server hosting the cross-origin resource, in order to check that the server will permit the actual request. In that preflight, the browser sends headers that indicate the HTTP method and headers tha...| MDN Web Docs
The crossorigin attribute, valid on the , , ,| MDN Web Docs
The Element.getBoundingClientRect() method returns a DOMRect object providing information about the size of an element and its position relative to the viewport.| MDN Web Docs
Browsers are starting to roll out changes in default UA styles for nested section headings. This post describes the incoming changes, how to identify if it's an issue on your websites, and hints for conformant and better-structured pages.| MDN Web Docs
A new way to handle dates and times is being added to JavaScript. Let's take a look at Temporal, what problems it solves, the current state, and what you'll find in the new documentation about it on MDN.| MDN Web Docs
Learn techniques to improve the Largest Contentful Paint metric, a part of Core Web Vitals, for your website.| MDN Web Docs
The Web Locks API allows scripts running in one tab or worker to asynchronously acquire a lock, hold it while work is performed, then release it. While held, no other script executing in the same origin can acquire the same lock, which allows a web app running in multiple tabs or workers to coordinate work and the use of resources.| MDN Web Docs
The origin private file system (OPFS) is a storage endpoint provided as part of the File System API, which is private to the origin of the page and not visible to the user like the regular file system. It provides access to a special kind of file that is highly optimized for performance and offers in-place write access to its content.| MDN Web Docs
A cookie (also known as a web cookie or browser cookie) is a small piece of data a server sends to a user's web browser. The browser may store cookies, create new cookies, modify existing ones, and send them back to the same server with later requests. Cookies enable web applications to store limited amounts of data and remember state information; by default the HTTP protocol is stateless.| MDN Web Docs
The preserveAspectRatio attribute indicates how an element with a viewBox providing a given aspect ratio must fit into a viewport with a different aspect ratio.| MDN Web Docs
Developing a web application that uses server-sent events is straightforward. You'll need a bit of code on the server to stream events to the front-end, but the client side code works almost identically to websockets in part of handling incoming events. This is a one-way connection, so you can't send events from a client to a server.| MDN Web Docs
Before about 2010, the CSS :visited selector allowed websites to uncover a user's browsing history and figure out what sites the user had visited. This was done through window.getComputedStyle and other techniques. This process was quick to execute, and made it possible not only to determine where the user had been on the web, but could also be used to guess a lot of information about the user's identity.| MDN Web Docs
The union() method of Set instances takes a set and returns a new set containing elements which are in either or both of this set and the given set.| MDN Web Docs
The global aria-describedby attribute identifies the element (or elements) that describes the element on which the attribute is set.| MDN Web Docs
The HTTP Last-Modified response header contains a date and time when the origin server believes the resource was last modified. It is used as a validator in conditional requests (If-Modified-Since or If-Unmodified-Since) to determine if a requested resource is the same as one already stored by the client. It is less accurate than an ETag for determining file contents, but can be used as a fallback mechanism if ETags are unavailable.| MDN Web Docs
The HTML element is the generic container for flow content. It has no effect on the content or layout until styled in some way using CSS (e.g. styling is directly applied to it, or some kind of layout model like Flexbox is applied to its parent element).| MDN Web Docs
The animation-timeline CSS property specifies the timeline that is used to control the progress of a CSS animation.| MDN Web Docs
The animation-name CSS property specifies the names of one or more @keyframes at-rules that describe the animation to apply to an element. Multiple @keyframe at-rules are specified as a comma-separated list of names. If the specified name does not match any @keyframe at-rule, no properties are animated.| MDN Web Docs
To add an image to a document, add your image file to the document's folder, and then reference the image from within the document's index.md file using Markdown image syntax or the equivalent HTML element.| MDN Web Docs
The Object.defineProperty() static method defines a new property directly on an object, or modifies an existing property on an object, and returns the object.| MDN Web Docs
The set syntax binds an object property to a function to be called when there is an attempt to set that property. It can also be used in classes.| MDN Web Docs
Generally speaking, a function is a "subprogram" that can be called by code external (or internal, in the case of recursion) to the function. Like the program itself, a function is composed of a sequence of statements called the function body. Values can be passed to a function as parameters, and the function will return a value.| MDN Web Docs
The static keyword defines a static method or field for a class, or a static initialization block (see the link for more information about this usage). Static properties cannot be directly accessed on instances of the class. Instead, they're accessed on the class itself.| MDN Web Docs
Private properties are counterparts of the regular class properties which are public, including class fields, class methods, etc. Private properties get created by using a hash # prefix and cannot be legally referenced outside of the class. The privacy encapsulation of these class properties is enforced by JavaScript itself. The only way to access a private property is via dot notation, and you can only do so within the class that defines the private property.| MDN Web Docs
Classes are a template for creating objects. They encapsulate data with code to work on that data. Classes in JS are built on prototypes but also have some syntax and semantics that are unique to classes.| MDN Web Docs
JavaScript is designed on a simple object-based paradigm. An object is a collection of properties, and a property is an association between a name (or key) and a value. A property's value can be a function, in which case the property is known as a method.| MDN Web Docs