COVID-19 guide for Aid Workers built with GatsbyJS from a Google Drive folder

Last year in October I joined Distribute Aid as a volunteer. I craft software for them which helps with their mission: build tools that help refugee aid groups discover and connect with each other, collaborate on aid shipments, share knowledge, and engage volunteers.

End of March we launched a landing page for a collection of information about COVID-19 and how to safely organize community aid during the outbreak which has been reviewed by front-line medical and refugee aid workers and which was provided for readers in this Google Drive folder.

Google Drive is amazing for collaborating on these resources but is a heavy web application which includes a lot of features for editing content, which is not needed when reading the content.

In April I started experimenting towards a solution that would keep the great editing capabilities of Google Drive (which are essential for incorporating feedback from dozens of contributors) but on the same hand improve the usability for readers.

After implementing an exporter, which uses pandoc to convert the HTML files which can be exported using the Google Drive API to Markdown, I fed them into GitBook, a great service which turns a collection of Markdown files into a nice website. GitBook is ideal for content heavy, documentation style projects. However for use the options to customize the design of the generated website was too limited.

I then turned to GatsbyJS, a great static site generator which allows to customize every aspect of the generated website and helped me to build a nicely designed guide that follows Distribute Aid's corporate identity, including a great mobile experience.

Because of the richt ecosystem of Gatsby adding full text search with Algolia was done very quick and could be integrated exactly where it makes sense for a guide.

Please check out and share the guide:

The source code for the project can be located on GitHub.