When generating a sitemap for a Nuxt site files in the content module are not automatically included. Let’s find out how we can solve that!

Whilst launching my new site (https://jackwhiting.co.uk) - I chose to use Nuxt Content for managing my blog posts, works, and any other content. Whilst generating the sitemap I noticed that any content created from @nuxt/content was not being added to my sitemap and needed a fix for that. In this article, we are going to look at how to solve this and get all of your entries listed.

Setup

Before we can do anything we need to make sure we have the @nuxtjs/sitemap module installed. Open up your project in the terminal and run the following.

In your…


Working with large data files can be tough and cause a bottleneck within your application. We can’t just simply load the file all at once and expect everything to work. We need to iterate over the data and parse it in chunks.

Pre-requisites

For this project, we will look to use Node, Hyperquest, and JSON Stream to fetch the file from a remote URL, parse it, and then handle the data retrieved.

This article assumes you know how to use the basics of node.

To get started, open up your working directory in your code editor and create a new file…


This article is the second part of a series of posts about Working with Svelte. The topics and articles we have (or will) cover are as follows:

  1. Setting up Svelte & Installing Tailwind CSS and PostCSS
  2. Setting up Routing with Page.js
  3. Refactoring and Optimising Our Router
  4. .. and more

In the last article, we briefly looked at spinning up Svelte. This article doesn’t require you to have done this but if you don’t have a Svelte installation I advise following the quick start guide on the Svelte website.

There are several ways we can look at routing in Svelte, the…


This article has affiliate links that if you Sign up to use Fathom Analytics I’ll make a small percentage, and you’ll receive 10$ credit to your first invoice.

I have been using Fathom Analytics since they launched version 2 in October 2019, I wasn’t sure I was going to carry on after my trial expired but I haven’t cancelled and have no plans to! In the following article, I want to talk a bit about why I use Fathom and provide a review so far.

Fathom Analytics is a completely privacy-focused solution to website analytics. It does not track personal…


I’ve been recently leaning into spinning up applications with Nuxt and Firebase. These are pretty straight forward applications that handle user authentication and creating/reading of data. However, I’ve recently come into a case where I needed to send out a request to a third party service and write that back to the database. You could do this within Firebase Functions, but it would require you to be signed up onto one of the paid plans — which I’m not quite ready for yet.

Enter Netlify Lambda Functions, on the free plan you’re given a generous amount of resources and it…


This article is part of a series of posts about Working with Svelte. The topics and articles we have (or will) cover are as follows:

  1. Setting up Svelte & Installing Tailwind CSS and PostCSS
  2. Setting up Routing with Page.js
  3. Optimising Our Router For Large Applications (Coming Soon)
  4. .. and more

Svelte is an awesome underdog in JavaScript frameworks and is climbing the ranks currently due to the way it compiles your scripts and HTML. Svelte is inherently a compiler and all of your components files get compiled into pure JavaScript. You can find out more about Svelte through their website.

Install Svelte


Yarn Logo https://yarnpkg.com

If you haven’t heard of Yarn before, it is a Package Manager for JavaScript (which replaces the existing workflow used with the NPM client). Yarn shares a similar workflow, but puts security, speed and reliability at the forefront.

Why Yarn Over NPM?

So, what makes Yarn better than just carrying on using NPM?

Speed, Yarn caches packages so it doesn’t need to downloaded it again and again. It also runs the process parallel so the runtime is a lot shorter. Bonus, you can install packages once they’ve been cached without an internet connection.

Security, Yarn uses checksums to ensure the integrity of all packages.


I constantly toy with which IDE/Text Editor I want to use in my workflow. I’ve tried six or seven in the last few months to find something that fits my personal work flow and always ended up reverting to Sublime Text 3.

I require my editor to be customisable, is extendable and has support for colour schemes (it’s the little things). When I stumbled on Visual Studio (VS) Code recently and found that it and ticked all of my boxes, I decided to dive in and test it out.

It has a relatively nice interface out of the box, shares…


Every now and then you want to set up a fresh WordPress install, usually when the site is going in a different direction and a lot of their data then becomes redundant. When working with a client I had to find a way to do this and keep hold of all their media. Before I was ready to import the media I created a blank WordPress site (v4.3), the reason I used a blank site was to make sure there were no conflicts with IDs of the media I was importing.

WordPress stores all media library uploads into the database…


Whilst working on a project for a letting company, I was asked to add a way to group properties by a defined location. The client wanted each location to be displayed on an overview page, utilising a map to show potential properties in the area.

As I was writing the site using WordPress, the system stored the data using a page (locations), sub page (single location), and custom post type (properties). I used this information to get the maps onto the front-end and automatically be updated whenever the client changed any of the data in the back-end.

The front-end of…

Jack Whiting

Freelance Web Developer living in Nottingham, UK. Lover of JavaScript & PHP. Sharing my stumbles and findings.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store