• Introduction
• Technologies
• Set Up
• Deployment Link
• Features
• Reflection
• Future Features
• Contributors
• Project Specifications

We all need a little motivation in our lives and that’s what motivational posters are for! But have you ever wanted to make motivational posters tailored to you and your specific needs for inspiration?

Well now with Hang In There you can! Use our Make Poster form to create posters with titles, quotes, and images chosen by YOU. No idea what motivation you need? Let our curated list of inspirational images, quotes, and titles make YOUR motivation. You can even save your favorite motivational posters to view them later.

• JavaScript
• HTML
• CSS

1. Clone this repository.
2. cd into the directory.
3. Run open index.html.

• Simply go to: https://davidhdaw.github.io/hang-in-there-project/

• User can view a random poster on page load
• User can view a random poster each time Show Another Random Poster button is clicked

• User can switch between three views (main page, saved posters page, and make your own poster page)

• User can make their own poster by filling out a form

• User can save a random poster or their own poster

• User can delete a poster(s) from the saved posters page

• User can see an error message if all 3 inputs are not filled out on form

• Since the HTML and CSS were provided to start working on the project it let us see how JS works together with those elements.
• Because the project asked us to interact with the HTML and CSS in a variety of ways, it was a good learning experience about what JS can and can’t do on its own in creating a webpage.
• The most challenging part of the project was finding pure JS solutions to selecting the correct part of the page and applying the listeners we wanted.
• Multiple times in the project, adding an additional class or ID to an HTML element could have helped us reuse the functions. However, this added layer of challenge also forced us to become more familiar with JS.

• All buttons change color when clicked (not solely hover color change)
• Replace parts of the poster with a new random image, title or quote by clicking on them
• Drag and drop saved posters in the grid to new positions
• When a saved poster is clicked in the grid, two buttons pop up to let user choose between deleting the poster and promoting it as the main poster

• Google Sheet

• David Daw
• Irmak Erdem

• Project specs can be found here.