Quote Generator

A simple quote generator built with vanilla HTML, CSS, and JavaScript, containerized with Docker and served via Nginx. Click a button to get a new random quote, or copy it to your clipboard.

Features

• 12 built-in inspirational/motivational quotes
• Random quote on each click, with a smooth fade transition
• Never repeats the same quote twice in a row
• Copy-to-clipboard button with confirmation feedback
• Clean, warm-toned UI

Tech Stack

• Frontend: HTML, CSS, JavaScript
• Server: Nginx (Alpine)
• Containerization: Docker

Project Structure

.
├── Dockerfile      # Instructions to build the container image
├── index.html      # The quote generator app (markup, styling, and logic)
└── README.md

Running the App

Option 1: Pull and run from Docker Hub

docker pull anasv66/myquotes:v1
docker run -p 8080:80 anasv66/myquotes:v1

Then open http://localhost:8080 in your browser.

Option 2: Build from source

Clone this repository, then from the project folder:

docker build -t myquotes .
docker run -p 8080:80 myquotes

Then open http://localhost:8080 in your browser.

How It Works

The Dockerfile uses a lightweight nginx:alpine base image to serve the static index.html file. Nginx handles the app on port 80 inside the container, which is mapped to port 8080 on the host machine.

FROM nginx:alpine
COPY index.html /usr/share/nginx/html/index.html
EXPOSE 80

Quotes are stored directly in a JavaScript array inside the file — no external API or database is used. Clicking "New Quote" picks a random index from that array and displays it.

Known Limitations

• The quote list is fixed at 12 entries and can only be expanded by editing the source code directly.

Docker Hub

Public image: anasv66/myquotes

Author

Lawal Anas Ishaq