Category: JavaScript

Local Development with Node and Express

Create your Server If you are working with React and webpack, you probably or mostly never have to create your own local server. If you ever wonder how it works under the hood, here is a simple way to get a local server up...

Let’s Get Ready to Rumble! Composer vs npm

TL;DR? NPM 🥊 Composer 👊 npm install (libraries go in node_modules, executables in node_modules/.bin) composer install (libraries go in vendor, executables in vendor/bin) npm install --production composer install --no-dev npm install --package-lock-only composer update --lock npm install <package> composer require <package> npm...

Post Event Report: Jamstack Conf Virtual 2020

Jamstack Conf is a two-day celebration of the next generation of web apps, where the JAMStack community and ecosystem come together to learn, connect, and create. Conference attendees range from frontend and full-stack engineers to web agencies, all ready to push the...

WordPress Block Development Made Easy

WordPress block development can be daunting. It’s already intimidating enough that you need to know ReactJS, you also need to install and configure tools like webpack, Babel, and ESLint. Here at WebDevStudios, we like to build things; and we love to do...

StorybookJS and Why You Should Use It

What is Storybook? Storybook is a user interface (UI) development environment and playground for UI components. The tool enables developers to create components independently and showcase components interactively in an isolated development environment. Storybook supports many different frontend view layers. React, Vue,...

A Better, Cleaner Way to Render HTML with JavaScript

As a team of WordPress developers, we often stumble upon a task where we need to request a set of data using AJAX and render it to the browser. Most of the the time we do it like this: View the code...

Creating, Extending, and Upgrading Custom ACF Fields That Use Select2

Advanced Custom Fields (ACF) has been around for quite a while now, and it’s super popular. We’re on version 5.x now, and the earliest dated reference documentation I could find was for ACF 2.0 in 2011. There have been some bumps along...

How to Use the Observable Pattern in JavaScript

Lately, I’ve been trying to become more familiar with design patterns. One thing I’ve realized along the way is that it’s not easy to recognize where a specific pattern might be useful. It usually comes down to having that light bulb moment...

Compile JavaScript with Webpack in a WordPress Plugin

The goal of this article is to show you how to configure webpack to watch and compile the JavaScript files in a WordPress plugin. What this article will not cover is how to configure webpack to work with every file type known...

Beaver Builder Custom Fields

At WebDevStudios (WDS), we’ve used Beaver Builder for several projects because it provides a quick and intuitive way for our clients to customize their websites. The development documentation for Beaver Builder is pretty good, however it falls short in one particular area: custom...