Portfolio

Act as the opperating system for the entire Fleet Assist business, taking in areas as disperate as running a call centre, managing the data on thousands of garages, organising finance activities and performing analytics on over £2bn in vehicle repair data.

Atlas was the main project I worked on during my 10 years at Fleet Assist. I designed and built the entire system from a greenfield project right through to it running all areas of the company's operations.

As a predominantly private system I am unfortunately only able to share publicly available screenshots from the system in this portfolio.

Starting development in 2012 the system was built using C# .NET. I always ensured the system was updated to reflect the state of the art within the .NET ecosystem and as .NET Core was developed we migrated onto that as it was released in 2016 and then subsequently onto .NET 5 in 2020.

Built on a Microsoft stack we followed a domain focused CQRS architecture using technologies such as Entity Framework, LESS, TypeScript, ADO.NET, SQL Server, Razor and Autofac. We further intergrated with a wide range of well known external services such as MapBox, Mailgun, TextLocal, Avaya PABX and internal customer systems.

The application was very data and process centric. To manage the company's processes I built a custom task system that could be configured in real time using a diagram of the process. Then to manage the large amounts of data we built a database of garages and vehicle data which won multiple industry accolades.

Working as a solo developer for the first few years I became a true full stack developer able to work on any area of the system and continued to develop the system right until the end of my time at Fleet Assist.

Provide a landing page for the business that describes what it does and links into its other web applications.

The site was originally built using ASP.NET MVC Core, however we decided to move all the static pages to Hugo and place them on an external CDN to improve first paint speed.

Join Network remained on .NET because that page triggered various actions within the company's broader systems which were .NET based.

The design was based on a design language adopted by the business in 2017. Therefore the overall design was done by me and the lead I led, while some of the icons and colour scheme were from an external design house.

It also provides a very basic example of geographic map work using MapBox on the contact page. This is an area I have extensive experience in, but have no public examples of the more complex work.

This website is no longer maintained by me, therefore if you visit the live site there may be changes from the pictures above.

Provide a database of the trading card games I collect that allows the user to search different games, then see what cards I need and what I have available to trade.

The site was built using Hugo and uses Google Sheets as a backend. This is done by publishing the sheets as CSVs and then pulling them down in JavaScript to render them on the page in HTML. It makes extensive use of the tabulator and papaparse libraries to do this.

This architecture allowed me to keep using Google Sheets to track my collections and use a static site hosting option to reduce costs but still provide an interactive backend.

I often link to pages on the site when talking on Facebook and wanted the site to have full Open Graph support. However Open Graph requires a raster image of the page to show when rendering the preview, the large number of games made creating this image manually very time consuming.

To address this I created a part of the build step that generates these images from a HTML page when a new game is added. It does this by running an NPM task using the headless chrome puppeteer tool to render the page and extracting the images from that page.

Describe what FleetNet is as well as allow new members to join and find out about their events.

The site was built using ASP.NET Razor Pages, this was partly because I wanted to try the technology and because FleetNet currently uses ASP.NET for other elements of its activities.

It is not currently live because one of FleetNet's primary activities was running an in person conference which has been on hold since the COVID-19 pandemic. However it should be launched sometime in the future when those conferences start up again.

While not technically complex this project required a large amount of conversion work from old data sources to populate it with content. This was held by a range of people and in a number of formats, I needed to collate all these and convert it for use on the new website.

The development version of the site is hosted on Azure, with the option of moving that to an internal IIS server if the customer requires it.

Describe who I am and act as my CV.

The site was built using Hugo and makes extensive use of SVG images.

The layout uses a wide range of complex and modern CSS techniques including flexbox, grid and animations. This can be best seen on this page in the image carousel built using TypeScript and CSS.

Furthermore the site is fully responsive allowing the user to view it on desktop or mobile. As well as providing print stylings designed to create an A4 CV when printed.

Graphically the site uses a large number of SVGs that are used to provide colour to the pages. These were all hand edited and optimised for web use.

It is deployed using a basic DevOps pipeline based on Github actions. On commit this builds all assets using Hugo and publishes it as a GitHub page.