Cara buat aplikasi untuk generate qr code per masing sertifikat pelatihan

Arreza MP Oktober 02, 2024 0 Komentar

Cara buat aplikasi untuk generate qr code per masing sertifikat pelatihan

Untuk membuat aplikasi yang dapat menghasilkan QR code untuk setiap sertifikat pelatihan, Anda dapat mengikuti langkah-langkah berikut. Anda dapat membangun aplikasi ini menggunakan bahasa pemrograman seperti Python atau JavaScript dengan integrasi perpustakaan atau API untuk membuat QR code. Di sini, saya akan memberikan panduan untuk kedua metode.

Langkah-langkah umum:

Langkah 1: Persiapan Data Sertifikat
- Setiap sertifikat pelatihan perlu memiliki data unik yang ingin diubah menjadi QR code. Data ini dapat mencakup:
  - Nama peserta
  - Nomor sertifikat
  - Judul pelatihan
  - Tanggal pelatihan
  - Tautan URL (jika ingin menyimpan sertifikat online)
Langkah 2: Pilih Teknologi
- Tentukan apakah Anda ingin aplikasi desktop, web, atau mobile. Pilihan bahasa dan alat akan tergantung pada jenis aplikasi.

Metode 1: Menggunakan Python

Persiapan:

Anda bisa menggunakan pustaka qrcode dan Pillow (untuk gambar) di Python.

Langkah-langkah:

Install Pustaka yang Dibutuhkan: Jalankan perintah berikut di terminal atau command prompt:
```
bash
pip install qrcode[pil]
```

Buat Kode Python untuk Menghasilkan QR Code: Berikut adalah contoh sederhana untuk membuat QR code:

python
import qrcode

# Data sertifikat yang ingin dienkode ke QR code
def generate_qr_code(data, filename):
    # Membuat QR code
    qr = qrcode.QRCode(
        version=1,
        error_correction=qrcode.constants.ERROR_CORRECT_L,
        box_size=10,
        border=4,
    )
    qr.add_data(data)
    qr.make(fit=True)

    # Membuat gambar QR code
    img = qr.make_image(fill='black', back_color='white')
    img.save(f"{filename}.png")

# Contoh data yang akan diubah menjadi QR code
sertifikat_data = "Nama: John Doe\nNomor Sertifikat: 123456\nPelatihan: Keamanan Siber\nTanggal: 01 Oktober 2024"
generate_qr_code(sertifikat_data, "sertifikat_john_doe")

Output:
- Setelah Anda menjalankan script ini, gambar QR code akan dibuat dengan nama sertifikat_john_doe.png.

Sertifikat Masif:

Jika Anda memiliki banyak peserta, Anda bisa menggunakan file CSV atau database untuk menyimpan data dan menghasilkan QR code secara otomatis.

Contoh menggunakan CSV:

python
import csv

with open('data_peserta.csv', newline='') as csvfile:
    reader = csv.DictReader(csvfile)
    for row in reader:
        data = f"Nama: {row['Nama']}\nNomor Sertifikat: {row['No Sertifikat']}\nPelatihan: {row['Pelatihan']}\nTanggal: {row['Tanggal']}"
        generate_qr_code(data, row['Nama'])

CSV Sample:

Nama	No Sertifikat	Pelatihan	Tanggal
John Doe	123456	Keamanan Siber	01-10-2024
Jane Smith	654321	Manajemen Proyek	02-10-2024

Metode 2: Menggunakan JavaScript (Web Application)

Langkah-langkah:

Gunakan QR Code Library (qrcode.js):
- Anda dapat menggunakan pustaka qrcode.js untuk membuat QR code di aplikasi web.
- Download qrcode.js dari: https://github.com/davidshimjs/qrcodejs

HTML dan JavaScript:

Buat file index.html dengan kode berikut:

html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>QR Code Generator for Certificates</title>
    <script src="qrcode.min.js"></script>
</head>
<body>
    <h2>Generate QR Code for Certificates</h2>
    <form id="cert-form">
        <label for="name">Name:</label>
        <input type="text" id="name" required><br>
        <label for="cert">Certificate Number:</label>
        <input type="text" id="cert" required><br>
        <label for="course">Course:</label>
        <input type="text" id="course" required><br>
        <label for="date">Date:</label>
        <input type="date" id="date" required><br>
        <button type="submit">Generate QR Code</button>
    </form>

    <div id="qrcode"></div>

    <script>
        document.getElementById('cert-form').addEventListener('submit', function(event) {
            event.preventDefault();
            
            var name = document.getElementById('name').value;
            var cert = document.getElementById('cert').value;
            var course = document.getElementById('course').value;
            var date = document.getElementById('date').value;

            var qrData = `Name: ${name}\nCertificate Number: ${cert}\nCourse: ${course}\nDate: ${date}`;
            
            // Generate QR Code
            var qrCode = new QRCode(document.getElementById("qrcode"), {
                text: qrData,
                width: 128,
                height: 128
            });
        });
    </script>
</body>
</html>

Cara Kerja:
- Pengguna mengisi formulir dengan data peserta (nama, nomor sertifikat, pelatihan, dan tanggal).
- Setelah mengisi, aplikasi akan menghasilkan QR code yang berisi informasi tersebut dan menampilkannya di halaman web.
Hosting:
- Jika ini adalah aplikasi web, Anda bisa meng-host file ini di server untuk diakses oleh banyak pengguna.

Metode Penyimpanan QR Code

Anda bisa menyimpan hasil QR code bersama sertifikatnya, baik dalam bentuk PDF atau cetakan fisik. Sertifikat dapat diunduh oleh pengguna atau dicetak untuk keperluan fisik.

Menambah QR Code ke Sertifikat PDF (Python example with ReportLab):

Install ReportLab:
```
bash
pip install reportlab
```

Kode untuk membuat sertifikat dengan QR code:

python
from reportlab.lib.pagesizes import letter
from reportlab.pdfgen import canvas
from PIL import Image

def create_certificate_with_qr(name, cert_num, course, date, qr_image):
    c = canvas.Canvas(f"{name}_certificate.pdf", pagesize=letter)
    c.drawString(100, 750, f"Certificate of Completion")
    c.drawString(100, 730, f"Presented to: {name}")
    c.drawString(100, 710, f"For completing: {course}")
    c.drawString(100, 690, f"Certificate Number: {cert_num}")
    c.drawString(100, 670, f"Date: {date}")

    # Adding QR Code Image
    c.drawImage(qr_image, 400, 600, width=100, height=100)
    c.showPage()
    c.save()

create_certificate_with_qr("John Doe", "123456", "Cyber Security", "01-10-2024", "sertifikat_john_doe.png")