The personal blog of James Doyle (james2doyle) Web Developer in Canada. Logo


Things I like about Dart (Compared to Node.js)

Things I like about Dart when compared to the Node.js ecosystem

Read More

Why I still like Sublime Text in 2025

I still use Sublime Text in 2025 even after trying a lot of other editors

Read More

Hammerspoon hyper key

Use Hammerspoon to create hyper key shortcuts to automate window focus

Read More

Use Your Numberpad To Control Google Hangouts/Meet

Using Hammerspoon to create shortcuts on a number pad that can control Google Hangouts/Meet

Read More

Using Browser Devtools To Improve Your Bug Reports

How to improve your bug reports using the browser dev tools

Read More

Versioning Service Workers In Hugo

How to use Hugo pipes and resources to version your service worker scripts

Read More

Using Laravel `when` Method To Support Multiple Queries

How to use the `when` method on database collections in Laravel to create more flexible and readable code

Read More

Bitbucket Weekly Reports Using Make (Integromat)

Use Make (Integromat) to create a nice weekly report in Slack for all the closed pull-requests in a Bitbucket repository

Read More

Autocomplete TailwindCSS In Custom Attributes/Strings

Use tailwindcss autocomplete classes and logic inside non-default attributes or strings

Read More

Setup A Raspberry Pi with PHP And Lighttpd

Setup a raspberry pi with php 8.1 and the latest lighttpd web server

Read More

Vue stateful form component

Create a Vue form that escalates all events to the top level and supports v-model

Read More

Lodash i18n (translation) function

An incredibly simple i18n (internationalization + translation) function using lodash `get` and `template` functions

Read More

Lodash memoize with a timeout

Use lodash memoize with a TTL/timeout. Allows calls to be cached by time as well as argument values

Read More

Fastmod Codemod For Refactoring

Fastmod is a command line tool that can help you with large-scale codebase refactors

Read More

Vue Omnibar Component

A Vue component that is used to create modal popups that emulate omnibar, command palette, open anywhere, or other search functions/features

Read More

Vue Toggle Component

A Vue component that is used to create simple switches, toggles, and show/hide experiences

Read More

Tailwind Screens In JS

Detect if a tailwind screen value matches the current window

Read More

Vuex Crosstab Plugin

CrossTab syncs Vuex state across same-origin tabs. Converted from storeon crosstab

Read More

Vuex Stateful URL Plugin

StatefulURL is a Vuex plugin that can read and write the state from a query string

Read More

Using slots in Vue js

If you are working with server-rendered apps, using Vue slots can help you create more reusable and flexible components

Read More

Create JSON Sections In Shopify

A demo on how to create a section in Shopify that returns JSON and HTML

Read More

Detect Theme Editor In Shopify Liquid Templates

A demo on how to detect when a template is running in the Shopify theme and section builder

Read More

Using Zapier Webhooks for HTML forms

You can use Zapier webhooks to handle HTML form submissions - if you know how to set up your form

Read More

Use Laravel Valet for WordPress Multisites

Use Laravel Valet for developing local WordPress multisites

Read More

Build A Multi-lingual Laravel Site With Subdomains

Have you ever wanted to use subdomains in Laravel to control logic, locale, or other functionality? Well, this example might help.

Read More

Simple Slack Slash Supplier

A lambda function that provides a simple mechanism for mapping Slack slash commands to pre-built responses

Read More

SQL As An API

An example of how to use SQL as an API instead of reaching for something like GraphQL

Read More

Laravel Scout Sonic Driver

A Laravel Scout driver for the Sonic search tool

Read More

Function Currying To Make Reusable Code

Function currying. If you haven't heard of it before, let me introduce you to this magical pattern that can help reduce duplicate code and improve readability

Read More

When And Where To Compromise Your App Design

When initially developing an application or a new feature we are constantly trying to balance best practices in design with delivering a finished product.

Read More

Using Sqlite As A Cache In Laravel

How to use Sqlite as a cache in Laravel

Read More

Angular (v1.x) Through iFrame

How to use angular.js (v1.x) through an iframe when the iframe URL is dynamically swapped

Read More

Nuxt Firebase Starter

An example project that uses nuxt.js and Firebase for simple auth (social or email/pass) and account profiles

Read More

Using DigitalOcean Spaces

An example project for how to use DigitalOcean Spaces with S3 tools

Read More

3 Ways A Website Project Falls Apart

Over the last 7 years, I have been a part of hundreds of website projects. Here are some of the most common ways I have seen a project fail.

Read More

Handle spaces and no-spaces in MySQL where-like clauses

Have you ever wanted to write a WHERE LIKE for a query with and without spaces? Well, now you can with this trick!

Read More

WordPress Browser Body Class

A simple WordPress tutorial for adding a class to the body that represents the browser. No plugin required.

Read More

Update Laravel Pagination With New Collection

Did you know you can update a Laravel pagination with a new collection?

Read More

Color Helpers In Fish Shell

How to easily create a color function for printing colorized output

Read More

Conditional Vue.js Mixins

How to use commonjs modules as vue.js mixins and how to conditionally load mixins on a per-page-basis.

Read More

Install the latest Node.js on Amazon Linux

How to install the latest version of node.js on the Amazon Linux AMI

Read More

Running Go (golang) in Docker

How to run and deploy golang applications inside a Docker container.

Read More

How To Use Template Strings As Modules

How to the new es6 template string literals to make reusable modules for templates/strings or HTML partials

Read More

How To Use LC_MONETARY In Laravel

How to use setlocale with LC_MONETARY in Laravel

Read More

OpenSSL Passwd Without Prompt

How to use the openssl passwd without a confirm prompt

Read More

Use Nginx for A/B Testing

Use Nginx to set custom headers in your HTTP responses so you can serve conditional content

Read More

Backup MySQL And Email It

Don't bother paying for a SaaS that creates MySQL backups and emails them to you on a schedule, you can do this with CRON and a small script

Read More

Add A Counter For Duplicate Uploads

A short script to detect if a folder contains a duplicate filename, and if it does, the filename gets a counter prepended to the front of the filename

Read More

Add $.getStylesheet To jQuery

Ever wanted to have a CSS/Stylesheet version of $.getScript? Well now you can with $.getStylesheet

Read More

Slack Meta Data For URLs and Links

Tips to get Slack to resolve the correct meta data for your website URL

Read More

Fixing Wordpress wp-content 500 Errors

How to fix the issue where Wordpress wp-content assets are throwing 500 errors

Read More

Simple Benchmarks With Apache AB

a tutorial for generating simple benchmarks using the Apache ab tool

Read More

Varnish For Static Sites

a small tutorial for how to setup Varnish cache for a flat site running on Apache

Read More

Validate Email With Lua

A verbose email validation function for Lua

Read More

Simple PHP JSON Response

Create a simple JSON response using PHP

Read More

Disallowed Characters In URI

The URI you submitted has disallowed characters

Read More

PhalconPHP Completions

A PhalconPHP completions and snippets package for Sublime Text

Read More

Easy FFmpeg Video Posters

Take in a list of video files and generate a poster image for each one

Read More

Minimal Raspberry Pi OS

Setup and improve the Moebius OS for the Raspberry Pi

Read More

Phalcon Micro App Starter

A showcase of a Phalcon Micro App starter template that makes it easy to get started with the Phalcon micro app class

Read More

PhalconPHP Crop Image To Fit

How to crop and scale an image to fit specific dimensions in Phalcon PHP

Read More

PyroCMS Module Generator 2.0

The Pyro Module Generator allows you to rapidly create modules for Pyro 2.2 and up

Read More

Kijiji Vector Logo

the kijiji logo as a vector svg file

Read More

Migrate AllPasswords To 1Password

How to import your allpasswords csv into 1password

Read More

Always Connect To Starbucks WiFi

How to connect to the Starbucks WiFi every time by using your phone.

Read More

Lico

Lico is a re-creation of the PicoCMS for PHP, but written for Luvit for Lua

Read More

Typeform Vector Logo

Another difficult logo to find. This one is for the fun new Typeform service. Typeform allows you to create dynamic and fun forms for clients, events, and other general uses.

Read More

Using Node.js in an AppleScript

How to use Node.js in an AppleScript

Read More

Copy filepath to clipboard in OSX

How to copy a filepath to the clipboard in OSX

Read More

The Simple Spam Stopper

For the last year at WARPAINT Media, we have been getting assaulted with spam.

Read More

Flexible SVG Placeholder Images

Replace a service like placehold.it with your own local version that serves SVG images

Read More

Purge A File From A Github Repo

How to permanently remove a file from a repo and it's history

Read More

Tips For Using SVGs

I found using SVGs can be both amazing and extremely frustrating, so I have to share this information so no one looses their mind.

Read More

Koding Interview

James Doyle interview by the developer social network Koding

Read More

Kaenon Vector Logo

The Kaenon logo in a vector SVG format

Read More

Bash select example

An example of how to use the select command in bash to pass arguments to functions

Read More

Sublime Node Snippets

Sublime Text snippets for node, async, underscore, and lodash

Read More

Simple Binder

simplebinder is a zero dependency one-way databinder for javascript

Read More

Vim Vector Logo

The Vim logo in a vector SVG format. Also includes a ICNS file for OSX.

Read More

Atom Monokai Dark

Dark Monokai theme for the Github Atom editor

Read More

The Alternative Cms

Presentation for The Alternative Cms

Read More

Randomly Generate A Password In Bash

Randomly generate a password of specified length and then copy it to the clipboard

Read More

PHP WebSocket Chat

PHP websocket chat application example

Read More

All About PhileCMS Video

All About PhileCMS Video

Read More

Font Awesome SVG Icons

A sprite sheet of all the font-awesome icons from version 4.0.2

Read More

Groupon SVG logo

groupon logo in vector svg

Read More

Chrome Reverse Geocode App

Chrome Reverse Geocode App

Read More

IICRC Vector Logo

IICRC Vector Logo

Read More

List File Permission Numbers

Easily list the chmod numbers for all the files in a folder

Read More

Easy Command Line Reverse Geocoding

Easily reverse geocode an address using the command line and the google maps API

Read More

Grunt Highlight Plugin

Grunt task for running Highlight.js over files or blocks of code

Read More

Decrypt-Encrypt Functions From Command Line

Functions to encrypt and then decrypt files from the command line with OpenSSL

Read More

Get Wordpress via Command Line

Download and unzip the latest Wordpress version, all via command line

Read More

HostMonster PHPMailer Settings

How to setup PHPMailer on a HostMonster hosting server

Read More

GoDaddy Email on Digital Ocean

How to use GoDaddy Email on Digital Ocean

Read More

Github Wiki To HTML

Github Wiki To HTML

Read More

Phile CMS

Phile is flat-file CMS based on Pico

Read More

Google Drive Flat SVG Logo

Google Drive Flat SVG Logo

Read More

Docracy SVG logo

Docracy logo in vector svg

Read More

Assemble Starter

Assemble for Grunt.js Starter template

Read More

pico-download plugin

I created a plugin to force files to download in PicoCMS

Read More

compare multiple md5 hashes

compare multiple md5 hashes

Read More

Pico-Useragent Plugin

A plugin for pico that allows you to list the useragent

Read More

jQuery-doodal-js

jQuery-doodal-js

Read More

Grunt Sundown

Grunt Sundown

Read More

Simple HTML5 Notifications

Simple HTML5 Notifications

Read More

Render PHP File With Data

Render PHP File With Data

Read More

Pyro Twitter Widget

Pyro Twitter Widget

Read More

Pico Get By Filename Plugin

I wrote another small plugin for PicoCMS that actually lets you load files based on the filename

Read More

Markdown Logo Vector SVG

Markdown Logo Vector SVG

Read More

CMS Watch List

CMS Watch List

Read More

The $100 Website

I wrote a post on WARPAINT Media about people who ask about getting a website for $100.

Read More

Kube in Styl/Rework

Kube in Styl/Rework

Read More

Pico Slider Plugin

a plugin for Pico that allows you to create a Slider

Read More

NPM logo SVG

The NPM logo as a SVG

Read More

Apax apache theme in htdocs

Apax apache theme in htdocs

Read More

Disqus Comments

Adding Disqus Comments to the website

Read More

Pyro Github Markdown Field Type

Pyro Github Markdown Field Type

Read More

PyroCMS UA Sniffer Plugin

A plugin for PyroCMS that allows UA Sniffing

Read More

rework-math

I created a plugin for rework that allows you to do simple math

Read More

rework-shade

A package for rework that allows a shade function

Read More

grunt terminal-notifier setup

grunt terminal-notifier setup

Read More

NudeProject - a starting point for simple websites

NudeProject - a starting point for simple websites

Read More

Detect Animation Events in Javascript

Detect Animation Events in Javascript

Read More

Startup Canada SVG logos

All the Startup Canada SVG logos

Read More

CrunchBase SVG logo

CrunchBase SVG logo

Read More

Modernizr SVG Fallback to PNG

Modernizr SVG Fallback to PNG

Read More

Custom Google Forms

I have been complaining about the lack of themes for google forms for a while now. I finally decided to stop crying and do something

Read More

Salt.js micro selector library

salt.js is micro DOM selector library. Minified, it comes in at 255 bytes

Read More

CSS3 badge logo in SVG

CSS3 badge logo in SVG

Read More

April 2013 Redesign!

Another redesign. This one is completely by me, with a little help from the html5blank Wordpress template. I am using SVGs exclusively.

Read More

AngularJS Hangout - Promises Promises

AngularJS Hangout - Promises Promises

Read More

Switching to SVG on Grey Nimbus

Switching to SVG for all images on my website

Read More

Pyro Swipe.js Module

A module for Pyro CMS that wraps up the Swipe.js Module

Read More

PyroCMS Module Generator

PyroCMS Module Generator that can generate modules for pyrocms

Read More

Grey Nimbus website

My old Grey Nimbus website

Read More

jQuery Plugin Snippets for Sublime Text 2

jQuery Plugin Snippets for Sublime Text 2

Read More

Pyro Image Select Field

A field for Pyro CMS that allows you to select images from your uploads

Read More

PHP Variables in strings

A list of all the ways you can put PHP Variables in strings

Read More

Pyro Blurb Field

A field for Pyrocms that allows you to create little blurbs in a list

Read More

Canadian Provinces Field

Canadian Provinces Field

Read More

Git Website Workflow

Git Website Workflow

Read More

PyroCMS PageWidgets Field Type

PyroCMS PageWidgets Field Type

Read More

Clean CSS Updated

Clean CSS Chrome app Updated

Read More

Pyro List Field

A field for Pyro CMS that allows the creation of Lists

Read More

Pyro Image Widget

A widget for Pyro CMS for creating Image sections

Read More

Zepto Drag & Swap

Create a drag and drop list with Zepto

Read More

Making a socket.io app and how socket.io works

Making a socket.io app and how socket.io works

Read More

Clean CSS in Chrome Apps Office Hours

So my chrome app Clean CSS made it onto one of the Chrome Apps Office Hours.

Read More

View Folder Tree in MacOSX Terminal

View Folder Tree in MacOSX Terminal

Read More

New business cards

Check out my new business cards

Read More

Flexbox Demo

A demo of CSS Flexbox

Read More

WYSIWYG in PyroCMS Widgets

WYSIWYG in PyroCMS Widgets

Read More

Letterpress loader in CSS

Create the Letterpress loader in CSS

Read More

Kube-Node-Express

Kube-Node-Express

Read More

Source Code Pro on Sublime Text

Download and install Source Code Pro on Sublime Text

Read More

Array.prototype.range()

How to create Array.prototype.range in Javascript

Read More

Generated Content in CSS

Use Generated Content in CSS to show an Article link in plain text

Read More

No Javascript CSS Accordion

Build an Accordion with just CSS and no Javascript

Read More

Dancing Music Bars

Create a Dancing Music Bar animation in CSS and SVG

Read More

zsh new file && open file function

zsh new file && open file function

Read More

Target Mozilla-only in CSS

Target Mozilla-only in CSS

Read More

My Old Website

See my old website

Read More

CSS Date Card

Create a Date Card using CSS transitions, animations, and gradients

Read More

CSS3 Pagebend

Create a Pagebend effect using CSS

Read More

nodelist.each

nodelist.prototype.each in javascript

Read More

Mozilla Dev Derby

James Doyle runner up in Mozilla Dev Derby September 2012

Read More

No-Js Image Preview

Create a No-Js Image Preview with only CSS

Read More

Styling Radios and Checkboxes. Redux.

Styling Radios and Checkboxes. Redux.

Read More

WordPress Plugin Swipe.js

WordPress Plugin Swipe.js

Read More

Making Checkboxes in WordPress options pages

Making Checkboxes in WordPress options pages

Read More

Styling radio and checkbox inputs

Styling inputs can be pretty annoying. I donโ€™t think I really have any consistent way of making custom inputs

Read More

Generated content in CSS

How to use Generated content in CSS

Read More

Installing Android 4.1.1 Jelly Bean for Nexus S

How to flash jelly bean onto a nexus s

Read More