Navigation list item hover & focus effect
Create a custom hover and focus effect for navigation items, using CSS transformations.
Code Articles
30 seconds of code contains a curated collection of code articles covering a wide range of development needs. The collection spans many topics, ranging from simple coding problems to theoretical concepts and development techniques.
-
CSS · -
CSS · CSS Button Transitions
Add some life to your buttons with these simple CSS transitions.
-
Web development · 4 SEO tips for developers
SEO is a very relevant topics that most developers are inexperienced in. Here are 4 actionable SEO tips you can implement today.
-
JavaScript · Weekday name from a JavaScript Date object
Get the name of the weekday from a JavaScript
Dateobject. -
JavaScript · Walk through a JavaScript object depth-first
Create a generator that walks through all the keys of a given object.
-
JavaScript · Validate the properties of a JavaScript object
Check the properties of an object against an array of keys or another object to ensure they match.
-
JavaScript · Apply a mapping function to each character in a JavaScript string
Learn how to replicate the behavior of
Array.prototype.map()for strings. -
JavaScript · Map a JavaScript array to an object
Map the values of an array to an object, using the given mapping functions.
-
JavaScript · How can I listen for a click outside of an element in JavaScript?
Detect and handle click events outside of a specific element in just a few lines of JavaScript.
-
JavaScript · How can I create a JavaScript generator function that repeats one or more values indefinitely?
Learn how to create a generator function that repeats a given value or an array of values indefinitely.
-
JavaScript · Digitize a number in JavaScript
Learn how to convert a number to an array of digits, removing its sign if necessary.
-
JavaScript · Find the day, week, month, or quarter of the year using JavaScript
Determine the day, week, month, or quarter of the year that a date corresponds to, using vanilla JavaScript.
-
JavaScript · Check if a JavaScript collection is empty
Quickly determine if a collection of values is empty in JavaScript.
-
JavaScript · You can't extend JavaScript's Proxy object
Turns out the Proxy object is not extensible, but there's a way around its limitations.
-
JavaScript · Binary search in a sorted JavaScript array
Use the binary search algorithm to find the index of a given element in a sorted array.
-
JavaScript · Generate all consecutive element subarrays from a JavaScript array
Create an array of
n-tuples of consecutive elements from a given array. -
JavaScript · How can I check if a JavaScript array includes a specific value?
Checking if an array includes a specific value is pretty straightforward, except when it comes to objects.
-
JavaScript · Arithmetic and geometric progression in JavaScript
Create arrays of numbers in arithmetic and geometric progression.
-
JavaScript · Check if all values of a JavaScript array are equal
Use the
Array.prototype.every()method to check if all values of an array are equal in JavaScript. -
Git · Purge a file from Git history
Did you accidentally commit sensitive information? Learn how to completely purge a file from Git history.
-
CSS · How can I create a custom responsive favicon for dark mode?
Learn how to create a custom responsive favicon that can adapt its color palette for dark mode with this quick guide.
-
CSS · What are CSS pseudo-classes?
Learn how to use CSS pseudo-classes to style an element based on changes to its state.
-
CSS · CSS inherited properties cheatsheet
A quick reference for inherited CSS properties.
-
React · Testing Redux-connected components with React Testing Library
Testing Redux-connected components is pretty common. Learn how to use this simple utility function to speed up your testing.