My Projects

A collection of my recent work showcasing my frontend development skills

My World Clock App showing multiple timezone displays with purple gradient interface

My World Clock App

A responsive world clock application built with vanilla JavaScript that displays real-time information across multiple global time zones simultaneously. The app features automatic location detection using the browser's Geolocation API and provides a searchable dropdown of major cities organised by continent.

Key Features

  • Automatic location detection using Geolocation API
  • Searchable dropdown with cities organised by continent
  • Real-time updates every second with smooth transitions
  • Displays both 12-hour and 24-hour time formats
  • Fully responsive design across all devices

Technical Highlights

  • DOM Manipulation: Dynamic updates without page reloads
  • Event Handling: Change listeners for interactive city selection
  • Time Libraries: Moment.js and Moment Timezone for accurate conversions
  • Semantic HTML: Organized select elements with optgroup tags
HTML5 CSS3 JavaScript ES6 Moment.js Moment Timezone Geolocation API Git/GitHub Netlify
View Demo View Code
My Vanilla Weather App showing real-time weather interface with forecasts

My Weather App

A clean, modern weather application built entirely with vanilla JavaScript that provides real-time weather data and multi-day forecasts using the OpenWeatherMap API. The app features automatic location detection, global city search, and displays comprehensive weather metrics including temperature, humidity, wind speed, and descriptive conditions.

Key Features

  • Real-time weather data using OpenWeatherMap API
  • 5-day forecast with daily high/low temperatures
  • Automatoc location detection via Geolocation API
  • City search for any location worldwide
  • Dark/light theme toggle for user preference
  • Comprehensive metrics: humidity, wind speed, visibility

Technical Highlights

  • API Integration: OpenWeatherMap Current Weather & 5-Day Forecast APIs
  • Async/Await: Modern asynchronous JavaScript for API calls
  • Error Handling: Manages failed requests and invalid searches
  • Theme Management: CSS variables for dark/light mode switching
HTML5 CSS3 JavaScript ES6 OpenWeatherMap API Geolocation API Axios/Fetch API VS Code Git/GitHub Netlify
View Demo View Code
My Recipe Creator App interface with AI-powered recipe generation

My Recipe Creator App

An AI-powered recipe generator that transforms user-provided ingredients into complete, healthy, budget-friendly recipes using the SheCodes AI API. This application demonstrates advanced API integration by sending ingredient lists to an AI model and parsing the structured response to display comprehensive recipe information, including ingredients, instructions, cooking time, and serving suggestions.

Key Features

  • AI-generated recipes based on available ingredients
  • Smart prompt engineering for healthy, budget-friendly meals
  • Complete recipe display with instructions and cooking times
  • Typewriter effect for engaging content reveal
  • Input validation and loading states

Technical Highlights

  • AI Integration: SheCodes AI API with proper authentication
  • Prompt Engineering: Crafted prompts for consistent outputs
  • String Parsing: Processes AI-generated text for displays
  • Form Handling: User input validation and submission management
HTML5 CSS3 JavaScript ES6 SheCodes AI API Axios/Fetch API API Authentication Git/GitHub Netlify
View Demo View Code
My AI Poem Generator App interface with creative poetry generation interface

My AI Poem Generator App

A creative writing application that leverages artificial intelligence to generate unique, romantic poems based on user-provided topics and themes. Built with the SheCodes AI API, this project demonstrates proficiency in AI integration, prompt engineering, and creating engaging user experiences with an elegant typewriter effect that reveals poetry line by line.

Key Features

  • AI-powered poetry generation using SheCodes AI API
  • Custom topic input for personalized poems
  • Romantic verse specialization
  • Typewriter animation for dramatic reveal
  • Clean, minimalist interface focused on content

Technical Highlights

  • Prompt Engineering: Crafted prompts for poetic, consistent output
  • Animation: JavaScript-based typewriter effect with timing control
  • Async Operations: Promise handling for API responses
  • UI/UX: Engaging visual feedback during generation
HTML5 CSS3 JavaScript ES6 SheCodes AI API Axios/Fetch API API Authentication Git/GitHub Netlify
View Demo View Code
My AI Travel Itinerary App interface - Python-based travel planning assistant

My AI Travel Itinerary App

An intelligent command-line travel planning assistant built in Python that creates personalized trip itineraries by combining real-time weather data with AI-generated recommendations. This project demonstrates advanced Python programming concepts including object-oriented design, API integration, and terminal-based UI enhancement using the Rich library for beautiful, colourful output.

Key Features

  • Interactive command-line interface for travel planning
  • Dual API integration: OpenWeather + AI generation
  • Weather-aware itinerary generation
  • Rich library for colourful terminal output
  • Supports custom trip duration and provides estimated cost

Technical Highlights

  • Object-Oriented Programming: Classes for organizing data and logic
  • API Integration: RESTful API calls with error handling
  • Data Structures: Dictionaries and lists for travel information
  • JSON Processing: Parsing API responses
  • Rich Library: Styled console output with colours and formatting

Note: This is an interactive Jupyter Notebook on Google Colab. Run it directly in your browser!

Python 3 OpenWeather API AI API Rich Library Requests Library JSON Object-Oriented Programming Google CoLab Git/GitHub
View Demo View Code