stormcloud266/shuttered-photography

A simple, clean photography portfolio concept site with a dark UI. Features a blog connected to Netlify's CMS, lazy loaded images, and a contact form.

Shuttered Photography

A simple, clean photography portfolio concept site with a dark UI. Features a blog connected to Netlify's CMS, lazy loaded images, and a contact form.

View Website

Challenges and Goals

I created this project with two main challenges in mind:

• Connect a Gatsby site to a content management system and generate blog posts from that CMS
• Practice making responsive layouts using CSS Grid

In addition to these main challenges, I also wanted to practice styling a dark theme website and implement Gatsby Image for lazy loading images.

Solution

I decided to use Netlify's open source CMS to organize my data. It integrates well with Github and Netlify hosting. Netlify CMS generates markdown files that are saved in my projects repo, and Gatsby takes these files, runs them through a template, and produces a website page for each file.

The services and blog page images are lazy loaded using Gatsby Image, and the blog posts page and portfolio are styled using CSS Grid.

Project Details

• Front end: Gatsby
• Content management: Netlify CMS
• Hosting: Netlify

shuttered-photography's Issues

Blog article Direct access

Hi,
When accessing a blog article in direct, there are some display issue like if you miss some ressources loading:

E.g:

https://shuttered-photography.netlify.app/blog/grilled-cheese