What we learnt from our website rebuild

Since we started Codeworkshop.io we have been mulling over the idea of bringing our website inhouse. A few reasons and benefits for this included having additional control as well as Source Control on our site. We started this adventure using Wordpress.

We have had two web development companies hands in the mix of our site's theme, content, seo, adwords etc... All in all, it had been a bit of a nightmare and headache for us. Wordpress did not give us the flexibility we needed nor the source control as we would have liked.

A while back I went looking around for tools to build static websites and fell upon Jekyll. Jekyll excited me, it was great. I could host my site on AWS, no issues, no reasons to worry about someone accessing my site via Brute Force on the /admin page. Now, I am sure you are waiting for a BUT as this article is not about Jekyll. We are primarily a NodeJs and React development house, we simply do not do Ruby in house so this caused a bit of an issue due to the learning curve.

A while after discovering Jekyll, we had the need for a headless CMS. Amongst the many tools available to choose from, we stumbled upon GatsbyJS. Now, I had heard of GatsbyJs before (in the React documentation), but I had just swept it aside assuming it was something similar to Create React App.

About 2 weeks later, I needed to redesign a demo site for a client. With my UI hammer being React, I started looking deeper at what Gatsby was all about. The more I read, the more I loved it! Everything about working with Gatsby made my life easier! A familiar toolset and paradigm, static compilation that would make my site blazing fast out the box! Not to mention a plugin for literally EVERYTHING!

A colleague of mine and I joked as we ported the site, "Google Analytics?" "There is a plugin for that!"

Back to the site...

Our site is fairly straight forward, a few repeating components here and there with some minor changes like: smaller images on some pages, removal of text, not all that complex.

It took us about a week and a half to completely transform our original site, with a very basic knowledge of Gatsby and some knowldge of GraphQL.

Hosting was simple. We use BitBucket for Git storage and AWS for cloud. I hopped onto AWS, went into Amplify, hooked it up to my Bitbucket repo and our site was built.

AWS Amplify also assists with domain management, segregation of environment, Password protected environments (so that prereleases are not available to the rest of the world)

All in all, Gatsby has changed the way I will build UIs in the future.