Arms crossed picture of James Auble

Newest Article

July 17th, 2024

Nuxt Todo App With Turso & Vuetify

Code with me as I create a simple todo app using Nuxt, Turso, & Vuetify.


Read the article
July 17th, 2024

Nuxt Todo App With Turso & Vuetify

  • nuxt
  • turso
  • todo app
  • CRUD
  • Vuetify
July 7th, 2024

Use Image Mask to Create Diamond Image With CSS Mask-Image

  • diamond image
  • css mask image
  • image mask
  • svg
July 1st, 2024

Add Heading Anchor Tags to Astro Blog

  • astro blog
  • anchor tag
  • react-tooltip
  • headings
December 31st, 2023

Add User Registration to Next.js Learn Dashboard Project

  • next.js
  • learn
  • register user
  • next-auth
  • auth
November 14th, 2023

Save AI Conversation to Gist or Github Repo

  • AI
  • Save Conversation
  • Gist
  • Markdown
September 1st, 2023

AI Tools I Use For Web Development & Productivity

  • AI
  • Web Development
  • Productivity
  • Tools
August 31st, 2023

Why I Wont Be Using HTMX (Yet)

  • htmx
  • HATEOAS
  • Javascript
  • HTML over-the-wire
July 7th, 2023

Replace Your Bloated Mail Client With Gmail Web App

  • Gmail
  • Mail Client Replacement
  • Spark Alternative
  • Web App
July 7th, 2023

OKLCH Colors Workaround For Disqus' Embed.js

  • Embed.js
  • Disqus
  • OKLCH
  • Parse Error
  • CSS
April 29th, 2023

Is it Time for Position Sticky Header?

  • sticky header
  • fixed header
  • position sticky
  • header at top
  • css
April 2nd, 2023

Suppress Roots.io Bud Build Notification on MacOS

  • roots.io
  • sage
  • build
  • disable notification
March 24th, 2023

Manage Body Classes Cleanly With Alpine.js

  • AlpineJS
  • body classes
  • getter function
  • clean
  • alpine store
January 1st, 2023

A Tailwind Container Queries Demo

  • container queries
  • tailwind
  • @container
  • Media Queries
December 30th, 2022

Hide ACF Custom Fields On WPEngine Production Environment

  • acf
  • wpengine
  • hide custom fields
  • global variable
November 17th, 2022

Render Additional Classes in Wordpress Custom Block Render Function

  • wordpress
  • additional classes
  • render fucntion
  • render
July 29th, 2022

Getting Started With Flex Objects in Grav CMS

  • flex-objects
  • Grav CMS
  • Getting Started
  • Custom Types
  • Blueprints
June 27th, 2022

Tailwind Dark Mode in 60 Seconds

  • tailwind
  • darkmode
  • quick
  • explainer
June 7th, 2022

Accessible Accordion With AlpineJS Using x-id and $id

  • Accessibility Accordion
  • AlpineJS
  • ARIA
  • x-id
June 5th, 2022

Use <input type="image"> Instead of <input type="submit">

  • HTML Image Input
  • type="image"
  • Form Submit
  • HTML Elements
June 2nd, 2022

Create a Wordpress Custom Theme with Genesis Custom Blocks

  • genesis blocks
  • wordpress blocks
  • custom theme
  • gutenberg
April 20th, 2022

Improve Your Inputs With AlpineJS's New x-mask Plugin

  • x-mask
  • AlpineJS
  • html input
  • formatting
  • javascript
March 25th, 2022

Slide Elements Up / Down Without jQuery

  • no jquery
  • slide up and down
  • accordion
  • collapse element
  • slide toggle
  • javascript
March 15th, 2022

Setup a Gatsby + Wordpress Headless Project

  • wordpress
  • gatsby
  • headless
  • starter
  • setup
  • project
March 8th, 2022

A Review of Prismic Using Nuxt.JS

  • Prismic
  • Nuxt.js
  • Review
  • Blog
February 27th, 2022

Happy Birthday To My Blog!

  • Blog Launch
  • James Auble's Blog
  • Happy Birthday
February 10th, 2022

Centering Flexbox'ed List Items of Varying Widths With Max-Width: Max-Content;

  • Flexbox
  • List Items
  • max-width
  • max-content
December 15th, 2021

Ensure Retina/High-Resolution Image Rendering For Custom Wordpress Theme

  • Retina Images
  • Wordpress Theme
  • wp_get_attachment_image
  • srcset
  • <img> element
  • sizes
November 28th, 2021

Wordpress Toast Component To Display Current Template

  • Wordpress
  • Show Current Template
  • Toast
November 26th, 2021

Chrome Devtools CSS Overview: A Long Desired Web Dev Tool

  • Chrome Devtools
  • CSS Overview
  • Web Dev Tools
November 25th, 2021

My Misconception About Flexbox Space Distribution

  • Flexbox
  • CSS
  • Space Distribution
  • Misconception
October 24th, 2021

Revert/Reset Rich Text Editor Styles to Browser Defaults

  • Revert Styles
  • CSS Reset
  • Rich Text Editor Styles
  • Browser Defaults
October 15th, 2021

Prevent Scroll & Save Scroll Position With Mobile Menu

  • Save Scroll Position
  • Mobile Menu
  • Prevent Page Scroll
September 20th, 2021

Move Lines Up/Down in CodePen

  • Move Line Up/Down
  • CodePen
  • Editor
September 9th, 2021

Add PhpMyAdmin to Laravel Sail Container

  • PhpMyAdmin
  • Laravel
  • Docker Container
August 31st, 2021

Disable Adaptive Brightness for Samsung Galaxy Book Flex2

  • disable adaptive brightness
  • Samsung Galaxy Book Flex2
  • display settings
May 29th, 2021

Tag Multiselect Component w/ Alpine.js

  • multiselect component
  • AlpineJS
  • javascript
  • dropdown
  • Alpine component
May 22nd, 2021

CSS Container Query Me Like I’m Five

  • container queries
  • explainer
  • CSS
May 21st, 2021

An Alpine.js Cheatsheet Made With Alpine.js

  • Alpine.js
  • Cheatsheet
  • Made with Alpine.js
April 20th, 2021

Press and Hold Counter in Vue.js

  • counter
  • Vue.js
  • press and hold
  • demo
March 31st, 2021

Copy File or Directory Path to Clipboard in MacOS Finder

  • copy path to clipboard
  • MacOS
  • Finder
March 8th, 2021

3 Responsive YouTube IFrame CSS Styling Methods

  • youtube iframe
  • responsive
  • css
  • 3 methods
February 21st, 2021

Compile SASS/SCSS From The Command Line

  • scss
  • sass
  • compile sass
  • command line
  • CLI
  • Terminal
February 14th, 2021

Do I really need a bundler?

  • gulp
  • webpack
  • do i need a bundler
  • build systems
January 6th, 2021

Simple Stepper With Alpine.js

  • simple stepper
  • AlpineJS
  • Javascript
  • step through
January 5th, 2021

CMB2 Checkbox Field With True as Default

  • cmb2
  • checkbox field
  • true default
  • wordpress
November 11th, 2020

Put Text on its Side in CSS (rotated)

  • rotate
  • CSS
  • Text
November 8th, 2020

Enable Zoom in Chrome on Android Devices

  • Enable Zoom
  • Google Chrome
  • Android
November 8th, 2020

Lifehack: Poor Man’s Soundbar

  • soundbar
  • lifehack
September 20th, 2020

3 Things You Might Not Know About Your Airpods Pro

  • Airpods Pro
  • Things you should know
  • 3 things
July 28th, 2020

Create Stylesheet Programmatically (Now with editing support in Chrome)

  • Create Stylesheet
  • Programmatically
  • Google Chrome
  • devtools
July 21st, 2020

3 Things You Should Know When Beginning CSS

  • 3 Things You Should Know
  • Beginner
  • CSS
July 20th, 2020

A Grid-Template-Areas Intro For Beginners

  • grid-template-areas
  • CSS
  • Intro
  • Beginners
July 3rd, 2020

Copy To Clipboard In MacOS Terminal

  • MacOS
  • Terminal
  • Copy to clipboard
June 22nd, 2020

5 Reasons Microsoft Doesn’t Suck Anymore

  • Microsoft
  • 5 reasons
  • Doesn't suck
June 21st, 2020

VS Code PHP Formatter That Actually Works (Mac/Linux)

  • PHP
  • Code Formatter
  • VS Code
June 5th, 2020

Hello, World Using Gridsome + Netlify Functions (Serverless)

  • Serverless
  • Netlify Functions
  • Gridsome
  • Hello World
June 3rd, 2020

Simple Contact form with PHP

  • Simple Contact Form
  • PHP
  • $_POST
April 12th, 2020

Mobile Menu Dropdown Without Javascript

  • Mobile Menu
  • Dropdown
  • Without Javascript
  • CSS
September 21st, 2019

Set Background Color For Scroll Bouncing

  • background color
  • scroll bouncing
  • CSS
August 5th, 2019

Ignore Node Modules From Transfers With Filezilla

  • ignore node modules
  • FTP Transfer
  • Filezilla
June 22nd, 2019

Install NVM On Mac With Brew

  • install nvm
  • MacOS
  • Brew
June 9th, 2019

A Simple Demo of OptionTree Inputs for Wordpress

  • OptionTree
  • Wordpress
  • Metafields
  • Demo
June 1st, 2019

Make Image Fill Column Height with Bootstrap 3

  • Bootstrap 3
  • fill column height
  • images
May 25th, 2019

Create Wave Border with SVG and CSS Clip-Path

  • wave border
  • css clip-path
  • overlap html elements
May 24th, 2019

Remove White Background of an Image With Mix-Blend-Mode: Multiply

  • Remove White Background
  • Images
  • CSS Mix-blend-mode
May 19th, 2019

Auto-Refresh for Shopify Development using Browser-Sync

  • Auto-Refresh
  • Shopify Development
  • Browser-Sync
  • Gulp
May 16th, 2019

Select HTML Tag Block in VS Code

  • Selecting HTML Block
  • Tag Block
  • VS Code
  • Code Editors
April 27th, 2019

Color Picker Wordpress Control with a Dynamically Added CSS Class

  • Color Picker
  • Wordpress
  • Dynamic CSS Class
January 18th, 2019

A Quick Vue.js Transitions Demo

  • Vue.js
  • Transitions
  • Demo
  • Animations
October 15th, 2018

5 Ways I Taught Myself To Program Abroad

  • Programming
  • Living Abroad
  • Self-taught
  • Self-learning
  • Web Development
Scrolldown Icon