Tive
Indigo Sky
2 min read
·
Helping customers and improving my design skills
I had a client with a local wedding photography and videography business that had their website hosted and built on WordPress. I have worked with WordPress in the past and knew about the headaches that come when trying to update and maintain the website.
Complicated designs
The original website had a beautiful grid of images to preview the photography. This took some thought about how to organize the gallery on the backend and figure out how to resize the View Our Portfolio overlay
The original website also had a masonry layout for the photo gallery. Currently, only the Firefox browser supports this grid layout in CSS. It took some time to figure out how to get the layout to work because the layout would have to be done in JavaScript. The solution was not trivial at all.
In between fully custom and no code with WordPress
I wanted to figure out a way where the website could be written with code and have the data maintained and updated by the client. This endeavor brought me into the world of headless CMSs. The headless part just means the content management system just had the content and no website builder. I ended up choosing Sanity, because of its great reviews, fantastic API, image processing, and generous free tier.
Sanity automatically processes your uploaded images and creates low-quality images that I could use with Next.js's Image component to show a low-quality placeholder while the larger image loads.
Sanity comes with its own query language GROQ. I have never heard of the language before since I've only used the popular GraphQL language from Facebook. Sanity does support GraphQL, but they highly recommend GROQ for their system. After following the documentation and using GROQ for a few pages, I started to enjoy the language and its powerful features.
I am very happy with the solution to use a custom front end and a CMS for storing my static content. Sanity takes care of a lot of the heavy lifting of managing content, processing images, and creating a nice user interface for customers to use. I liked it so much that this portfolio website uses Sanity to store all the content. Event this article.
