Gatsby Material Album
- Material UI styling
- Exif data parsing
I've been a big fan of the way Gatsby creates blog post pages dynamically via Markdown files.
So I figured why not apply the same logic to images in a gallery?
This starter uses the Gatsby Node APIs to accomplish two things.
It creates a new page from each image file,
and creates custom node fields so their exif data can be accessed via GraphQl.
Either clone the repo with
git clone https://github.com/JoeTrubenstein/gatsby-starter-material-album.git
Or use the Gatsby CLI
gatsby new material-album https://github.com/JoeTrubenstein/gatsby-starter-material-album.git
then simply run
to install dependencies
Adding your own images
This project reads a given image's exif data using fast-exif.
However, you'll need to edit your own image's exif data first.
The best way of accomplishing this appears to be ExifTool.
Once installed, you can quickly edit your exif data via the CLI as such:
exiftool -ImageDescription="by Mike Gorrell" -DocumentName="Lost In Thought" -Copyright="https://unsplash.com/@mikegorrell" src/images/mike-gorrell-61cMb0WQAMA-unsplash.jpg