This page contains the following errors:

error on line 321 at column 13: Opening and ending tag mismatch: item line 320 and channel

Below is a rendering of the page up to the first error.

 30 seconds of code Coding articles to level up your development skills https://www.30secondsofcode.org en-us https://www.30secondsofcode.org/assets/logo.png 30 seconds of code https://www.30secondsofcode.org 1440 Create a math expression tokenizer in JavaScript https://www.30secondsofcode.org/js/s/math-expression-tokenizer Learn how to tokenize math expressions, using a simple JavaScript algorithm, forming the basis for more complex interpreters and compilers. Tue, 18 Feb 2025 00:00:00 GMT How can I parse Reverse Polish Notation in JavaScript? https://www.30secondsofcode.org/js/s/parse-reverse-polish-notation Parsing Reverse Polish Notation, also known as postfix notation, is a simple algorithm that can be implemented in JavaScript using a stack. Sat, 15 Feb 2025 00:00:00 GMT How can I calculate the diff between two strings in JavaScript? https://www.30secondsofcode.org/js/s/myers-diff-algorithm Delve deep into the Myers diff algorithm and learn how to calculate the difference between two strings in JavaScript, the way Git does. Wed, 12 Feb 2025 00:00:00 GMT Find matching bracket pairs in a string with JavaScript https://www.30secondsofcode.org/js/s/find-matching-bracket-pairs A common problem when building parsers is finding matching bracket pairs in a string. Here's how you can solve it with JavaScript. Fri, 07 Feb 2025 00:00:00 GMT How can I find the longest common subsequence of two strings in JavaScript? https://www.30secondsofcode.org/js/s/longest-common-subsequence The longest common subsequence is the longest subsequence common to all given sequences and can be easily found using dynamic programming. Mon, 03 Feb 2025 00:00:00 GMT Formatting day and hour ranges with JavaScript https://www.30secondsofcode.org/js/s/formatting-day-hour-ranges I recently came across a fairly interesting algorithmic problem when formatting day and hour ranges. Here's my take on the solution. Wed, 29 Jan 2025 00:00:00 GMT Modeling complex JavaScript object advanced relationships https://www.30secondsofcode.org/js/s/complex-object-advanced-relationships In this installment of the ActiveRecord-like JavaScript implementation, we will revisit modeling relationships between objects. Thu, 23 Jan 2025 00:00:00 GMT Modeling complex JavaScript object autoloading and console https://www.30secondsofcode.org/js/s/complex-object-autoloading-console In this installment, we'll create a custom object inspect utility to help us debug our complex objects in the console. Thu, 16 Jan 2025 00:00:00 GMT Modeling complex JavaScript object field validation https://www.30secondsofcode.org/js/s/complex-object-field-validation Returning to the models and records part of the implementation, this time around we'll explore how to add constraints to individual fields. Thu, 09 Jan 2025 00:00:00 GMT Modeling complex JavaScript object factories https://www.30secondsofcode.org/js/s/complex-object-factories Expanding even further upon our ActiveRecord-inspired project, we'll figure out how to create factories that produce complex objects. Thu, 02 Jan 2025 00:00:00 GMT Modeling complex JavaScript object serialization https://www.30secondsofcode.org/js/s/complex-object-serialization In the fourth part of the series, we will look at how to serialize complex JavaScript objects. Thu, 26 Dec 2024 00:00:00 GMT Modeling complex JavaScript object scopes https://www.30secondsofcode.org/js/s/complex-object-scopes In the third installment of implementing an ActiveRecord-like pattern in JavaScript, we'll model and optimize object scoping. Thu, 19 Dec 2024 00:00:00 GMT Modeling complex JavaScript object attributes & relationships https://www.30secondsofcode.org/js/s/complex-object-attributes-relationships Continuing on the journey to implement an ActiveRecord-like pattern in JavaScript with object attributes and relationships. Thu, 12 Dec 2024 00:00:00 GMT Modeling complex JavaScript object collections in memory https://www.30secondsofcode.org/js/s/complex-object-collections-in-memory A deep dive into a fairly flexible implementation, inspired by Rails' ActiveRecord, for modeling JavaScript object collections in memory. Thu, 05 Dec 2024 00:00:00 GMT Display the right type of keyboard for form inputs https://www.30secondsofcode.org/html/s/keyboard-type-using-inputmode Keyboard input on mobile devices is hard to get right. Here's how to ensure the right keyboard is displayed for each input. Tue, 03 Dec 2024 00:00:00 GMT How can I calculate the distance between two coordinates using JavaScript? https://www.30secondsofcode.org/js/s/distance-of-two-lat-lng-coordinates Given two pairs of latitude and longitude coordinates, you can calculate the distance between them using the Haversine formula. Let's find out how. Mon, 02 Dec 2024 00:00:00 GMT Show menu on image hover https://www.30secondsofcode.org/css/s/image-hover-menu Display a menu overlay when the user hovers over an image. Tue, 24 Sep 2024 00:00:00 GMT Reveal additional content on hover https://www.30secondsofcode.org/css/s/hover-additional-content Learn how you can create a card that displays additional content on hover. Mon, 23 Sep 2024 00:00:00 GMT Scroll progress bar https://www.30secondsofcode.org/css/s/scroll-progress-bar Create a progress bar indicating the scroll percentage of the page, using CSS and JavaScript. Sun, 22 Sep 2024 00:00:00 GMT Image rotate on hover https://www.30secondsofcode.org/css/s/image-hover-rotate Zoom in and rotate your images on hover and make them stand out. Sat, 21 Sep 2024 00:00:00 GMT Image overlay on hover https://www.30secondsofcode.org/css/s/image-overlay-hover Learn how to display an image overlay effect on hover using CSS. Fri, 20 Sep 2024 00:00:00 GMT Navigation list item hover & focus effect https://www.30secondsofcode.org/css/s/navigation-list-item-hover-and-focus-effect Create a custom hover and focus effect for navigation items, using CSS transformations. Thu, 19 Sep 2024 00:00:00 GMT Animate box shadow on hover https://www.30secondsofcode.org/css/s/hover-shadow-box-animation Create an animated shadow box around the text when it is hovered. Wed, 18 Sep 2024 00:00:00 GMT Create a custom scrollbar with CSS https://www.30secondsofcode.org/css/s/custom-scrollbar Customize the scrollbar style for elements with scrollable overflow, using just CSS. Tue, 17 Sep 2024 00:00:00 GMT Engraved and embossed text https://www.30secondsofcode.org/css/s/engraved-embossed-text Make the text appear engraved or embossed into the background, using CSS. Mon, 16 Sep 2024 00:00:00 GMT Squiggle link hover effect https://www.30secondsofcode.org/css/s/squiggle-link-hover-effect Create the most whimsical link hover effect with a squiggle animation. Sun, 15 Sep 2024 00:00:00 GMT Styling checkboxes and radio buttons https://www.30secondsofcode.org/css/s/custom-checkbox-radio Learn how to create customized and animated checkboxes and radio buttons with CSS. Sat, 14 Sep 2024 00:00:00 GMT Card with image cutout https://www.30secondsofcode.org/css/s/card-image-cutout Cutout effects seem tricky to implement, but they really aren't. CSS has you covered! Fri, 13 Sep 2024 00:00:00 GMT Alternating text animations https://www.30secondsofcode.org/css/s/alternating-text Ever wondered how those alternating text animations work? Here's a simple way to create one using CSS and JavaScript. Thu, 12 Sep 2024 00:00:00 GMT Card hover effects https://www.30secondsofcode.org/css/s/card-hover-effects Create cards with hover effects, such as rotating, shifting and perspective transforms. Wed, 11 Sep 2024 00:00:00 GMT Isometric card https://www.30secondsofcode.org/css/s/isometric-card Learn how to create an isometric card using CSS. Tue, 10 Sep 2024 00:00:00 GMT Gradient text https://www.30secondsofcode.org/css/s/gradient-text Modern CSS can help you create gradient text with a few lines of code. Learn how today! Tue, 10 Sep 2024 00:00:00 GMT Display a fallback for images that fail to load https://www.30secondsofcode.org/css/s/broken-image-fallback Having trouble loading an image? Display a fallback message instead! Mon, 09 Sep 2024 00:00:00 GMT Image with text overlay https://www.30secondsofcode.org/css/s/image-text-overlay Learn how to create an image with a text overlay using CSS. Sun, 08 Sep 2024 00:00:00 GMT Style elements when in fullscreen mode https://www.30secondsofcode.org/css/s/fullscreen Did you know you can differentiate an element's styles when it's in fullscreen mode? Learn how to do it with this code snippet! Sun, 08 Sep 2024 00:00:00 GMT Hide scroll bars on an element https://www.30secondsofcode.org/css/s/hide-scrollbars Learn how to hide scrollbars on an element, while still allowing it to be scrollable. Sat, 07 Sep 2024 00:00:00 GMT Typewriter effect https://www.30secondsofcode.org/css/s/typewriter-effect Create a typewriter effect animation with CSS variables and just a sprinkle of JavaScript. Fri, 06 Sep 2024 00:00:00 GMT Evenly distributed children https://www.30secondsofcode.org/css/s/evenly-distributed-children Evenly distribute child elements within a parent element, using Flexbox. Fri, 06 Sep 2024 00:00:00 GMT Speech bubbles with CSS https://www.30secondsofcode.org/css/s/speech-bubble Create a content container with a triangle at the top, much like a speech bubble. Thu, 05 Sep 2024 00:00:00 GMT Image gallery with horizontal or vertical scroll https://www.30secondsofcode.org/css/s/horizontal-vertical-gallery Create a horizontally or vertically scrollable image gallery. Thu, 05 Sep 2024 00:00:00 GMT Create a toggle switch using HTML & CSS https://www.30secondsofcode.org/css/s/toggle-switch A toggle switch is little more than a checkbox with a custom appearance. This article shows you how to create one without using JavaScript. Wed, 04 Sep 2024 00:00:00 GMT Dynamic shadow https://www.30secondsofcode.org/css/s/dynamic-shadow Learn how to create a shadow similar to box-shadow, but based on the colors of the element itself. Wed, 04 Sep 2024 00:00:00 GMT Zebra striped list or table https://www.30secondsofcode.org/css/s/zebra-striped-list-or-table Use this CSS selector to create a striped list with alternating background colors. Tue, 03 Sep 2024 00:00:00 GMT Responsive image mosaic https://www.30secondsofcode.org/css/s/image-mosaic Create a responsive image mosaic, using CSS grid to create a grid layout and media queries to adjust the layout for different screen sizes. Tue, 03 Sep 2024 00:00:00 GMT Hide element offscreen https://www.30secondsofcode.org/css/s/offscreen Hide an element completely (visually and positionally) in the DOM while still allowing it to be accessible. Mon, 02 Sep 2024 00:00:00 GMT Animated CSS loaders https://www.30secondsofcode.org/css/s/loaders Loading indicators are a staple of modern web design. Here are some CSS loaders to keep your users engaged while they wait. Mon, 02 Sep 2024 00:00:00 GMT Staggered list animation https://www.30secondsofcode.org/css/s/staggered-animation Staggered animations can be used to create a more dynamic user experience. Get creative with your lists! Sun, 01 Sep 2024 00:00:00 GMT Box-sizing reset https://www.30secondsofcode.org/css/s/box-sizing-reset Reset the box-model so that width and height are not affected by border or padding. Sun, 01 Sep 2024 00:00:00 GMT Shake input field when invalid, using CSS https://www.30secondsofcode.org/css/s/shake-invalid-input Inform your users of invalid input by shaking the input field. Sat, 31 Aug 2024 00:00:00 GMT Input with prefix https://www.30secondsofcode.org/css/s/input-with-prefix Ever wanted to create an input with a visual, non-editable prefix? CSS can help you with that! Fri, 30 Aug 2024 00:00:00 GMT