fit 'n' focused project

This is a site that I had previously built for a Geelong-based gym. In my development environment, I created a WordPress backend with custom post types so that the client can add, remove and update classes, challenges and trainers as was requested. They also had a gym membership app that needed to be integrated to the site. Their app's plan didn't include API access, but just a couple iframes.

The WordPress instance was on some cheap hosting, while the Gatsby frontend is still on Netlify. I had it using webhooks to rebuild the site every time the content was updated in WordPress.

Do note that the site URL sends you to a Netlify domain name because the business is no longer in operation.

gatsby portfolio project

I made this portfolio using GatsbyJS, and Contentful as my CMS. It's hosted on Netlify, with a webhook from the CMS solution for continuous deployment.

chocolate men project

This site is static pages built using Next.js. When the site is being built, it fetches upcoming events from the Facebook Graph API.

When someone accesses the site after an hour since the previous build, the site rebuilds, so it can fetch the updated events. To get the events from a Facebook page was a bit messy. It required starting with a user access token for a user that has admin permissions to a Facebook page. The user access token is sufficient for the task. However, The user access token can be used to get the page access token, which from memory is a better token. From memory, I think it never expires, but don't take my word for it. Therefore, I used the user access token to get a page access token, then I use the page access token to get the events. I don't refresh the tokens anywhere nearly as frequently as I fetch the events. I now understand that the tokens should be stored in a secret store, and not a database. However, I didn't know at the time.

Contentful is the CMS solution for handling the data of the performers. Instead of rebuilding every time there is an update, I put a button on the business owner's phone for him to press when he's finished making his updates. It sends a webhook to trigger a rebuild.

raw muscle 2021 project

This is a traditional WordPress theme build using PHP. I created custom post types without plugins for the owner to efficiently add, update and remove events and performers. I also made the banner image on the home page customizable through changing the home page's featured image, as per the site owner's request.

To combat WordPress's reputation for a slow page speed, I used Webpack with babel loader to bundle the JS and CSS, and to help host the google fonts and fontawesome icons locally.

I had initially planned to further improve on this by handling image optimization, and removing unnecessary features that WordPress automatically adds in the header, like the emoji script and jquery. I've since abandoned this due to preferring to develop in React, and my preference for Contentful as a CMS solution that does everything I want, is quicker to develop with and doesn't require paid hosting for my use cases.

NOTE: The "navigate to site" button navigates to a Gatsby.JS mockup of the site because I've since developed the Next.JS and Contentful site mentioned above for the same client.

raw muscle 2023 project

This site is static pages built using Next.js. When the site is being built, it fetches upcoming events from EventBrite's API.

There's a webhook from EventBrite for the site to rebuild when an event is published, unpublished, or updated. I'm banking on updated including when the event's status changes. Otherwise, I may have to look at using a cron job to ensure that the events are autonomously somewhat up-to-date.