logo

Personal Projects

Web applications developed from my own concepts to address challenges within personal commitments or everyday routines.

  • #ReactJS
  • #Firebase
  • #Database
  • #CSS
screenshot precision-gym app

A front-end application enabling users to monitor their gym progress by entering pertinent data. Conceived during workout sessions, this app was developed to facilitate tracking and improvement.

  • User Input
  • Data manipulation
  • Storing and Fetching Database
  • User Account Authentication

Custom Web Pages

Web applications and pages crafted using mock-ups and assets sourced from frontendmentor.io to hone and enhance my skills through practice.

  • #ReactJS
  • #Vite
  • #CSS
  • #Animations
screenshot tic tac toe game

Tic Tac Toe game built with ReactJS Functional Components with Vite build tool.

  • Animation sequences for Xs, Os and crossing out winning combination
  • Score that gets updated
  • Tie result
  • Hover states for the current player's move
  • Color harmony generated by Adobe Color Wheel
  • #ReactJS
  • #CSS
  • #Desktop
  • #Mobile
screenshot product page for an e-commerce company

E-Commerce product page built with ReactJS Functional Components.

  • Optimal layout for desktop, tablet and mobile devices
  • Hover states for interactive elements on the page
  • Clicking on the large product image opens a lightbox gallery
  • Clicking on the small thumbnail images switches the largeproduct page
  • Set product quantity can be added to the cart
  • The cart can be viewed and emptied
  • #HTML
  • #CSS
  • #JavaScript
  • #API
  • #Desktop
  • #Mobile
screenshot app that generates text from API

An app that generates random advice text from an external API.

  • Optimal layout for desktop and mobile devices
  • Hover states for interactive elements on the page
  • Clicking the button generates a new piece of advice

Private Tutoring Projects

Web pages created based on mock-ups and assets supplied by Tom Parson during private tutoring sessions on Front End Development. These projects feature unique designs by Huddle Digital for real-life scenarios. To maintain confidentiality, any client names and specifics have been altered.

  • #HTML
  • #Sass
  • #Desktop
  • #Mobile
screenshot landing page for an interior design service
  • #HTML
  • #CSS
  • #Desktop
  • #Mobile
screenshot login page for an analytics service
screenshot login page for an analytics service
screenshot login page for an analytics service
  • #HTML
  • #CSS
  • #Desktop
  • #Mobile
screenshot page for a debt solutions service
screenshot page for a debt solutions service
  • #HTML
  • #CSS
  • #Sass
  • #JavaScript
screenshot homepage for a charity
screenshot homepage for a charity