These projects showcase my passion for creating beautiful and functional digital experiences. I specialise in building responsive, user-friendly sites using modern web technologies such as Next.js, React, Astro and Tailwind. I'm constantly expanding my skillset to deliver custom solutions.
-
Pluto Power
- Won the Tech Zero x Kraken Hackathon 2024 with a project that encourages neighbours to share and expand solar capacity, resulting in a £20,000 prize and mentorship from Octopus Energy.
- Currently building an open-source product in Next.js, integrating an open-source map, authentication with NextAuth and AWS Cognito and the Google Solar API.
-
Take Back Water
- Employed as a contractor within a team of developers.
- Worked on accessibility and performance, reaching a score of 100 across all categories on Lighthouse.
- Developed and tested new React components with Storybook and SASS.
- Upgraded the SEO of the site with meta tags.
- Improved my Git workflow and team-working skills.
-
London Brutalist Map
- Improved developer and user experience by rebuilding my previous HTML project in React.
- Deployed a multi-page site with React Router for navigation and offers various ways to engage with the data, including custom markers for enhanced interactivity.
- Used a mixture of Tailwind CSS and SASS, to create a consistent and accessible design.
- Responded to user feedback by adding a custom marker to handle hover events.
-
Fare Free London
- Freelance project for a public transport campaign.
- Used Next.js and Headless Wordpress to build a fast, secure and easy to update site.
- Debugged an issue with the security of the signup form, moving requests to the server-side through an API route to Airtable.
- Improved Lighthouse performance score from 67 to 96 by using Next/Image for image optimisation and dynamic imports for lazy loading.
- Responded to public user feedback in Github Issues.
-
Right to the City
- Freelance project for a festival in London.
- Implemented a custom Tailwind utility for variable font settings.
- Built a sign up form using Material Design principles, linked it to an Airtable spreadsheet. This involved debugging the JSON data using Postman.
- Added a back to top button to improve navigation on the site.
-
Vital Signs
- Freelance project for a group of NHS workers.
- Used dummy content for testing, addressing issues like image errors and font loading by referring to the Next.js docs.
- Used Advanced Custom Fields to create a PDF uploader in the Wordpress editor.
- Created a guide for the client to help them edit site content easily.
- Used Wordpress webhooks connected to Vercel Deploy Hooks to trigger a site rebuild when posts are created, updated or deleted.
-
Daily Challenges
- Learnt to use local storage to store visited sites for a day at a time.
- Responded to user feedback by changing the colour scheme and adding CSS animations for visual interest.
- Added an introduction screen to improve usability.
- Used Google Lighthouse to improve the speed and accessibility of the site, achieving a score of 100 across all categories to improve user experience.
-
Typespotting
- Used a mind map of existing typography games to come up with the idea for the project (Where's Wally but for Cooper Black).
- Created SVG graphics using Adobe Illustrator and optimised images with an Image Optimiser app, ensuring the game was responsive and fast.
- Planned complex JavaScript functions with pseudocode to manage game logic.
-
London Frontend Jobs
- Explored React and Tailwind for rapid prototyping.
- Used an NPM package to add confetti when all of the sites have been opened.
- Added animations with Framer Motion.
-
Deployment Dashboard
- A learning project for a new Python framework, FastHTML.
- Used Tailwind via CDN to build a working prototype.
- Made extensive use of the FastHTML Docs and Discord to understand features such as a built-in SQLite database.
-
Knowledge Wiki
- Used Astro and Starlight to build a fast and sustainable documentation site.
- Applied Python scripts to edit existing Markdown files and extract collections of .webloc files to new Markdown files.
- Prioritised an accesible format for my knowledge, which I have already shared with peers and those seeking to learn more about new technologies.