Craig Shields profile picture Craig Shields

Projects

Welcome to my portfolio. In my spare time I like working on side projects and learning about different technologies. Here are a few I've worked on recently.

2024

Personalised Awards

A starter website for a company providing sustainable trophies and awards

Built with NextJS, this basic starter website provides a landing page with an image gallery, testimonials and product features.

It also provides a contact page using EmailJs along with a full product page. Currently there is no online payment functionality. This is a phase two.

TypeScriptTailwind CSSHTMLCSSNext.jsVercelEmailJs
Personalised Awards showcase
2023

Awesome Comics Podcast Recommendations

Comic recommendations from the hosts and guests of the Awesome Comics Podcast

As an ardent lover of comics, I wanted to contribute to the vibrant ACP community. That's why I decided to establish this website, where I can share my enthusiasm for the Awesome Comics Podcast. I always forget about the great books the team recommend and thought this would serve as a great reminder.

The project is simple, utilizing Next JS image optimisation and Supabase as a database.

I started my Typescript learning journey with this project and learned a lot of other things on the way to deployment.

TypeScriptTailwind CSSHTMLCSSNext.jsSupabaseVercel
Awesome Comics Podcast Recommendations showcase
2023

Beyblades API

A Beyblade API, providing access to information about various Beyblades, their product information, parts and other related data.

Built using Next.js, this project came from my want to build and host an API. At the time my son was obsessed with Beyblades so I decided to use it as my inspiration.

I learned the fundamentals of Next.js API creation from this project along with how to host APIs with RapidAPI. I have a number of enhancements I want to make, including enhanced error handling, reduced complexity from the database seed script. Along with moving the API docs to Redoc

TypeScriptPlanetScalePrismaHTMLCSSTailwind CSSNext.jsVercelRapidAPI
Beyblades API showcase
2023

Curbishleys Roses

Family owned and run for over 90 years in the heart of cheshire, stocking a great range of plants at pocket friendly prices.

This quick and simple project came from a friend who had issues with his current hosting provider. All that was needed was a simple 1 page site with contact information.

There has been issues with transferring the domain from the current provider so this site is currently hosted with Github pages and redirects from the main domain. We'll be transferring the domain out as soon as the issues have been resolved.

TypeScriptTailwind CSSHTMLCSSNext.jsGitHub
Curbishleys Roses showcase
2023

Calculate Schedule Pricing API

An API to calculate total price based on unit price and the number of issues published between 2 dates.

This API is primarily aimed at publishers to demonstrate how to calculate a user's subscription cost based on a unit price and the number of issues published between 2 dates (Subscription Start and Subscription Expiry).

The backend API, built using Next.js, uses Zod for Schema declaration and efficient validation of the REST API request. As this was made as an example, it has no authentication, but does use Upstash for rate limiting.

TypeScriptHTMLCSSNext.jsVercelRedocZodUpstash
Calculate Schedule Pricing API showcase
2023

Typescript NPM Starter Template

Create TypeScript npm packages using this example. Boilerplate code includes CI/CD and changelogs

This project was born from me wanting to create an NPM package. The package I'm creating provides a number of functions for calculating blood glucose and insulin values. My son was recently diagnosed with Type 1 diabetes and thought that this might help others.

As you can imagine, testing for such functions is extremely important so that package isn't quite ready yet, but I took what I had learned from various sources and created a template for anyone wanting to create a Typescript function library for NPM

The template includes TSUP for the build, Changesets for changelogging and Github Actions for CI/CD. For automated testing, I choose to use vitest

TypeScriptGitHubVitestChangesets
Typescript NPM Starter Template showcase
2021

Caira House Barbados

A Wordpress website for a Barbados property rental.

A Wordpress project mainly consisting of configuration and implementation rather than fullstack development.

A number of customisations to the Wordpress theme were made based on the client's request, resulting in changes to the Javascript, PHP, HTML and CSS.

As the data rarely changes on this site, I plan to move the Wordpress site to either Next.js or Gatesby to benefit from the speed that these static site generators can bring.

JavaScriptWordPressHTMLCSSPHP
Caira House Barbados showcase
2021

Level Up Fitness Barbados

A Wordpress website for a Barbados Health and Fitness business.

A Wordpress project mainly consisting of configuration and implementation rather than fullstack development.

Integration into GymMaster membership platform was required for class bookings and payment.

JavaScriptWordPressHTMLCSSPHP
Level Up Fitness Barbados showcase