Tag: react

May

2026

Soff

(A simple app to help with anxiety)

Soff is a webapp I made for myself to help anxiety and rumination. Its easy to try and tackle anxious thouhgts with logical rtebuttals, but that usually not where the realm they exist in. Soff is an attempt to help users creat a tactile and emotional response to an event with a simple light touch reassurance. It does this by making each check a ritual that takes between half a second or one second and provides tactile, audio and visual feedback to help it stick in their memory. Checks can be configured to provide differnt feedbacks. Then the UI is desinged to be minimal and almost like an appliance, showing the minimal UI and trying to get out the way. This combination (i hope) will help to allow Soff to be a tool that breaks spirals and doesnt feed into them.

Soff provided an interesting design challenge because most webapps want their users to be engadged, active and addicted. Soff's desing language is supposed to only facilitate a function. That means that normal design decisions and function approaches has to be taken from a completley differnt angle from the best way to store the events down to something simple like how to display time. It was an effort to not reach for UX patterns of analytics, gamification and social engagement.

May

2026

The Crochet Shelf

(A quite curation of crochet patterns)

The Crocher Shelf is a project I made because I was tired of everything being social powered. When things are gamified and algorithmically curated, its easy for the wrong incentives to be in play. The crochet shelf is a curated collections of crochet patterns curated by me and designed to be a calm place where crocheters dont need to feel perfomative pressure. Users have a persistant account (powered by Clerk, Neon and Drizzle) and can save patterns to 'custom shelves' and view them later. The only public content they can post is the finished results (with a note) to help others see how the outcome may look.

Everything in The Crocher Shelf is moderated before it is made public and there is a whole backoffice to create custome collections for the site, accept (or reject) new patterns and moderate submitted reults.

The site was really fun to design and build without havting to think about how it would work to monetize, advertise or stoke engadgment. Stepping away from some of the accepted patterns of modern web design make you realise how driven everything is by user engagement and virality and social.

May

2026

Mood map

(An app to figure out how your really feeling)

I built Mood Map to help people identify how they’re feeling with more nuance than just “good” or “bad” which are rarely specific enough.

Feeling lonely, overwhelmed, guilty, numb, betrayed, anxious, or disconnected can all feel similar from a distance, but they often need very different kinds of tools and reflections. Mood Map is helps you untangle that a little and better identify what your feeling.

When you have reached the emotion that matches it shows you a breakdown of where that sits, what it means and some gentle suggestions or prompts to reflect on.

Apr

2026

ManyWise

(seek answers with a custom council)

For every question there are many answers. Some consider their relevant experience and expertice to help guide and hone. Some empathise with a delicate emotional state and help assure and fortify. Some are dumb. but what they have in common is they arent wrong.

Manywise is an app I made to help people find the answers to their questions from all differnt perspectives by selection a council of trusted agenets to weigh in. Select agents (or create your own) and watch a diverse range of perspectives and opinions respond, explore, ponder and discuss.

Althouhg a somewhat silly project on the surface, Manywise is an exploration on how to build an app that openly shows the temprement and biases between an answer. As humans it is a complex mix of nurture and nature, on Manywise its specific prompts and character steers. this leaves an app you know is wholly artificial, but ends up exploring just how easy it is to trust a generated answer and steer it with whatever biases you want.

Manywise uses Clerk, Neon and Drizzle to provide presistance across sessions. It uses Vercels AI SDK for the interaction with the LLM's and the whole thing is built with Next.js and Tailwind.

May

2025

This Library Doesnt Exist

(A collection of completley AI generated books)

This Library doesnt exist is a collection of books generated by AI. from a 45,000 word fantasy epic to a zaney childrens adventure, the library contains a wide range of genres and styles.

I have always found the idea of creating something that creates something to be interesting, and so AI felt like the next logical step. The idea was to create a framework where I had little to no control over the output, and see what would happen.

The site is split into two parts. A local app that generates the books, and a public site that displays them. The generation is almost entirely handled by AI. The only human input is the initial prompt, which is suggested by AI but can be edited. After that a reasoning model is used to determine the structure of the book, and then then image generation makes the cover and a regular LLM is used to write the chapters. (cursor was also used in the creation of this project)

I struggled with how to approach laying out the website. Each book has a large amount of interesting data, from writing styles to tones and even a 'north star' principle. In the end I stripped all of that away from the user experience and just focused on the content.

I also experimented with using a EPUB reader embeded into the website. This was an interesting challenge, but in the end I realised it didnt benefit the user experience and so it was removed. In its place I provide a link for the use to download the EPUB if they would like to use an e-reader.

Mar

2024

Criss Cross Apple Sauce

(A nonogram platform)

After seeing how much my partner would visit my previous codepen experiment with Nonograms on codepen, I thought it was time to upgrade. Using Next, vercel, postgres and Auth0 I created a platform for her to be able to create and rank new puzzles, with her fastest time being persisted to a database for each one.

I also played around with Next themes to create, not only a light and dark mode but also custom themes that can easily be added to.

Jan

2024

Personal website

(What you're looking at now)

As a professional front-end developer of almost 10 years, it's odd I've never had my own personal website. I'm usually too lost in a project and would rather be exploring something new. However, the increase in popularity of server-side rendering has given me a great excuse to finally have a reason to tackle my own site.

Next.js and React 18 make for an interesting deviation from my usual client-side forte. The technical differences are fairly apparent, but I think the headspace of thinking in terms of keeping things server-side is more nuanced and hard to get used to. This is especially true when all your usual React comforts are there within easy reach with nothing stopping you. When you hit a problem or a suggestion from Next's surprisingly helpful builder, it's easy to take the quick fix and implement the client-side solution. I think so far I've managed to avoid temptation, and this site should be completely static... famous last words.

Jan

2024

Good Morning AI

(The radio station run by robots)

Good Morning AI is a radio station where the scripts, voices, music, and schedule are completely controlled by AI. It's an idea I've wanted to create for years, but with the huge advancements in AI in the last few years, it finally felt like the right time to make it happen.

It became immediately obvious that working directly in the console to tweak prompts, iterate on outcomes, and stitch together different APIs was tedious at best. To try and make the build process smoother, I created a dashboard powered by Express, React, and Tailwind to quickly build the tools I needed to help me realize my vision.

This project came with a lot of technical hurdles despite the fact that the AI heavy lifting was done for me. I think the most interesting lesson for me was in adapting to a new paradigm of interacting with software. Both in terms of prompt engineering and also the API itself. For instance, being able to present the AI with a TS object and request for its response to fit that definition streamlined the process. Although this would be risky in a production client-facing application, when it came to making quick MVP tools, it allowed me to quickly and easily iterate. If a type needed to change, then the response from the API would automatically update to match it.

Nov

2023

NWTC Tribes

(An employee engagement suite for NWTC)

When the New World Trading Company pitched their idea to me as "A bit like the sorting hat from Harry Potter," I was in. Realizing that this meant connecting to an HR API, building an admin dashboard, and exporting everything daily to a third party made me a bit more hesitant!

The most important part of the project was helping to strip back the requirements to create a foundation that covered what the client really needed, leaving plenty of room for future additions. I chose Firebase as the backend, allowing me to quickly create and push features. For the front-end, I utilized a React, TypeScript, and Styled Components template I had created for exactly this purpose.

The hardest part of the project was working with live data that needed to be updated and manipulated daily. The key to tackling this was creating logs of performed operations and regular backups for the worst-case scenario. Writing about this project without using more Harry Potter puns was the real challenge.

Dec

2021

Shout 'Em Out

(A category guessing game with an AI twist)

"Shout 'Em Out" is a re-envisioning of one of my childhood favorite games. The premise is simple: each card contains a category. The opposing team simply needs to try and guess the top 10 answers to that category... the catch? You're not looking for the right answers, you're looking for the ones LLMs circa GPT-3 think are the right answers.

The game was created to explore LLMs and OpenAI's API. Although far from the models we see now, I was blown away by the demos I was seeing and wanted to experiment with it myself. I created a simple app to propose categories and parse the responses into lists of answers. This tool gave me easy access to regenerate or nudge responses, as well as to correct Americanized spelling or remove duplications.

Once I had my categories and answers, I created a React app to generate the cards using print CSS queries, easily printing off the final version. This was the day I learned that I hate styling print media :). The software allowed me to easily generate over 100 cards and iterate on the design and layout with minimal effort.

The final product was a fun game that I could play with friends and family, but also a great learning experience in the power of AI and the benefits of software in the physical world. It also taught me a valuable lesson in the capabilities and dangers of AI, most importantly the subtle (and sometimes not so subtle) biases that these models have and can represent.

Aug

2021

Minimum

(Senior Frontend Developer)

As employee number one I created the frontend from scratch working with stakeholders to quickly iterate on the product whilst maintaining a solid technical foundation.

  • I was in charge of the architecture and implementation for all front end projects.
  • Onboarded and mentored new developers
  • Created a design system and component library to easily integrate with the design team
  • Created am editor to allow the rest of the team to quickly and easily iterate on our bespoke schema system

Jun

2021

3D Now

(A website and tools to facilitate on-demand 3D printing)

When a friend bought his first 3D printer, it sparked his ambition to turn it into a business. He wanted to share the wonder of rapid prototyping with people who didn't have the space, money, or inclination to buy their own printer. When he asked me if I would be interested in helping him build a website to facilitate this, I jumped at the chance, because I had a laundry list of things I wanted to print myself but no means to do it.

We used React and Firebase to create a production app allowing people to upload and view their 3D models, select options, and order prints. Stripe integration facilitated purchases and hooked in with a bespoke backend to help manage orders and print queues. The website was a success, seeing many return customers, and the app facilitated many orders until the business was sadly shuttered for personal reasons.

This project helped me step back and understand the multifaceted benefits of software. The web app had completely different criteria and use cases than the backend tools, but both had to seamlessly work together to support the process from start to finish.

Analytics, hosting, and testing were key areas to get right in a production system to allow us to iterate quickly and safely. I'm proud to say the system supported all its transactions with no major outages or issues. I attribute this to the robustness of the tools we used and the care we took in testing the system in a specific non-production environment.

This is a product I used myself many times and still have the chopping board holder, plant pots, and frog models to prove it.

Mar

2021

Goodlord

(Senior Frontend Developer)

I worked at Goodlord for 6 months as a senior frontend developer. Although I learned a lot from my experience, I ultimately realized it wasn't the right fit for me. Capable of the work, I didn’t feel either party was getting the most out of the relationship.

My responsibilities included:

  • Updating legacy jQuery code to modern standards.
  • Incident triage and support.
  • Maintaining and improving the build process.
  • Building out the self-verification process, including integrating Onfido to identify users.

This was my first official role as a senior developer, and it is where I realized how much I enjoyed mentoring and helping others. During my employment, I focused on building genuine rapport with junior developers, helping to build their confidence, providing pragmatic advice and support, as well as advocating on their behalf in senior meetings.

May

2019

Inflo AI

(Frontend Developer)

Responsible for upkeep and implementation of new features for the webapp from ideation to implementation.

  • Introduced and implemented React hooks across the product.
  • set up Cypress.JS as part of Gitlab pipeline to run automated E2E tests