The Calgary Redbirds Overhaul
Learning from my mistakes
GatsbyJS, SASS, Contentful, and Netlify
The objective
After the creation of the original site, the Calgary Redbirds grew exponentially. Thus they needed a website overhaul. The new website needed to handle an increased volume of visitors and showcase more information in a clean, efficient way.
The solution
I completely restructure the code base of the website switching from pure HTML5 to GatsbyJS frontend and a Contentful CMS backend. This change would greatly increase the speed of the site and allow the company to change the site's content without any external help.
View Project
https://www.calgaryredbirds.comStart Date
July 12th, 2021
Redesign
One of the biggest changes I made in my development process was spending time to thoroughly plan out the site's structure. To do this I used Adobe XD which allowed me to quickly iterate through different designs and showcase them to the Redbirds executives. Over the course of a few weeks, I was able to narrow down the design of the website to a simple yet compact structure that was loved by the company.
Implementation
Once there was a sound structure to the new site I got to work on implementing it. The move to React/Gatsby went very smoothly as I had already acquired experience in JavaScript from some projects I had created in school thus it was just a matter of getting used to the framework and the idea of components.
My Strategy
Since I new the CEO of the Redbirds very well I was able to adopt agile methodology in the implementation process which consisted of three things.
Implementation
I would take a design and create it in a development environment
Discussions
I would then showcase the work to the CEO for feedback
Refactor
I would then take the feedback and create a better product
Dynamically created announcements
CMS Backed Content
Fully Responsive
Redbirds Menu Progression
Maintainence
Once the website was released I began maintenance work on the site. Continuously improving the site, by cleaning up animations and improving the site's performance. Furthermore, I also began adding new features and pages. One of the most notable additions was the storefront page.
