https://github.com/jpnws/random-quote-machine
A React-based web application designed to display a random quote with a dynamically changing background image.
https://github.com/jpnws/random-quote-machine
css html javascript react
Last synced: 2 months ago
JSON representation
A React-based web application designed to display a random quote with a dynamically changing background image.
- Host: GitHub
- URL: https://github.com/jpnws/random-quote-machine
- Owner: jpnws
- Created: 2020-05-20T23:50:15.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2024-02-20T07:47:54.000Z (about 1 year ago)
- Last Synced: 2025-01-12T11:46:04.342Z (4 months ago)
- Topics: css, html, javascript, react
- Language: JavaScript
- Homepage: https://random-quote-machine-iota-teal.vercel.app/
- Size: 49.8 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Random Quote Machine
## Overview
The Random Quote Machine is a React-based web application designed to display a
random quote with a dynamically changing background image.
## Features
- **Quote Display**: Presents users with a randomly selected quote from an external API.
- **Background Image**: Each quote is displayed against a randomly chosen background image fetched from a separate API.
- **Responsive Design**: The application is fully responsive, providing an optimal viewing experience across a range of devices.
- **Social Sharing**: Includes functionality to share quotes on Twitter.
- **Error Handling**: Implements error handling for API requests.
- **Modern Styling**: Utilizes CSS for styling and layout, demonstrating an understanding of modern web design principles.
## Technologies Used
- React
- JavaScript (ES6+)
- HTML5 and CSS3
- External APIs
## Setup and Installation
1. Clone the repository to your local machine.
```bash
git clone https://github.com/jpnws/random-quote-machine.git
```
2. Navigate to the project directory.
```bash
cd random-quote-machine
```
3. Run `npm install` to install dependencies.
```bash
npm install
```
4. Use `npm run dev` to launch the application in your browser.
```bash
npm run dev
```