This project is a Random Quote Machine built as part of the freeCodeCamp Front End Development Libraries certification. It dynamically displays quotes using HTML, CSS, and JavaScript with the React framework.
The application displays random quotes with functionalities to get a new quote or tweet the current one, fulfilling the following user stories:
| User Story | Implementation |
|---|---|
Wrapper element with id="quote-box" |
✔️ |
Element with id="text" within #quote-box |
✔️ |
Element with id="author" within #quote-box |
✔️ |
Clickable element with id="new-quote" within #quote-box |
✔️ |
Clickable a element with id="tweet-quote" within #quote-box |
✔️ |
Display random quote on first load in #text |
✔️ |
Display random quote's author on first load in #author |
✔️ |
Fetch new quote on #new-quote button click |
✔️ |
Fetch new quote's author on #new-quote button click |
✔️ |
Tweet current quote via #tweet-quote |
✔️ |
#quote-box is horizontally centered |
✔️ |
- HTML
- CSS (Bootstrap)
- JavaScript
- React
- Clone the repository:
git clone https://github.com/pxcfbof/random-quote-machine.git
- Navigate to the project directory:
cd random-quote-machine - Install dependencies:
npm install
- Start the application:
npm start
The application will be available at localhost:3000.