Front-End Project by: Beth Meeker
Have you ever been so bored that you don't know what to do? GET Un-Bored is an activity generator designed for indecisive humans. Using data from Bored API, users recieve a randomly generated activity card each time they click the DO A THING button. A drop down menu allows the choice of nine categories from which to get an activity, or simply leave category unselected to receive a suggestion from a random category. Users can save the activity suggestions they like. The Saved view will allow users to Complete or Delete a saved activity. Once an activity is completed, the card is moved to the user Showcase along with a timestamp of completion. If you're feeling bored, Do A Thing and GET Un-Bored!
- Clone down this repository git clone (git@github.com:Meekb/Un_Bored.git)
- CD into your local clone cd un-bored
- Install project dependencies npm install
- Run npm start
- Open (http://localhost:3000/) in your preferred browser
- Built with React
- Uses strictly Functional Components with React Hooks
- Uses State to save/delete user activities
- React Router gives users an authentic navigation experience
- Fetches data from Bored API
- Minimal styling with plaster wall backdrop for a truly boring display
- Completed activities are displayed with colorful animated border
- Categories: Education, Recreation, Social, DIY, Charity, Cooking, Relaxation, Music, Busywork
- Error component for faulty url
From Un-Bored Home, users can generate a random activity by clicking the 'Do A Thing' button:
Suggested activities can be saved:
In Saved view, users can delete saved activities:
Users can Complete activities which will be timestamped and moved into the Showcase:
- Each completed activity will be clickable, allowing user to add images and comments
- Activity cards will include links to information about the activity
JavaScript ES6 | CSS | React | React Router | Cypress |
Beth Meeker GitHub |
Project Managers:
Kayla Gordon &
Scott Ertmer