📷 QR‑Code Web Generator

A simple web interface that lets users generate QR Codes from text or URLs. Enter any text/URL, click “Genereer QR Code”, and the app calls a backend endpoint to generate the image and display it in the browser.

This project uses basic HTML, CSS, and JavaScript, and is designed to be deployed on a serverless platform (e.g., Cloudflare Workers via the included wrangler.json). You’ll need a backend that implements the /generate?data=… endpoint to return a QR code image in JSON format.

---

🚀 Features

• ✏️ Input any text or URL
• 🧠 Sends request to backend to generate a QR code
• 📸 Displays the generated QR code in the UI
• 📱 Clean and responsive layout for easy use

QR Codes (Quick Response Codes) are two‑dimensional barcodes that store information in a grid and can be scanned by cameras and phones. (Wikipedia)

---

🧩 Project Structure

📦 .
├── index.html        ← UI for text input & button
├── script.js         ← JavaScript to call `/generate`
├── styles.css        ← Basic styles for layout & responsiveness
├── wrangler.json     ← Config for Cloudflare Workers (optional deploy)
└── README.md         ← ← You are here!

---

🧠 How It Works

1. The user enters text or a URL in the input field.
2. The Genereer QR Code button triggers a JavaScript function (genereerQR()).
3. It sends a request to your backend at /generate?data=….
4. The backend must return a JSON object containing a image field with the generated QR code (base64 or URL).
5. The app displays the returned QR code image on the page.

Example JavaScript fetch call:

const res = await fetch(`/generate?data=${encodeURIComponent(tekst)}`);
const result = await res.json();
qrImg.src = result.image;

---

🛠 Installation & Running Locally

To preview the UI only:

1. Clone the repo

   git clone https://github.com/kodiamstudio/qr-code.git
   cd qr-code

2. Open index.html in your browser.

⚠️ Note: The frontend expects a backend endpoint (/generate?data=…) that returns:

{ "image": "data:image/png;base64,..." }

You’ll need a server or serverless function to provide this.

---

☁️ Deploy to Cloudflare Workers (Optional)

The included wrangler.json suggests deployment with Cloudflare Workers. To deploy:

1. Install Wrangler CLI:

   npm install -g wrangler

2. Login to Cloudflare:

   wrangler login

3. Publish the worker:

   wrangler publish

Make sure your Worker implements a generate endpoint that creates QR codes from input text.

---

💡 Contribution

Feel free to improve:

• UI & styling
• Add presets (Wi‑Fi, vCard, etc.)
• Support dynamic QR code generation
• Add download button for the generated QR image

---

📄 License

This project does not include a license file — it defaults to no license. If you want others to use and contribute, consider adding an open source license like MIT.