Skip to content

chriskimty/moodyMemes

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Moody Memes 2.0: Track your Mood in Memes over Time!

🔗Live Link

About

Moody Memes 2.0 is a React application that allows authenticated users to track their mood in memes over time, by allowing users to type in their mood of the day, choose a meme/gif that best represents their mood, and save their 'Moody Meme' to the timeline. Users can sign-up for an account using an email address and password, via Google Sign-In, or as an anonymous user.

This project is a solo extension to Moody Memes (Repo), a team-based React project completed at Juno College, with Brittany Freitas, Daniel Butcher and Kwame Appiah-Kubi.

Features

Moody Memes 2.0 features:

  • CRUD (Create, Read, Update, Delete) functionalities for saved memes
  • User authentication with Firebase
  • Session persistence (user remains logged within the same session)
  • Anonymous user Sign-In
  • Timeline features saved memes by users
  • Users can only delete memes that they generated
  • Usage of React features and hooks (useState, useEffect, useContext, useNavigate, useRef, Link, Router, props, components, custom hook)
  • Firebase (User Authentication, Realtime Database)

Project Demonstration

gif that shows a project demo of how user will use Moody Memes 2.0

Views

Tablet View (with user logged in)

tablet view of the landing/home page of Moody Memes 2.0

Mobile View (with user logged in)

mobile view of the landing/home page of Moody Memes 2.0

Mobile View (on hover of user icon)

mobile view on hover of the user icon which shows user email address on landing/home page of Moody Memes 2.0

✨Moody Memes 2.0 is graciously powered by the Giphy API.

About

Moody Memes 2.0: Track your Mood in Memes!

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 45.5%
  • SCSS 27.0%
  • CSS 26.5%
  • HTML 1.0%