random-quotes/README.txt at main · abderrahim1210/random-quotes · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
📝 Random Quotes – rand-quotes.html

A simple project that displays random quotes using HTML, CSS, and JavaScript. It shows a new quote every time the user clicks a button. Great for beginners to understand DOM interaction and event handling in JavaScript.

====================
📁 File Structure
====================
rand-quotes.html         ← Main HTML page
rand-qutoes.css          ← Styling and layout
rand-qutoes.js           ← JavaScript logic for random quote display
bootstrap.min.css        ← Bootstrap CSS framework
bootstrap.bundle.min.js  ← Bootstrap JS
icons8-citation-96.png   ← Icon used in the UI

====================
🚀 How It Works
====================
1. The user clicks the "Show Quote" button.
2. A random quote is selected from a predefined list in JavaScript.
3. The quote and the author's name are displayed on the screen.

====================
🔧 Technologies Used
====================
- HTML5
- CSS3
- JavaScript (ES6)
- Bootstrap 5

====================
📦 How to Use
====================
1. Open `rand-quotes.html` in your browser.
2. Click the button to generate and view a new random quote.
3. You can easily add more quotes in the JavaScript file.

====================
📌 Notes
====================
- Can be enhanced by fetching quotes from an external API.
- You can save the last shown quote in LocalStorage or display one on page load.

====================
👤 Author
====================
Abderrahim Khali Ali