https://github.com/ayokanmi-adejola/random-quote-machine
A simple and elegant random quote generator built with React, TypeScript, and Tailwind CSS. Fetches and displays inspirational quotes, and allows users to share them on Twitter. The UI features a dynamic color scheme that changes with each new quote.
https://github.com/ayokanmi-adejola/random-quote-machine
mobile-first-workflow react18 tailwindcss typescript vite
Last synced: about 1 month ago
JSON representation
A simple and elegant random quote generator built with React, TypeScript, and Tailwind CSS. Fetches and displays inspirational quotes, and allows users to share them on Twitter. The UI features a dynamic color scheme that changes with each new quote.
- Host: GitHub
- URL: https://github.com/ayokanmi-adejola/random-quote-machine
- Owner: Ayokanmi-Adejola
- Created: 2025-06-20T22:33:32.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-08-31T20:42:38.000Z (10 months ago)
- Last Synced: 2025-09-30T00:00:39.960Z (9 months ago)
- Topics: mobile-first-workflow, react18, tailwindcss, typescript, vite
- Language: TypeScript
- Homepage: https://random-quote-machine-zeta-ten.vercel.app
- Size: 129 KB
- Stars: 10
- Watchers: 0
- 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 that displays random quotes and allows you to share them on Twitter. The background color of the page also changes every time a new quote is generated
## Features
- **Display Random Quotes:** Shows a new quote from a curated list each time the "New Quote" button is clicked.
- **Tweet Quotes:** Allows you to share the current quote on your Twitter feed.
- **Dynamic Background Colors:** The background color of the page changes with each new quote.
- **Responsive Design:** The application is designed to work well on different screen sizes.
## Technologies Used
- [React](https://reactjs.org/)
- [TypeScript](https://www.typescriptlang.org/)
- [Tailwind CSS](https://tailwindcss.com/)
- [Vite](https://vitejs.dev/)
## Getting Started
To get a local copy up and running, follow these simple steps.
### Prerequisites
- [Node.js](https://nodejs.org/en/) installed on your machine.
### Installation
1. Clone the repo
```sh
git clone https://github.com/Ayokanmi-Adejola/Random-Quote-Machine
```
2. Install NPM packages
```sh
npm install
```
3. Start the development server
```sh
npm run dev
```
4. Open your browser and navigate to `http://localhost:5173/`