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 Designing a user-centric API for a JavaScript library https://www.30secondsofcode.org/js/s/user-centric-api-design Building atop the TDD foundation from last time, let's explore how to design a user-centric API for our JavaScript library. Thu, 20 Mar 2025 00:00:00 GMT Kickstart a JavaScript project with Test-Driven Development https://www.30secondsofcode.org/js/s/test-driven-development-intro I recently built a project using Test-Driven Development (TDD) and it was a great experience. Here's why I think you should try it, too. Mon, 17 Mar 2025 00:00:00 GMT What happens when you call every() on an empty JavaScript array? https://www.30secondsofcode.org/js/s/empty-array-every-some A few days ago, I stumbled upon a perplexing piece of JavaScript behavior. Let's break it down. Fri, 14 Mar 2025 00:00:00 GMT Create a math expression parser in JavaScript https://www.30secondsofcode.org/js/s/math-expression-parser Building on top of everything we've tried in past articles, we'll use the Earley parsing algorithm to parse and evaluate math expressions. Wed, 12 Mar 2025 00:00:00 GMT Making a Brainfuck interpreter in JavaScript - Part 2 https://www.30secondsofcode.org/js/s/brainfuck-interpreter-part-2 Picking up where I left off last time, I'm wrapping up the Brainfuck interpreter, by making a simple VM for code execution and debugging. Sat, 08 Mar 2025 00:00:00 GMT Making a Brainfuck interpreter in JavaScript - Part 1 https://www.30secondsofcode.org/js/s/brainfuck-interpreter-part-1 Continuing on the code interpretation path, I'm attempting to build a Brainfuck interpreter, using an AST to represent and execute the code. Sat, 01 Mar 2025 00:00:00 GMT Implementing a Smallfuck Interpreter in JavaScript https://www.30secondsofcode.org/js/s/smallfuck-interpreter Yet another interpreter article, this time around we'll be building a full-fledged interpreter for the esolang Smallfuck. Mon, 24 Feb 2025 00:00:00 GMT Simple HTML tokenization & validation in JavaScript https://www.30secondsofcode.org/js/s/simple-html-tokenization-validation Expanding upon previous articles on bracket matching and tokenization, it's time to try a basic HTML tokenization and validation algorithm. Fri, 21 Feb 2025 00:00:00 GMT 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