Andrew Larcombe

Publishing Geospatial Data to the Serverless Web with GatsbyJS

This is an article version of a presentation I gave at geomob London, January 2019 - you can see the slide deck at the bottom of the page.

Want to publish spatial data to the web? Up until now the most common approaches have been:

  • Expose some parts of your Spatial Data Infrastructure (eg ESRI, GeoServer etc) onto the web. In the past this has meant clunky user experiences, and difficulty maintaining consistent branding etc.
  • Import your spatial data into a CMS. This adds complexity, both in terms of number of components, but also keeping data synchronised.

But now there's something new(-ish) on the block. Serverless.

Serverless websites (like this one) do have a server somewhere, but it's function is abstracted away and managed as a service by another organisation (Amazon, Microsoft, Github, whoever). You don't need to configure, manage or maintain a webserver or infrastructure, and serverless sites scale effortlessly giving you the ability to serve high-traffic volumes. To update your site just copy your sites' files into your serverless architecture.

But how to create the site's files? You'll need a static site generator. There are a great number of these, but my favourite is GatsbyJS. GatsbyJS is a site generator built on NodeJS enabling you to publish React components straight to the web as a Progressive Web App. You just provide it a source (remember this) and some template files and it creates a bunch of files that makes up your website. The top level architecture is super simple:



Back to the source (remember that?). Common sources for static site generators include headless CMS or a collection of markdown files. To publish spatial data I recently published a plugin which lets you provide any standard spatial data source (eg GeoJSON files, Shapefiles, KML) to enable you to build serverless websites.

I'm going to provide a tutorial in the near future, but for now you can find the plugin with documentation at https://www.gatsbyjs.org/packages/gatsby-source-geo - what this does is enable you to build a complete website from a single spatial data source - combined with serverless architectural patterns this could be a new, and much simpler way, to publish spatial data out to the web.

Map Image © OpenStreetMap & contributors