https://github.com/subhajitroycode/random-quote-machine
The Random Quote Machine is a captivating React-based web app that fetches and displays thought-provoking quotes from an API. With a simple interface, users can effortlessly generate new random quotes or share their favorites on Twitter. Offering a blend of wisdom, functionality, and aesthetics.
https://github.com/subhajitroycode/random-quote-machine
random-quote-generator random-quote-machine react reactjs tailwind tailwindcss
Last synced: 2 months ago
JSON representation
The Random Quote Machine is a captivating React-based web app that fetches and displays thought-provoking quotes from an API. With a simple interface, users can effortlessly generate new random quotes or share their favorites on Twitter. Offering a blend of wisdom, functionality, and aesthetics.
- Host: GitHub
- URL: https://github.com/subhajitroycode/random-quote-machine
- Owner: subhajitroycode
- Created: 2024-03-23T15:30:14.000Z (almost 2 years ago)
- Default Branch: master
- Last Pushed: 2024-03-23T15:52:25.000Z (almost 2 years ago)
- Last Synced: 2025-02-28T05:49:59.547Z (about 1 year ago)
- Topics: random-quote-generator, random-quote-machine, react, reactjs, tailwind, tailwindcss
- Language: JavaScript
- Homepage: https://random-quote-machine-subhajit.netlify.app/
- Size: 48.8 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Random Quote Machine
This is a simple web application built with React that displays random quotes. It fetches a collection of quotes from an external API and displays them one at a time. The user can click a button to generate a new random quote, and there's also a button to tweet the current quote.
## Features
- Fetches quotes from an API
- Displays a random quote with author
- Allows users to generate a new random quote
- Provides a button to tweet the current quote
- Responsive design for different screen sizes
## Technologies Used
- React
- React Hooks (useState, useEffect)
- Fetch API
- Font Awesome (for icons)
- CSS
## Getting Started
1. Clone the repository: `git clone https://github.com/subhajitroycode/random-quote-machine.git`
2. Navigate to the project directory: `cd random-quote-machine`
3. Install dependencies: `npm install`
4. Run the application: `npm run dev`
5. Open your web browser and visit `http://localhost:5173` to see the Random Quote Machine in action.
## Usage
- Click the "New Quote" button to generate a new random quote.
- Click the Twitter icon button to open a new Twitter window and tweet the current quote.
## Contributing
Contributions are welcome! If you find any issues or have suggestions for improvements, please open an issue or submit a pull request.
## Acknowledgments
- [React](https://reactjs.org/)
- [Vite](https://vitejs.dev/)
- [Font Awesome](https://fontawesome.com/)
- [Quote API](https://gist.github.com/camperbot/5a022b72e96c4c9585c32bf6a75f62d9)
- [freeCodeCamp](https://www.freecodecamp.org/learn/front-end-development-libraries/front-end-development-libraries-projects/build-a-random-quote-machine)