Ingin belajar coding melalui video secara gratis?
Cek youtube channel saya => DI SINI!

Cara Mudah Membuat QR Code atau Kode QR Dengan Codeigniter

Cara Mudah Membuat QR Code atau Kode QR Dengan Codeigniter

Pada suatu hari tiba-tiba tanpa di sengaja saya bertemu dengan sahabat lama saya. Saya hampir tidak mengenalinya saking lamanya tidak berjumpa.

Dia terlihat gemukkan sekarang. tapi, biar bagaimanapun saya merasa senang bisa bertemu dengan dia lagi.

Karena sudah lama tidak berjumpa, kami pun memutuskan untuk hangout keluar minum kopi.

Dalam perjalanan menuju warung kopi, cuaca pun mulai menunjukkan tanda-tanda mau hujan.

Awan-awan hitam mulai mengepul dan tetesan hujan pun mulai terasa dan kami pun bergegas untuk cepat-cepat sampai di warung kopi.

Sesampainya disana, kami pun memesan kopi hitam hangat.

Kami pun menikmati seruput demi seruput kopi hitam hangat tersebut. Ditambah lagi cuaca cukup dingin karena derasnya hujan menambah sensasi nikmat dari kopi kami.

Kami pun ngobrol banyak. Mulai dari penjalanan kuliah, relationship, visi misi, masa depan, dan pekerjaan.

Di tengah-tengah pembicaraan, tiba-tiba dia terdiam lalu mengeluarkan smartphone-nya dan berkata: “Bagaimana caranya aku bisa menghubungi kamu lagi? Bagaimana kalo melalui line aja?. Sini, scan QR CODE saja biar cepat”, Ujarnya.

Saya pun tertegun, dan memeriksa saku demi saku. Tanpa disadari ternyata handphone saya ketinggalan.

Karena takut mengecewakan dia, saya pun memberikan nomor handphone saya kepadanya.

Sebenarnya saya bersyukur, karana handphone saya ketinggalan karena sebenarnya saya tidak punya LINE, BBM, ataupun WhatApp. Akun sosmed yang saya punya hanyalah Facebook dan Instagram.

Dari pembicaraan tersebut, saya menyadari satu hal. Saya merasa tertarik dengan QR CODE dan saya mendapatkan ide untuk belajar bagaimana membuat QR CODE dengan codeigniter.

Ide terkadang memang muncul di saat momen-momen seperti itu. QR Code berhasil menarik perhatian saya.

Sepulangnya dari warung kopi saya pun mulai menelusuri tentang QR CODE, ternyata QR CODE ini benar-benar mengagumkan. Selain dapat menampung banyak karakter, juga dapat menampung huruf kanji Jepang.

Saya yakin anda sudah tidak asing lagi dengan QR CODE, apa lagi anda punya akun BBM atau LINE. Jika mungkin diantara Anda masih ada yang asing tentang QR CODE, berikut penjelasannya.

QR Code (Quick Response Code) merupakan bentuk evolusi dari BARCODE (Kode Batang) dari satu dimensi menjadi dua dimensi.

Sederhananya QR CODE merupakan perkembangan dari BARCODE.

Setelah saya pelajari, ternyata QR CODE ini telah banyak digunakan oleh pengembang sistem informasi untuk membangun sistem informasi member ataupun Human Resources (HR).

Boommm, lagi-lagi QR CODE menarik perhatian saya.

Semakin jauh saya menelusuri tentang QR CODE, akhirnya saya menemukan sebuah library QR Code untuk codeigniter.

Tanpa menunda lagi saya langsung mempelajarinya. Ternyata library-nya sangat bagus dan mudah digunakan oleh pemula sekalipun.

Begitu saya berhasil melakukannya, tidak sabarnya rasanya ingin sharing. Karena saya yakin akan banyak yang membutuhkannya.

Pada kasus kali ini, saya akan sharing bagaimana membuat NIM (Nomor Induk Mahasiswa) kedalam bentuk QR CODE.

Adapun caranya sebagai berikut:

Dapatkan diskon 75% paket hosting dan gratis domain + extra diskon 5% dengan menggunakan kupon: MFIKRI

Order Sekarang.!

 

#1. PERSIAPAN

Sebelum proses pembuatan, ada tahap yang tidak boleh anda lewatkan begitu saja. Yaitu tahap persiapan.

Apa saja yang perlu anda persiapkan?

Berikut listnya:

Codeiginter, jika anda belum memilikinya silahkan download di situs resminya www.codeigniter.com

Jquery, Jika anda belum memilikinya, silahkan download di situs resminya www.jquery.com

Bootstrap, bootstrap ini berfungsi untuk mempercantik tampilan. Jika anda belum memilikinya, silahkan download di situs resminya www.getbootstrap.com

Codeigniter-PHP-QR-Code, merupakan library untuk membuat QR Code menggunakan codeigniter. Untuk mendownload-nya silahkan download di link berikut:

https://github.com/dwisetiyadi/CodeIgniter-PHP-QR-Code

 

#2. PEMBUATAN STRUKTUR DATABASE DAN TABLE

Berikutnya, yang perlu anda lakukan adalah pembuatan database dan struktur table.

Database, buat database dengan mengeksekusi query berikut:

CREATE DATABASE db_akademik;

Pada query diatas, anda akan mendapatkan sebuah database dengan nama db_akademik.

Table, buat Tabel mahasiswa dengan mengeksekusi query berikut:

CREATE TABLE mahasiswa(
nim VARCHAR(15) PRIMARY KEY,
nama VARCHAR(50),
prodi VARCHAR(40),
qr_code VARCHAR(50)
)ENGINE=INNODB;

Query diatas akan menghasil sebuah tabel mahasiswa dengan field nim dengan type data varchar(15), nama dengan type data varchar(50), prodi dengan varchar(40), dan qr_code dengan type data varchar(50).

 

#3. INSTALLASI CODEIGNITER

Untuk menginstall codeigniter, silahkan extract codeigniter yang sudah di download sebelumnya ke folder www (jika menggunakan wampserver) atau htdocs (jika menggunakan XAMPP).

Kemudian rename (ganti nama) project codeigniter anda sesuai dengan project Anda. Disini saya memberi nama qrcode.

Setelah di extract, buat folder assets sejajar dengan folder application dan system, kemudian sertakan file bootstrap dan jquery didalam folder assets. Sehingga terlihat struktur project kita seperti berikut:

Pada gambar diatas dapat dilihat, bahwa didalam folder assets terdapat folder css, fonts, images, dan js.

Didalam folder css, terdapat file bootstrap.css

Didalam folder js, terdapat file bootstrap.js dan jquery-2.1.4.min.js.

Sedangkan folder fonts dan images merupakan folder bawaan bootstrap.

 

#4. KONFIGURASI CODEIGNITER

Buka application/config/autoload.php atur menjadi seperti berikut:

$autoload['libraries'] = array('database');
$autoload['helper'] = array('url');

Buka application/config/config.php dan atur menjadi seperti berikut:

$config['base_url'] = 'http://localhost/qrcode/';

Terakhir buka application/config/database.php

$active_group = 'default';
$query_builder = TRUE;

$db['default'] = array(
        'dsn'   => '',
        'hostname' => 'localhost',
        'username' => 'root',
        'password' => '',
        'database' => 'db_akademik', //sesuaikan dengan database anda!
        'dbdriver' => 'mysqli',
        'dbprefix' => '',
        'pconnect' => FALSE,
        'db_debug' => (ENVIRONMENT !== 'production'),
        'cache_on' => FALSE,
        'cachedir' => '',
        'char_set' => 'utf8',
        'dbcollat' => 'utf8_general_ci',
        'swap_pre' => '',
        'encrypt' => FALSE,
        'compress' => FALSE,
        'stricton' => FALSE,
        'failover' => array(),
        'save_queries' => TRUE
);

Selanjutnya, Copy-kan folder qrcode dan file Ciqrcode.php yang terdapat dari master Codeigniter-PHP-QR-Code ke folder project application/libaries/.

Sehingga terlihat seperti gambar berikut:

 

#5. MODEL

Buat sebuah model dengan nama Mahasiswa_model.php dengan kode sebagai berikut:

<?php
class Mahasiswa_model extends CI_Model{

        function get_all_mahasiswa(){
                $hasil=$this->db->get('mahasiswa');
                return $hasil;
        }
        
        function simpan_mahasiswa($nim,$nama,$prodi,$image_name){
                $data = array(
                        'nim'           => $nim,
                        'nama'          => $nama,
                        'prodi'         => $prodi, 
                        'qr_code'       => $image_name
                );
                $this->db->insert('mahasiswa',$data);
        }
}

Pada model mahasiswa_model dapat dilihat terdapat dua function. Yaitu function get_all_mahasiswa() dan function simpan_mahasiswa().

Function get_all_mahasiswa() berfungsi untuk menampilkan semua data mahasiswa yang ada di tabel mahasiswa ke view.

Sedangkan function simpan_mahasiswa() berfungsi untuk menyimpan data mahasiswa kedalam database.

 

#6. CONTROLLER

Buat sebuah controller dengan nama Mahasiswa.php dengan kode sebagai berikut:

<?php 
class Mahasiswa extends CI_Controller{
        function __construct(){
                parent::__construct();
                $this->load->model('mahasiswa_model'); //pemanggilan model mahasiswa
        }

        function index(){
                $data['data']=$this->mahasiswa_model->get_all_mahasiswa();
                $this->load->view('mahasiswa_view',$data);
        }

        function simpan(){
                $nim=$this->input->post('nim');
                $nama=$this->input->post('nama');
                $prodi=$this->input->post('prodi');

                $this->load->library('ciqrcode'); //pemanggilan library QR CODE

                $config['cacheable']    = true; //boolean, the default is true
                $config['cachedir']             = './assets/'; //string, the default is application/cache/
                $config['errorlog']             = './assets/'; //string, the default is application/logs/
                $config['imagedir']             = './assets/images/'; //direktori penyimpanan qr code
                $config['quality']              = true; //boolean, the default is true
                $config['size']                 = '1024'; //interger, the default is 1024
                $config['black']                = array(224,255,255); // array, default is array(255,255,255)
                $config['white']                = array(70,130,180); // array, default is array(0,0,0)
                $this->ciqrcode->initialize($config);

                $image_name=$nim.'.png'; //buat name dari qr code sesuai dengan nim

                $params['data'] = $nim; //data yang akan di jadikan QR CODE
                $params['level'] = 'H'; //H=High
                $params['size'] = 10;
                $params['savename'] = FCPATH.$config['imagedir'].$image_name; //simpan image QR CODE ke folder assets/images/
                $this->ciqrcode->generate($params); // fungsi untuk generate QR CODE

                $this->mahasiswa_model->simpan_mahasiswa($nim,$nama,$prodi,$image_name); //simpan ke database
                redirect('mahasiswa'); //redirect ke mahasiswa usai simpan data
        }
}

Pada controller Mahasiswa terdapat tiga function. Yaitu function __construct(), function index(), dan function simpan().

Function __construct() berfungsi sebagai konstruktor.

Function index() berfungsi untuk menampilkan view dengan nama mahasiswa_view sekaligus membawa data mahasiswa yang disimpan dalam benruk array.

Function simpan() berfungsi untuk menyimpan data mahasiswa yang baru kedalam database sekaligus membuat NIM (Nomor Induk Mahasiswa) kedalam bentuk QR CODE.

 

#7. VIEW

Buat sebuah view dengan nama mahasiswa_view.php dengan kode sebagai berikut:

<!DOCTYPE html>
<html>
<head>
        <title>Data Mahasiswa</title>
        <link rel="stylesheet" type="text/css" href="<?php echo base_url().'assets/css/bootstrap.css'?>">
</head>
<body>
        <div class="container">
                <div class="row">
                        <h2>Data <small>Mahasiswa</small></h2>
                        <button type="button" class="btn btn-success" data-toggle="modal" data-target="#myModal">Add New</button>
                        <table class="table table-striped">
                                <thead>
                                        <tr>
                                                <th>NIM</th>
                                                <th>NAMA</th>
                                                <th>PRODI</th>
                                                <th>QR CODE</th>
                                        </tr>
                                </thead>
                                <tbody>
                                        <?php foreach($data->result() as $row):?>
                                        <tr>
                                                <td style="vertical-align: middle;"><?php echo $row->nim;?></td>
                                                <td style="vertical-align: middle;"><?php echo $row->nama;?></td>
                                                <td style="vertical-align: middle;"><?php echo $row->prodi;?></td>
                                                <td><img style="width: 100px;" src="<?php echo base_url().'assets/images/'.$row->qr_code;?>"></td>
                                        </tr>
                                        <?php endforeach;?>
                                </tbody>
                        </table>
                </div>
        </div>

        <!-- Modal add new mahasiswa-->
        <form action="<?php echo base_url().'index.php/mahasiswa/simpan'?>" method="post">
                <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                  <div class="modal-dialog" role="document">
                    <div class="modal-content">
                      <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">Add New Mahasiswa</h4>
                      </div>
                      <div class="modal-body">
                    
                          <div class="form-group">
                            <label for="nim" class="control-label">NIM:</label>
                            <input type="text" name="nim" class="form-control" id="nim">
                          </div>
                          <div class="form-group">
                            <label for="nama" class="control-label">NAMA:</label>
                            <input type="text" name="nama" class="form-control" id="nama">
                          </div>
                          <div class="form-group">
                            <label for="prodi" class="control-label">PRODI:</label>
                            <select name="prodi" class="form-control" id="prodi">
                                <option>Sistem Informasi</option>
                                <option>Sistem Komputer</option>
                                <option>Manajemen Informatika</option>
                            </select>
                          </div>
                
                      </div>
                      <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Tutup</button>
                        <button type="submit" class="btn btn-primary">Simpan</button>
                      </div>
                    </div>
                  </div>
                </div>
        </form>

        <script type="text/javascript" src="<?php echo base_url().'assets/js/jquery-2.1.4.min.js'?>"></script>
        <script type="text/javascript" src="<?php echo base_url().'assets/js/bootstrap.js'?>"></script>
</body>
</html>

 

Related: Tutorial Lengkap CodeIgniter 4 Untuk Pemula

#8. SELESAI

Silahkan buka browser anda dan jalan controller mahasiswa dengan mengunjungi url : http://localhost/qrcode/index.php/mahasiswa

Maka akan tampil seperti gambar berikut:

Klik tombol add new untuk menambah data mahasiswa.

Klik tombol simpan kemudian akan terlihat hasilnya seperti gambar berikut:

Booommm, kita telah berhasil membuat QR CODE dan NIM mahasiswa.

Dapatkan diskon 75% paket hosting dan gratis domain + extra diskon 5% dengan menggunakan kupon: MFIKRI

Order Sekarang.!

Dapatkan diskon 75% paket hosting dan gratis domain + extra diskon 5% dengan menggunakan kupon: MFIKRI

Order Sekarang.!
Download Source

Komentar (29)

ulfa khaira, 18 January 2018 21:00 - Reply

untuk membuat qrcode yg memuat data nim,nama, dan prodi bagaimana? terimakasih

M Fikri, 22 January 2018 16:59 - Reply

Tinggal dimainkan pada $params['data'] = "";
Contohnya:
$params['data'] = $nim.$nama.$prodi;

Nurul Huda, 01 March 2018 10:48 - Reply

cara menggabungkan script ini dengan ajax bagaimana master?

M NUH, 01 March 2018 21:29 - Reply

Mas mau tanya dong kalo data yang disimpan ke QR Code itu berupa JSON gimana ya? Tolong bantuannya ya. Terimakasih

syaiful, 24 March 2018 22:51 - Reply

mengapa bila ada karakter '#' barcodenya tidak ada/tidak tersimpan?

octaviani, 25 April 2018 14:58 - Reply

saya ikutin source code yang diatas,,dan library qrcode sudah, tapi masih masih error pada bagian tampilan qrcode nya, qrcodenya gg nampil,,dan pesan error nya "property of non-object" solusinya gimana ya mas

SEPTIAN ADI PUTRA, 04 May 2018 15:40 - Reply

MasyaAllah mantapp gan

Tuan Lana, 09 May 2018 09:27 - Reply

untuk buat scanner qrcode dan menampilkan data seperti diatas ketika qrcode di scan bagaimana ya mas ?

Wahyudi, 22 May 2018 07:36 - Reply

Manteb mas bro (y)

Johnf407, 04 June 2018 17:00 - Reply

Really informative article post.Thanks Again. Awesome. ekdaeedbddeb

Johnd583, 04 June 2018 17:00 - Reply

Neat blog! Is your theme custom made or did you download it from somewhere? A theme like yours with a few simple tweeks would really make my blog jump out. Please let me know where you got your design. Thanks ckbkaedkeceg

Johnk448, 04 June 2018 17:00 - Reply

Happy to become one of several customer for this wonder inspiring site D. eecfceckacga

Smithe628, 04 June 2018 17:01 - Reply

whoah this weblog is wonderful i really like studying your posts. Keep up the great paintings! You already know, lots of individuals are searching around for this information, you can help them greatly. eaacbeckdfcbfdek

Burhan Abdillah, 09 August 2018 14:30 - Reply

DIbuatkan sekalian tutorial buat scan barcode Qr menggunakan CI mas...,,? jadi selain buat aplikasi membuat QR dinamis, maka ada pula aplikasi scan barcode menggunakan kamera HP

Budi Purwanto, 13 August 2018 15:10 - Reply

Kalo pingin ada logo ditengahnya gimana ya? kayak punya line wa dll

Arrizal Pratama Shidiq, 29 August 2018 08:18 - Reply

bang, ini masih menerima tanya jawab gak hehe.. jadi kalo mau generate qr code tanpa save file ke server alias langsung output ke browser gimana nih suhu wkwk makasih

IRWAN TOTO, 30 January 2019 21:19 - Reply

MANTAP BANG. SANGAT MEMBANTU DALAM KERJA PRAKTEK SAYA DI KAMPUS

A. Rifai Kastela , 02 April 2019 13:23 - Reply

Mantp bang fikri...... Boleh nda saya minta bantuan bang fikri, semacam private dr bang fikri langsung. InsyAllah, saya akan penuhi permintaan utk biaya privatenya yg sesuai.

Gibson, 14 May 2019 08:34 - Reply

Sangat bermanfaat referensi nya, saya ingin nanya mas fikri bagaimana cara create lebih dari 1 qrcode dengan input lebih dari 1 nim, yg nantinya akan muncul lebih dari 1 qrcode juga

Zayd Hisyam, 16 May 2019 22:27 - Reply

keren mas fikri, terima kasih sharing ilmunya semoga bermanfaat. ngomong ngomong itu dari phpqrcode kan ya? file Ciqrcode.php nya buat sendiri kah?

Ahmad Farisi, 11 February 2021 18:20 - Reply

Terimakasih mas, sangat membantu

Dickson, 31 March 2021 18:47 - Reply

Keren mas!! ilmunya sangat bermanfaat

Arif Waznan, 27 April 2021 20:27 - Reply

Sangat bermanfaat tutorial nya mas

M. Almepal Wanda, 21 June 2021 08:57 - Reply

Bg gimana bikin qr code laporan pdf, pas di scan nanti dia keluar laporan PDF pencerahannya bg

Arief Mawardi, 30 July 2021 14:29 - Reply

Terima kasih, sangat membantu untuk belajar.

Mie Instan, 17 December 2021 00:50 - Reply

mas saya bingung untuk scanner qrcode .

Matthewalors, 22 December 2021 16:41 - Reply

Really enjoyed this post.Thanks Again. Really Cool.

Ridho, 04 June 2022 20:19 - Reply

Mas fikri izin fork dan clone repo nya yaaa. Terimakasih atas source code nya saya sangat terbantu

Leave a Comment