Javascript

2024-10-04T00:00:00.000Z 4th October 2024

Bulk create populated Google Docs from a Google Spreadsheet

How to create Google Docs from a single Google Spreadsheet with variables for mail-merge style creation.

2022-09-25T00:00:00.000Z 25th September 2022

Return a Zip file in Node with a Netlify function

Use a Netlify function to return a Zip file using jszip

2021-07-26T00:00:00.000Z 26th July 2021

Making an 11ty collection from a remote XML file

RSS is XML with a specification, however not all RSS feeds follow the spec. In this post, we process the feed as an XML document meaning we can access the extra attributes and values

2021-07-12T00:00:00.000Z 12th July 2021

Create an 11ty collection from any RSS feed

Using 11ty global data files, we create an 11ty collection from an RSS feed. As an example, we show the latest YouTube videos on our website

2021-05-17T00:00:00.000Z 17th May 2021

Accessing 11ty filters within data files to keep your code DRY

11ty filters can exist as JS functions inside the declared filters directory - these can be accessed by other files not processed by 11ty

2021-04-15T00:00:00.000Z 15th April 2021

11ty Utils - an NPM Package

I published an NPN package the other day which contains some everyday 11ty utils

2021-04-12T00:00:00.000Z 12th April 2021

Build an 11ty calendar to list all your posts

List all of your posts (or other collection items) in a calendar/diary format to give a timeline of your past

2021-04-05T00:00:00.000Z 5th April 2021

Using Cloudflare workers to publish your scheduled 11ty posts

Learn how to schedule blog posts and other items to go live with your static site generator without having to rebuild the whole site. Get all the benefits of a dynamic CSS with static files

2020-07-22T00:00:00.000Z 22nd July 2020

Getting a Slack helper running with Netlify: Part 2

Part 2 of the Slack status updater with Netlify. This walks through using dotenv and locking the function down to "local" use. There is also a crude UI that has been made

2020-07-20T00:00:00.000Z 20th July 2020

Getting a Slack helper running with Netlify: Part 1

So I'm a bit of a dinosaur when it comes to web stacks - I'm all about LAMP (Linux, Apache, MySQL, PHP). I had an idea for a small little web app and thought it would be the perfect opportunity to give Netlify a go.

2019-05-03T00:00:00.000Z 3rd May 2019

Build your own "share this" component

Using a Share This plugin (or similar) or the native sharing widgets from social networks can really bloat your page and look ugly. This code is how we, at Liquid Light, implement social sharing widgets

2019-04-20T00:00:00.000Z 20th April 2019

How to use fetch in JavaScript to GET or POST data

Fetch is a fantastic JavaScript function which allows you to natively get and post data from the browser. This post includes some examples of how to use it.

2018-08-07T00:00:00.000Z 7th August 2018

How to filter an array of objects based on a secondary array in JavaScript

Sounds confusing, but there is a use-case, honest! Imagine you have an array with a set number of items in and you wanted to filter another array of objects based on that in your JavaScript. The post explains more!

2017-11-08T00:00:00.000Z 8th November 2017

Filters in Vue.js: What are they, how do you use them, and how do you make them? (video)

There are many ways to manipulate a value to make it user-friendly using Vue.js. In this tutorial, I show you how you can use Vue filters to alter the appearance of a variable without affecting its data.

2017-10-21T00:00:00.000Z 21st October 2017

Using props for accessing URL parameters within components with Vue Router (video)

This quick video walkthrough shows how you can replace any URL parameters in your components with props and how to pass them through from vue router to access them within your component

2017-10-13T00:00:00.000Z 13th October 2017

Vue: Using localStorage with Vuex store

Using the browser's localStorage we can create a Vue app which has its Vuex store cached. This allows the user to navigate away from the app and not lose their preferences.

2016-11-03T00:00:00.000Z 3rd November 2016

Building a Vue v2 JS app using Vue-router

Written For Liquid Light

Vue JS is a javascript framework which has recently released version 2. Allowing you to display, manipulate and navigate data, Vue is a React, Knockout and Angular competitor. This blog post walks through building a web app with Vue Router.

2016-04-20T00:00:00.000Z 20th April 2016

Making Craft CMS work with Prism JS using pre and code blocks

You may (or may not) have noticed that my site had a massive overhaul. With that overhaul, I changed CMS from Anchor to Craft.

2016-03-04T00:00:00.000Z 4th March 2016

Get background image information if element has a one in jQuery

Recently I need to loop through elements on a page and, if the element had a background image apply a jQuery plugin. The plugin required the background image path & dimensions to function

2015-02-12T00:00:00.000Z 12th February 2015

Filtering Tables with jQuery

I was recently asked by a friend how you would make a table filterable by using a select box & jQuery - for example "show me films made just in 2014.