21st June 2021
The cleanest way of handling user authentication with Nuxt.js
Rather than client-side user authentication, this blog post works through how to catch a user authentication error with Nuxt
Showing posts from the category "Web"
21st June 2021
Rather than client-side user authentication, this blog post works through how to catch a user authentication error with Nuxt
22nd March 2021
PHP Deployer is a great little utility for deploying your PHP app via command line. It doesn't force you to use any specific tech stack and simplifies the process of getting your app live.
8th March 2021
I recently migrated our Gitlab server install from one server to another. With the help of a few tutorials it was fairly painless, however I thought I would outline the steps here
22nd February 2021
I have recently made a side project called "Socket RSS". The idea is it becomes a place for Gleefreshing, not Doomscrolling.
15th February 2021
Laravel Mix is a great asset compiler from the creators of Laravel - but you don't have to be using their framework to benefit from it. This blog walks through setting it up to run with 11ty.
1st February 2021
Despite the name, Laravel Mix isn't just for Laravel. It is a tidy, succinct task runner with understandable syntax and a single config file. This tutorial will run through setting it up with your project
18th January 2021
In this post we are going to set up a custom domain in Netlify using Cloudflare. We will also install a self signed Cloudflare certificate on Netlify to ensure end-to-end encryption.
7th October 2020
I spent the week converting Behind the Source from Craft to Eleventy (a static site generator). Will I use it again?
5th October 2020
Walking through setting up Homebrew on your Mac, so you can install NPM and Eleventy.
15th September 2020
I am currently in the midst of developing a new side-project and wanted to use the same class as a base for two separate elements of the project.
22nd July 2020
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
20th July 2020
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.
5th July 2020
It seems I have been doing a lot of command line work on Debian with MySQL recently and have been having to search the internet (or my bash history) every time I need to do something. Here is a collection of commands I have been using
28th May 2020
The magic 40 character string that is attached to every commit you do. What is it, where does it come from and will understanding it help you with Git in the future?
20th April 2020
Written For Liquid Light
Cloudflare is a service which, among other things, provides a CDN (Content Delivery Network), firewall, and performance layer for your website. It has plenty of paid upgrades and features and ...
19th April 2020
Cloudflare has a few different options when it comes to selecting which TLS/SSL mode you should choose?
16th April 2020
I set up Tiny Tiny RSS as a self-hosted feed reader, but it wasn't clear how get the application to fetch RSS feeds in the background. This blog post gives a walkthrough
5th March 2020
An example of how to use Cloudflare Workers to set a cookie on your page without modifying code on your server. This Worker can set a cookie based on either a GET parameter in the URL or a particular file path
26th February 2020
Serverless & Cloudflare workers have been cropping up a lot recently. I try to organise my thoughts into what they are and how you can use them
10th December 2019
Written For Liquid Light
As a developer, dealing with designers and their creations can sometimes be challenging. At Liquid Light we've honed our process to ensure minimum friction between both developers and designers.
22nd August 2019
I've always been keen to discover new newsletters and have always kept my eye out for recommendations. I decided to collate these recommendations and build a directory.
31st July 2019
I read "The Real Dark Web", a blog post from @whalecoiner and within a few paragraphs it really hit home. There are a few noisy web developers who are innovating, ...
20th June 2019
To save me Googling, I have collated all the user-related commands I often use - particularly useful when setting up a new VM!
20th June 2019
Xen is a basic but powerful package for linux which allows you to create virtual machines, A rival to Vagrant, Xen has less configuration (but is potentially less "agile")
3rd May 2019
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
20th April 2019
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.
14th February 2019
Docker allows you to host websites locally, which allows you can develop them within an environment which can be an exact replica of the live one. This blog post explores my first experience with Docker.
4th February 2019
Newsletters that I, as a front-end developer, have found extremely useful and insightful. This is a new list compared to the original from 2016!
18th October 2018
Written For Liquid Light
Lumen is a micro-framework from the creators of Laravel. Using Laravel methodology, Lumen offers a leaner, cut-down version of the framework. By including less code, Lumen is able to offer ...
13th August 2018
I've had a few questions regarding what apps I use with which themes and settings. This is an up-to-date blog post with the answers.
7th August 2018
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!
12th March 2018
I've recently moved all of my git repositories to Gitlab, this blog post walks through a script I have written to clone all of my repositories locally as a backup.
18th December 2017
This blog post covers the initialisation and basic usage of Vuex - a central store for your Vue applications. It covers the basics of the four main components of Vuex: the state, mutations, actions and getters.
18th December 2017
In the second part of this series, we cover implementing a Vuex Store into a Vue.js application
8th November 2017
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.
26th October 2017
This Vue.js tutorial explains the difference between dynamic and static attributes and props. It shows how you can pass variables to components or other HTML elements to display dynamic contents.
25th October 2017
Written For Liquid Light
Schema is a way of structuring your code to make your content available in a "richer" format.
21st October 2017
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
13th October 2017
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.
18th September 2017
Written For Liquid Light
Validating your Google Event tracking is working can be a tricky business. This blog post walks you through checking the data being sent to Google Analytics, so you can verify the information is correct.
5th September 2017
Changing permissions on files and folders can be tedious, so why not do it in one fell swoop?
15th August 2017
Written For Liquid Light
Navigation drop-downs, or mega menus as they are sometimes dubbed, are becoming more and more common on the web. A drop-down menu is a navigation block which appears when a ...
23rd July 2017
Sometimes you don't want to have to enter your password every time you run a sudo command - this blog post walks you through disabling that.
3rd July 2017
There may be a point in your CSS coding that you want to know the opposite of a direction (e.g. up, down). This function allows you to pass it a direction and get the opposite back!
14th June 2017
Last September I gave a talk at Bytes 2016, a mini-conference for people in the web about my digital bucket list for people who work with the internet.
19th May 2017
I needed to locate any folder following a particular pattern that did not have a particular file. The command allows you to locate the folders and perform actions on them.
15th May 2017
There are rare times when you need a slightly obscure git command. You spent several minutes googling, crafting and constructing your command only to run it once and not need it again for a while. This blog post will serve as my dumping ground for those odd commands I seldom need, but when I do I can then copy and paste. Feel free to get in touch with your favourite curve-ball command and I'll do my best to add it to the list!
10th May 2017
It may be that you wish to include a lot of information in a Github issue (or anywhere else on the web that allows HTML) but don't want the code/error to fill out the page. Luckily, there is a way to collapse it using latest HTML tags.
3rd May 2017
Being able to animate with CSS transitions is great, although there are a few gotchas when using them. This one with transition-delay had me scratching my head for a while.
26th April 2017
CSS Custom properties are now supported in Edge, meaning you can use them nearly everywhere. However, there are some cases where further browser support is required. Using PostCSS we can use CSS custom properties in development while still maintaining cross browser support.
13th March 2017
Written For Liquid Light
PageSpeed Insights (PSI) is a tool developed by Google to rank the speed of your website. There are a few things it doesn’t look out for, such as code validation or usability but it’s a good starting point at getting your site up to scratch.
15th December 2016
Written For Liquid Light
Feefo, the customer feedback and review website, launched version 3 of their product at the end of September. Although customers had no choice to be updated to version 3, what does this ...
17th November 2016
I recently set out to remove all of the vendor prefixes from the CSS for all of our clients at work. This is because we use Gulp with Autoprefixer - which means we have up-to-date prefixes and cleaner SCSS. One way of doing this would be to open every CSS file, search for `-moz`, then search for `-webkit` etc. Some of the CSS I was searching through is well over 5 years old and is rife with vendor prefixes.
3rd November 2016
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.
23rd October 2016
How to set up a new VPS with all the expected features and functionality
2nd August 2016
Written For Liquid Light
Trello is a great tool which lets you easily manage projects. Ranging from websites to weddings, Trello helps you create tag and move cards. At Liquid Light, we use Trello to keep track of our marketing output - this blog explains how.
27th May 2016
Written For Sitepoint
Atom is a fantastic IDE and is hugely powerful. I share my favourite, time-saving tips, packages and shortcuts for GitHub's Atom code editor.
20th May 2016
With recent front-end twitter conversation turning to CSS frameworks, I went on a roller coaster of emotions but eventually settled on the above to sum up how I felt about the ordeal. Before we settle once more, let me take you on the journey I travelled.
4th May 2016
I have recently been writing some small code snippets and examples for alligator.io. It's a great little website which takes front-end code and breaks them down into bitesize ...
4th May 2016
Written For Liquid Light
Creating a responsive, HTML email template is not as easy as it first appears. Email clients are still behind with web standards and supporting latest web technologies, so HTML emails need to be built using the table element and inline styles. This blog will walk you through creating a custom template while still using Mailchimp's WYSIWYG and Image editor
20th April 2016
You may (or may not) have noticed that my site had a massive overhaul. With that overhaul, I changed CMS from Anchor to Craft.
11th April 2016
There is so much information on the web these days about development, that I often miss out on things on twitter. For that reason, I find HTML newsletters amazingly simple but wonderfully nutritional for my front-end developer brain.
22nd March 2016
Written For Liquid Light
Gulp is a task runner used for compiling SCSS to CSS, minifying JS and creating SVG sprites. Version 4 is about to be released and this blog post runs you through how to update and use the new features of gulp.
6th March 2016
I recently purchased a Western Digital EX2 NAS box for my home storage. This device is a low powered file server which is on all the time - perfect for taking care of those hefty downloads and long running tasks so I don't need to keep my laptop on.
4th March 2016
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
2nd November 2015
Written For Liquid Light
Making sure your typography is readable on every display is arguably one of the most important aspects of front-end development. If your users can’t read the content on the ...
17th June 2015
Getting your passwords out of Locko into something else can be tricky due to their unique export format. This post helps with PHP
10th March 2015
Written For Liquid Light
Git is a tricky subject to get your head around. Knowing the commands is one thing, but knowing how to use them is another. This article will walk you through a simple, single developer Git workflow - covering the commands that you would use at each stage.
12th February 2015
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.
15th December 2014
Written For Liquid Light
HTML emails are a great way of keeping your customers up-to-date, but are not as versatile as web pages. Here's our list of things to consider when designing and building HTML emails.
3rd December 2014
To put it very simply, a PHP class is a way of grouping a set of functions and variables into entities,allowing them to be used as self-contained instances.
11th November 2014
Written For Liquid Light
Following on from our recent blog post about SVG Sprites which gave an introduction and overview to using SVGs in a sprite, this post will outline the processes and tools ...
7th August 2014
Written For Liquid Light
This article will explain how and why you would want to use SVGs and what advantages using them in a sprite can bring. It will also cover scaling the images ...
10th June 2014
With the weekly golden nectar of Sass News winging its way into my inbox every week, I decided to take on the challenge of giving the newsletter a facelift
6th June 2014
Recently I wanted to tidy up my public_html directory - as the folders were getting too much and I like a clean directory.
22nd May 2014
With gulp starting to find itself into my everyday workflow - I've started to understand its quirks and twists, and how to get along with it. This is an advancement on my original gulpfile from a few months ago
13th May 2014
Far too often recently I've noticed people committing libraries and packages to their main application (website) repository.
8th May 2014
I have recently discovered the power of Bower - a front end package manager. Rather than having to go and find the hosted jquery link, or download the files for fancybox and copy them into my application (website), I can download them off bower.
24th March 2014
Writing and updating CSS can be a repetitive, tedious and arduous task - especially for big projects. CSS preprocessors can help with that - amalgamating related styles and helping you make your style sheets more DRY
17th March 2014
This post introduces how to compile SCSS with Gulp along with some core concepts
23rd February 2014
We've been going through a bit of a reshuffle at work with regards to our front-end conventions and layout.
4th February 2014
Recently we've decided a change in preprocessor to help optimise our workflow. Within this blog post, I am going to type Sass, but really I mean Scss.
23rd October 2013
Creating a Less mixin to style input placeholders without using an autoprefixer
19th October 2013
A quick tip on how to enable git autocompletion on the command line
19th October 2013
We have been using LESS for a while now, but our process involved including the less.js in the header during development, compiling the LESS using an app before launch and then maintaining the site using the css.
18th May 2013
As I mentioned in my first post I have made an archive of my previous Wordpress blog posts into a static page. This is done through some SQL and ...
13th May 2013
This week I announced that I was closing the curtain on my mini-conference Points Brighton. Points has been my baby, my creation. I feel, now it has found its end.
3rd January 2013
Written For 12 Devs of Christmas
There are plenty of articles on the web about how to become a web designer, how to build sites and how to sell them. What this article opens up, is ...
11th November 2012
I've recently been getting into pre-processors for CSS and I have been using LESS for sometime - getting to grips with the nesting and variables while keeping a library of my own mixins.
30th June 2012
An app for working out ratios
23rd June 2012
Many a times I have dealt with various companies and agencies about pointing different domains at our servers - what shocked me is the basic level of understanding, most of the time, is 0. I thought I would dump my brain about domains and whatnot, because then even if everyone has a basic understanding, life will be good.
18th May 2012
Before you continue - make sure you understand the story. The next thing is that php lines always need to end with a semi-colon (;). This tells php that the line ...
10th May 2012
When developing static sites (i.e. sites without any sort of CMS - be it Wordpress, Drupal etc.) the PHP I find the most valuable is the include.
9th May 2012
Last night was the second of my mini-conferences, Points Brighton. It featured speakers and keynotes of all different varieties, and the infamous Points Bazaar (the raffle) was, once more, a hit
6th May 2012
Recently, a few friends of mine have been asking questions about PHP and want to learn the basics. I am a front-end developer for a web design agency. i.e. I mainly stick to HTML/CSS and have colleagues who do the heavy PHP stuff
5th May 2012
29th February 2012
Points. A simple, barely-a-conference conference. For ease of reading, this post will follow a traditional approach with a modern twist: Who, What, How Much, Where, When, Speakers, Sponsors Why.
16th February 2012
Recently I've been going through a fad of buying web related books. I love the feel of books, I love reading books.
7th February 2012
After reading the aforementioned HTML5 & CSS3 for the Real World book, I have come to realise that there are loads of changes included with HTML5.
24th January 2012
Recently with the spate of CSS3 and media queries, there has been a few debates over how development should be done.
10th March 2011
If you would like to limit the amount of items coming out of an array (for example the first 5 news items)
21st February 2011
If you would like to 'redirect' all your users to a central domain (for example if you would like all users to browse your site with the www or you have several parked domains)
16th February 2011
This PHP statement applies class="even" to every other element when in a loop.
14th February 2011
If you want to apply a different class to the last item in a list generated by PHP, start off with Setting the $lastOne variable to the end of your list
4th February 2011
The following code will get the dimensions of an image: <?php list($width, $height, $type, $attr) = getimagesize(PATH_TO_IMAGE); I found this useful when using a lightbox to ...
17th November 2010
Creating a HTML email is like going back to the nineties with web design – you have to go against all your natural instincts as a web designer.
5th October 2010
Recently I was tasked to transform a full website into a stripped down mobile version for those visiting on their i-whatsits.
2nd June 2010
So you've got a brand new website that you want to promote? Recently I finished a website for Frag Records. Once completed they asked me for some hints and tips ...
22nd April 2010
Just a short note on my Twitter series of posts! I thought i'd let you know about this tweeting kettle...or Twettle (seeing as it is on the title..). I ...
21st April 2010
Twitter, Twitter Twitter. How you have taken over the world? (And my life?) I have recently properly got into Twitter. Before it was just a laborious update to show I ...
25th January 2009
CSS, or Cascading Style Sheets are the easiest, cleanest and most accessible way of styling a website. Tables were previously used to position objects on the page and CSS used just to make the text look pretty. Now CSS is being relied more and more to position images, text, add spacing to websites and bring the whole site together.