Projects Directory

This repository serves as a directory that helps you easily navigate through my other repositories and view the various projects I have completed.

Collection of personal projects

A - B - C - D - E - F - G - H - I - M - N - O - P- Q - R - S - T - U - W

A

• [PUBLIC ARCHIVE] Ada Lovelace tribute page - a simple landing page with a responsive design made with HTML, CSS & Vanilla JavaScript

B

• Bankist - landing page made with HTML, CSS & Vanilla JavaScript

C

• [PUBLIC ARCHIVE] [Counter]https://github.com/catherineisonline/simple-counter) - interactive counter component made with HTML, CSS & Vanilla JavaScript
• [PUBLIC ARCHIVE] COVID-19 awareness - a landing page with COVID-19 statistics made with HTML, CSS, Vanilla JavaScript & API

D

E

• Edgy - a social media marketing website made with HTML, Tailwind & React
• [PUBLIC ARCHIVE] Expenseless - Expenseless helps you to manage your money and track all your income & expenses effortlessly to reach your financial goals faster

F

• [PUBLIC ARCHIVE] FAQ block - FAQ block made with HTML, CSS & Vanilla JavaScript
• [PUBLIC ARCHIVE] Forkify - Forkify is a vanilla JavaScript application that interacts with the Forkify API to fetch and display recipe food data.
• Frontend Mentor challenge solutions - all my Frontend Mentor challenge solutions landing pages made with HTML, Sass & Vue

G

• [PUBLIC ARCHIVE] Giveaway countdown- giveaway countdown timer block made with HTML, CSS & Vanilla JavaScript
• [PUBLIC ARCHIVE] Grand Theatre - Grand Theatre is a minimalistic landing page for a theatre made with HTML, CSS & JavaScript
• [PUBLIC ARCHIVE] Guess my number - number guessing game project made with HTML, CSS & Vanilla JavaScript

M

• [PUBLIC ARCHIVE] Mapty - a map application made with Vanilla JavaScript to store workouts like running and cycling.
• [PUBLIC ARCHIVE] Modal block - online Gallery is a simple project to practice simple modal window pop-up with Vanilla JavaScript.
• [PUBLIC ARCHIVE] Modal window - a pop-up component made with HTML, CSS & Vanilla JavaScript
• Movie Time - The project uses React to build a movie database application, styled with CSS, and utilizing the MovieDB API.

P

• Personal Portfolio - a web developer portfolio made with HTML, Sass & React
• [PUBLIC ARCHIVE] Pick a random color - random color generator made with HTML, CSS & Vanilla JavaScript
• [PUBLIC ARCHIVE] Pig dice game - a game made with HTML, CSS & Vanilla JavaScript
• Pizza Time - multi-page food e-commerce website made with HTML, CSS & React

R

• [PUBLIC ARCHIVE] Reviews slider - reviews slider made with HTML, CSS & Vanilla JavaScript

S

• Shopping Time - Shopping Time is an e-commerce website that has at least 150 women's clothing products with different sizes and color choices. Built with React

T

• [PUBLIC ARCHIVE] Tic Tac Toe - Tic Tac Toe game, a classic game for two players where each player takes turns marking a grid of 3x3 squares with their X or O
• Travel with Catherine - photography portfolio made with HTML, Tailwind & React

U

• Useful resources - a collection of different useful tools

W

• Weather Now - Weather Now is a simple project that utilizes a weather API to display the current weather conditions of a specified location
• [PUBLIC ARCHIVE] What to do - to-do list made with HTML, CSS, React & Redux

Collection of projects from Frontend Mentor

A - B - C - D - E - F - G - H - I - M - N - O - P- Q - R - S - T - U - W

A

• [PUBLIC ARCHIVE] Advice generator -advice generator block made with HTML, CSS, Vanilla JavaScript & API
• [PUBLIC ARCHIVE] Article preview - a simple article preview block made with HTML, CSS & Vanilla JavaScript

B

• [PUBLIC ARCHIVE] Base apparel coming soon page - coming soon page made with HTML, CSS & Vanilla JavaScript

C

• Calculator - single page calculator website with theme switcher made with HTML, CSS, React & Styled Components
• [PUBLIC ARCHIVE] Crowdfunding product page - a landing page made with HTML, CSS & Vanilla JavaScript

D

• [PUBLIC ARCHIVE] Data storage component - a single block of data storage component made with HTML & CSS

E

F

• [PUBLIC ARCHIVE] FAQ accordion card - FAQ block made with HTML, CSS & Vanilla JavaScript
• [PUBLIC ARCHIVE] Four card feature section - a simple four card feature section made with HTML & CSS
• • [PUBLIC ARCHIVE] Fylo dark theme - landing page made with HTML, CSS & Vanilla JavaScript
• [PUBLIC ARCHIVE] Fylo landing page with two-column layout - landing page made with HTML, CSS & Vanilla JavaScript

H

• [PUBLIC ARCHIVE] Huddle - landing page with a single introductory section made with HTML & CSS

I

• [PUBLIC ARCHIVE] Interactive rating component - interactive rating component made with HTML, CSS, Vanilla JavaScript
• [PUBLIC ARCHIVE] IP address tracker - IP address tracker made with HTML, CSS, Vanilla JavaScript & API

N

• [PUBLIC ARCHIVE] NFT preview card - a single block of NFT preview card made with HTML & CSS

O

• [PUBLIC ARCHIVE] Order summary - a single block of order summary made with HTML & CSS

P

• [PUBLIC ARCHIVE] Ping coming soon page - coming soon page made with HTML, CSS & Vanilla JavaScript
• [PUBLIC ARCHIVE] Pricing component - a simple pricing component made with HTML, CSS, Vanilla JavaScript
• [PUBLIC ARCHIVE] Product Preview Card - a single product preview card made with HTML5 and CSS with a desktop-first workflow
• [PUBLIC ARCHIVE] Profile card - a single block of profile card made with HTML & CSS

Q

• [PUBLIC ARCHIVE] QR code block - QR code component made with HTML & CSS

S

• [PUBLIC ARCHIVE] Sign-up form - sign-up form with input validation with HTML, CSS & Vanilla JavaScript
• [PUBLIC ARCHIVE] Single price grid - a single block of price grid made with HTML & CSS
• [PUBLIC ARCHIVE] Social proof section - a simple social proof section component made with HTML & CSS
• [PUBLIC ARCHIVE] Stats preview card - a single block of stats preview card made with HTML & CSS
• [PUBLIC ARCHIVE] Sunny Side agency - landing page made with HTML, CSS & Vanilla JavaScript

T

• [PUBLIC ARCHIVE] Testimonials grid section - testimonials component made with HTML & CSS
• [PUBLIC ARCHIVE] The Huddle with alternating feature blocks - This is my solution to the Huddle landing page with alternating feature blocks challenge on Frontend Mentor
• [PUBLIC ARCHIVE] The Intro section with dropdown navigation - This is my solution to the Intro section with dropdown navigation challenge on Frontend Mentor
• [PUBLIC ARCHIVE] The news homepage - This is my solution to the news homepage challenge on Frontend Mentor
• The URL shortening API - This is my solution to the URL shortening API landing page challenge on Frontend Mentor
• [PUBLIC ARCHIVE] Three column card component - a single block of 3-column card component made with HTML & CSS

W

• <a Where in the world - countries data page along with color theme switcher made with HTML, CSS, React & API