All Mad Designs Web Development tutorials and informationals for building user friendly websites. We cover user centric topics like SEO, Page Speed, Core Web Vitals and more for beginners to advanced developers.
If you want to learn how to create a fluid CSS grid with static measurements (such as px), this article is for you! What is a fluid grid? Creating a responsive CSS Grid is pretty easy in theory. You could set up your body tag as a 3X3 fluid grid by setting the display to …
I’m so excited about a new CSS feature that should make designing layouts much simpler. Thanks to interop 2023, CSS now has a snazzy new feature that allows you to set up child elements to a grid as a subgrid element. In this article, I’ll explain what CSS subgrid is and how to create a …
Looking to create your own PluginSidebar but want to use React or Material UI for your components instead of createElement? Look no further! This post walks you through creating a Plugin, Creating the Plugin Sidebar, Webpack & Babel Configurations, and Using WordPress Data stores to hook up to Material UI components. This post has everything …
If you’ve just recently started learning how to create WordPress Blocks, then you’re probably familiar with the @wordpress/create-block package that allows you to quickly create a plugin and block all at once! This is an amazingly fast build tool, but it can be hard to know how to update your brand new plugin to feature …
If you’re familiar with React hooks but don’t know how to create a custom hook in React, this post is for you. I’ll provide you with a simple to understand custom hook from scratch so that you can get started making your own custom React hooks today! Before we begin Before we get started, I’ll …
If you’re looking to test a React text input by typing into it with userEvent, you are in the right place. I’ll show you how to test that text has been typed into a text input. This post will walk you through how to update to userEvent 14, and how to write a simple unit …