Craig is a freelance UK web consultant who built his first page for IE2.0 in 1995. Since that time he's been advocating standards, accessibility, and best-practice HTML5 techniques. He's created enterprise specifications, websites and online applications for companies and organisations including the UK Parliament, the European Parliament, the Department of Energy & Climate Change, Microsoft, and more. He's written more than 1,000 articles for SitePoint and you can find him @craigbuckler.
Craig's articles
An Introduction to Frameworkless Web Components
By Craig Buckler,
Learn what web components are and how to use them without a JS framework. This article shows you an approach that relies on custom elements.
How to Store Unlimited* Data in the Browser with IndexedDB
By Craig Buckler,
Client-side storage has a lot of practical use cases. Learn the fundamentals of storing data in the browser using the IndexedDB API.
How to Deploy Your Jamstack Site to Cloudflare Pages
By Craig Buckler,
There's a growing list of options for hosting Jamstack sites. Find out what Cloudflare Pages offers and how it compares to the competition.
10 Client-side Storage Options and When to Use Them
By Craig Buckler,
Sometimes you want to store data in the browser and not send it to a server. Learn 10 ways to do so, their pros, cons, limits, and use cases.
How to Make Your Site Faster with the Performance API
By Craig Buckler,
The Performance API offers a way to measure website and app speed. Learn how to use it on actual devices used by real people in different locations.
7 Reasons NOT to Use a Static Site Generator
By Craig Buckler,
Static sites can have benefits, but they aren't right for every project! Learn seven reasons why an SSG might not be the best choice for your next project.
Queue Data Structures: How to Build a Node Task Queue
By Craig Buckler,
Queues prevent bottlenecks by managing how long-running tasks are executed. Learn how to use them in your apps by building a Node task queue.
7 Reasons to Use a Static Site Generator
By Craig Buckler,
Is a CMS overkill for your next app? Could a static site generator improve performance, management and security? Learn about the benefits of using an SSG.
How to Use ngrok: Easily Share Your Local Server [Step-by-Step]
By Craig Buckler,
ngrok is a free service that helps you share a website running on your local machine with the world. This tutorial shows you how it works and how to use it.
How to Use JSON Data Fields in MySQL Databases
By Craig Buckler,
MySQL 5.7+ InnoDB databases and PostgreSQL 9.2+ support JSON document types in a single field. We explore the MySQL 8.0 JSON implementation in more detail.
How to Simulate Mobile Devices with Device Mode in Chrome
By Craig Buckler,
Does your web app work in all devices? Testing is a huge job. Learn how to enable Chrome's useful device mode to emulate dozens of mobile devices.
What is the JavaScript Internationalization API (I18n)?
By Craig Buckler,
Need to translate your website? Learn how to use the JavaScript Internationalization API (I18n) and how easy it is to implement it in your apps.
5 Different Ways to Declare Functions in jQuery
By Craig Buckler,
There are several ways to define a block of JavaScript functionality. Learn which is the most appropriate one for your particular use case.
How to Use SVG Image Sprites
By Craig Buckler,
Sprites are popular for bundling graphics into a single file. And they can even be made with SVGs! Learn how SVG sprites work and why they're so awesome.
How to Install PHP on Windows 10 (with Apache & MySQL)
By Craig Buckler,
Looking for tips on how to install PHP on Windows? We walk step by step through how to install PHP 8 and Apache 2.4 on Windows 10 (64-bit).
How to Use PostCSS as a Configurable Alternative to Sass
By Craig Buckler,
Sass is handy, but can't do everything. Learn how to use PostCSS to create a custom CSS preprocessor that compiles Sass syntax but also adds extra features.
Lightweight Autocomplete Controls with the HTML5 Datalist
By Craig Buckler,
Too many options in your HTML Select list? Try a Datalist! Learn how to work with this lightweight, accessible, cross-browser autocomplete form control.
How to Add Scalable Vector Graphics to Your Web Page
By Craig Buckler,
How should you add scalable vector graphics to a web page? Learn about six different methods, including inlining, image tags, iframes, and CSS backgrounds.
How to Use WordPress as a Headless CMS for Eleventy
By Craig Buckler,
You want to offer static-site benefits to clients, but they want WordPress! Learn how to use Eleventy with WordPress to offer the best of both worlds.
An Introduction to the Rollup.js JavaScript Bundler
By Craig Buckler,
Snowpack, webpack and Parcel bundle your JS but are hard to custom configure. Rollup.js is faster and more configurable. Learn how to set it up!
An Introduction to the JavaScript Temporal API
By Craig Buckler,
Date handling in JavaScript? Ugh. It's a mess. But there's hope! Find out what the new JavaScript Temporal API will bring to a browser near you in 2021.
Records and Tuples: JavaScript’s New Immutable Data Types
By Craig Buckler,
Are you frustrated by immutability issues in JavaScript? Learn how records and tuples will finally permit robust immutable data storage and comparisons.
5 JavaScript Tools to Look Out For in 2021
By Craig Buckler,
Got your JavaScript toolset organized for 2021? Not so fast! Check out our predictions for rising stars that are looking hot for 2021.
Cut, Copy and Paste in JavaScript with the Clipboard API
By Craig Buckler,
Need to access the OS clipboard using browser JS? Learn how to use the new asynchronous Clipboard API, a better option than the old document.execCommand().
How to Draw Cubic Bézier Curves on HTML5 SVGs
By Craig Buckler,
The SVG path element offers a range of curve effects, and in this article, Craig Buckler demonstrates how to draw cubic bézier curves.
How to Draw Quadratic Bézier Curves on HTML5 SVGs
By Craig Buckler,
The SVG path element offers a range of curve effects. In his first tutorial, Craig demonstrates how to draw quadratic bézier curves.
How to Translate from DOM to SVG Coordinates and Back Again
By Craig Buckler,
Mix DOM and vector interactions in SVG, translating from SVG to DOM coordinates and back, and translating to transformed SVG coordinates.
CSS with SVG: Real World Usage
By Craig Buckler,
Craig explains how to add CSS styles to SVGs when used as static images, inlined backgrounds and HTML, sprites, HTML content effects and portable files.
How to Create Complex Paths in SVGs
By Craig Buckler,
Craig Buckler demonstrates more advanced uses of the SVG path element, explaining how each of its various parts actually work.
Scalable Vector Graphics: Drawing Basics
By Craig Buckler,
Craig Buckler introduces SVG drawing basics, explaining the SVG viewbox, document structure, and how to draw shapes such as lines, circles, and rectangles.