Tony Spiro
October 19, 2016
Our mission at Cosmic is to help teams build great websites and apps, and we love it when developers show us the awesome work they've done using the platform. In this spirit, we're introducing a new Spotlight series where we'll focus on a particular team or developer that is building something cool using Cosmic.
In this Spotlight we are focusing on Jon Bloomer, who recently launched the Cosmic-powered website for his business Tone Temple. Jon took some time to answer a few questions about his business, his development process and some of his favorite non-dev rockstars. And we totally glossed over the irony that his new website that showcases headless guitars is built using a headless CMS.
Cosmic: Can you talk a little about ToneTemple the business?
Jon: Tone Temple is an Australian guitar store with a small selection of boutique brands that we truly believe in. We only stock unique and high end products such as Strandberg Guitars and Evil Angel custom pickups and we will be expanding our range of brands over the coming months. Our business is based on great customer service and a thorough knowledge and understanding of our products.
You have a beautiful brand new website which you mentioned is built using React and Redux. Can you talk about your choice to use these technologies?
I have been using React and Redux to build web applications for the past 10 months for 2 different corporations and enjoy the ability to build components in ES6/7 and have a simple way to save and retrieve the state of the application from a centralised store. I also like how easy it is to test React components using Expect and Enzyme.
Can you talk about why you decided to use an API to host your content instead of an installed CMS?
I have built many CMS based websites for clients over the past 6 years using Wordpress as I am proficient with PHP however I couldn't manage to build the solutions my clients wanted without installing additional plugins for custom fields, SEO, caching etc. When I saw Cosmic I realised I could think in terms of exactly what data I wanted to save rather than having to work out which already complex template objects I had to extend with additional fields. Removing the page and assets based architecture that traditional CMS's are built on really lets you focus on how to organise content to make it manageable to content editors and deliver it efficiently for app consumption.
Can you talk a little about your development and content management process and how Cosmic fits in?
With Tone Temple the data architecture was pretty simple, I decided I only really needed 2 Objects, Globals and Brands. Globals contains elements such as the site logo, footer text, and then some data for the homepage such as the main content and the videos at the bottom of the page which uses the new Repeater field. Brands is setup with a set of metafields that allow me to upload 2 different size brand page header images (I may create a 3rd for mobile), optional header images for the homepage carousel which is coupled with a check box to set whether to display on homepage and finally the main content and another Repeater field for Videos. The Videos Repeater has just two fields, one for the video title and another for the YouTube ID. I then launch the YouTube player in an overlay on click using a custom React component that I built. Cosmic makes it very simple for me to add new brands with the ability to save as draft if the final content is not quite ready to show on the live site.
I fetch the global and brand objects asynchronously on load and populate the Redux store which happens very fast. The content is usually rendering in under a second and the large images for the homepage carousel render by the time you hit 1.5s. I use Cosmic's built in Imgix integration to easily create srcsets for images so that I can serve up smaller images depending on media queries which helps with the page load. The Imgix CDN ensures that the images are returned and rendered very quickly.
What app development technologies are you excited about using now or in the future?
I am excited about the possibility of using GraphQL & Relay in the near future and might be something I will start learning soon and update Tone Temple to use.
Who are some of your favorite guitarists? Are you a musician yourself?
I am indeed a musician, I studied at Birmingham Conservatoire in the UK and have BMus(hons) degree. I also ran GuitarNoize.com for 9 years until very recently where I have teamed up with an amazing business partner to launch Tone Temple. I have too many favourite guitar players to mention, I have very varied musical tastes from Blues to Metal. Joe Satriani has always been my absolute favourite guitar player but one of my current favourite guitarists and composers is David Maxim Micic.
Check out the Tone Temple website, you can follow Jon on Twitter and check out more of his development work on his GitHub page.
