Portfolio

Southampton Focus

Southampton Focus

Southampton Focus is the online place to go for finding businesses in and around the area. Businesses pay for a listing on the site and get free access to Southampton Focus’ vast social network presence. Southampton Focus already had a site but decided to scrap it and start completely afresh. They chose a theme from …

Train In Blocks

Train In Blocks

I created a Vue Web App which connects to a PHP backend API communicating with a MySQL database to create and update records. I created a Stripe WebHook to listen to customer creation events and create a user in Authentication Management platform Okta and then send the new customer an email with SendGrid. I also taught the founder front-end skills to enable me to focus on the backend.

Joe Bailey Photography

Joe Bailey Photography

In order to use many of the new Web Technologies you first need a platform to test them on. This is my photography website. I am very passionate about photography and like to keep my website as close to the cutting edge as possible.

Disabled Peoples Voice

Disabled Peoples Voice

A local charity approached me to develop their website from a template that an external graphic designer has created. I worked closely with the designer over a 3 month period making sure that the site was pixel perfect before pushing it live.

Island RIBs

Island RIBs

I gave this local company’s website a design refresh. I worked closely with the client on a development site to help them reach their vision within their budget. I then went through the process of cross-browser testing before pushing the website live.

Therfield Village Pre-School

Therfield Village Pre-School

A local Pre-School needed someone to manage their website, updating content, ensuring consitency, and implementing new features. I have since helped their brand become more consistent and created a blog which I help keep up to date.

Projects

GitHub Contributions

Joe's Github chart
View my profile on GitHub.

Adobe XD Challenge Calculator

The third challenge was to create a calculator. I wanted to practise my CSS art and so chose an image of an old Casio calculator and tried to recreate it as closely as possible. It was quite a challenge creating the code for the calculator to function. It wasn’t as simple as just adding numbers …

Adobe XD Challenge Fitness App

The second challenge was to create a fitness app. I chose to make an activity tracker. I took inspiration from Lifelog, an app by Sony that I used for many years. I used the Google Maps API and created a component in Vue for the activities.

Adobe XD Challenge – Music Player

Me and Eleanor Morgan participated in the Adobe XD Challenge. I wanted to use Vue.js rather than practise my skills in XD as I view myself as more of a developer than a designer. The first challenge was to create a music player. I played around with the audio API and used some CSS animations.

TV Shows App

I like to keep track of the TV Shows I watch. I used to do this in a Word Document and manually go to IMDb and check whether the show was running or had been cancelled and then add the TV Show to my calendar. I decided to build an app that would do this for me. This was a good introduction to Svelte and Lambda functions.

Points Of Interest

Following on from developing the HitTastic! site we had to create a site in PHP that allows users to view POI’s stored in a database, and contribute to this database. We had to do some basic styles to go along with it.

HitTastic!

In my second year of university, I did a PHP unit where we were tasked with creating a site showing the number one songs from a certain year. We had to make a login, connect to a database, and perform a search.

Data Flow Diagrams

When we first started doing Data Flow Diagrams at the start of the semester I thought they were the worst thing in the world. However, as I came to understand them more and start to think about more real-world business problems that I was encountering such as creating a website for my Dad or as …

Firebase

During our Web Technologies practical lessons, we have to follow a set of instructions to create a website or simple script. The lecturer has hosted the notes for the unit on Firebase. I’d looked into Firebase before but couldn’t understand how to use it. However, when an extended task came up in lesson I gave …

Angular, React, Vue, Node

Whilst working on various projects this semester I’ve encountered the following technologies: Angular, React, Vue, and Node. I’ve experimented with them to some extent and found Node Package Manager quite useful. Initially, when I first heard about them I thought they were JavaScript Libraries like JQuery, however, they are far from it. Each technology is …

Get in touch