Category: Programming

CategoriesData SciencePython

Memaksimalkan Analisis Data dengan PandasAI dan LLM Lokal Menggunakan Ollama

Posted on 22 September 2024by Andhika K Aufa

Hai! 😊 Kali ini kita akan bahas topik menarik lainnya yang mungkin bisa bikin kerjaan kamu lebih mudah dan efisien dalam dunia data. Kalau kamu suka artikel tentang AI, data, dan integrasi teknologi, kamu ada di tempat yang tepat! Jadi, yuk simak artikel ini!

Banyak pengguna AI masih bergantung pada layanan cloud untuk analisis data, yang bikin privasi jadi isu karena data harus dikirim ke server eksternal. Belum lagi, biaya langganan layanan cloud AI bisa cukup mahal.

Nah, di sinilah local LLM dan PandasAI jadi solusi. Dengan local LLM, semua pemrosesan data dilakukan di perangkatmu, jadi nggak perlu khawatir soal privasi dan bisa hemat biaya karena nggak perlu langganan bulanan. PandasAI juga bikin analisis data lebih mudah karena kamu bisa langsung bertanya ke data tanpa perlu coding rumit. Yuk, kita bahas lebih lanjut!

Continue reading
CategoriesProgrammingUncategorized

Optical Character Recognition (OCR)

Posted on 11 September 2024by Meyfi Manda

Pengenalan & Implementasi Sederhana

Optical Character Recognition (OCR) adalah teknologi yang memungkinkan perangkat keras atau perangkat lunak untuk mengenali teks yang terdapat pada gambar atau dokumen yang dipindai. Teknologi ini secara khusus digunakan untuk mengkonversi gambar teks yang dicetak atau ditulis tangan ke dalam format teks yang dapat diedit, dicari, dan dianalisis oleh komputer. OCR bekerja dengan memproses gambar yang mengandung teks, lalu menggunakan algoritma pengenalan pola untuk memetakan piksel-piksel dari gambar tersebut ke karakter yang sesuai.

Proses OCR umumnya melibatkan beberapa langkah utama:

  • Pemindaian Gambar: Gambar dari teks yang ingin diekstraksi dipindai menggunakan perangkat pemindai atau diambil menggunakan kamera kemudian diubah menjadi representasi digital (format gambar JPEG atau PNG).
  • Pra-pemrosesan: Gambar yang diperoleh kemudian diproses untuk meningkatkan kualitas teks, seperti pembersihan gambar, perbaikan kontras, penghilangan noise, dan penyesuaian skala abu-abu dan rotasi agar teks mudah dikenali.
  • Deteksi Karakter: Algoritma OCR mengidentifikasi blok-blok teks dalam gambar dan mulai mengenali karakter individu berdasarkan pola, bentuk, dan struktur huruf.
  • Pengubahan ke Teks Digital: Karakter yang dikenali diubah menjadi teks digital. Hasilnya kemudian dapat disimpan dalam format teks. Hasil pengenalan teks dapat memerlukan perbaikan manual, terutama jika terdapat kesalahan dalam pengenalan. Ini biasanya terjadi pada teks yang rumit atau font yang tidak umum.
Keuntungan
  • Efisiensi : Menghemat waktu dan tenaga dalam memproses dokumen secara manual.
  • Penyimpanan Digital : Memungkinkan penyimpanan dokumen fisik dalam bentuk digital, yang menghemat ruang fisik.
  • Aksesibilitas : Membantu dalam pengembangan teknologi aksesibilitas, seperti pembaca layar untuk tunanetra.
Tantangan
  • Kualitas Gambar : Menghemat waktu dan tenaga dalam memproses dokumen secara manual.
  • Bahasa dan Font Khusus : Memungkinkan penyimpanan dokumen fisik dalam bentuk digital, yang menghemat ruang fisik.
  • Kesesuaian dengan Layout Kompleks : Dokumen dengan tata letak yang rumit, seperti tabel atau multi-kolom, seringkali membutuhkan pengolahan manual tambahan untuk interpretasi yang benar.

Untuk mengimplementasikan Optical Character Recognition (OCR) dalam sebuah aplikasi, terdapat beberapa opsi teknologi dan layanan yang bisa digunakan, salah satunya Tesseract OCR. Tesseract adalah mesin OCR yang open source dan fleksibel, yang dapat dijalankan baik di sisi klien (client-side) melalui Tesseract.js untuk aplikasi berbasis web, maupun di sisi server (server-side). Kali ini kita akan membahas implementasi OCR yang sangat mudah dan sederhana terlebih dahulu dari sisi klien (client-side). 

Tesseract OCR dapat dijalankan di sisi klien menggunakan Tesseract.js, sebuah pustaka JavaScript yang memungkinkan pemrosesan pengenalan teks langsung di dalam browser tanpa perlu server. Ini adalah solusi yang ideal untuk aplikasi web yang ingin melakukan OCR secara langsung, mengurangi latensi, meningkatkan privasi (karena tidak perlu mengunggah gambar ke server), dan memberikan hasil secara real-time kepada user.

Hal pertama yang dilakukan adalah mendapatkan file Tesseract.js terlebih dahulu. file tersebut dapat didapatkan dengan beberapa cara yaitu include CDN di dalam project

				
					<script src="https://cdn.jsdelivr.net/npm/tesseract.js@4.0.2/dist/tesseract.min.js"></script>

atau bisa juga download atau clone dari GitHub Tesseract, atau dengan mengimpor dan menggunakannya setelah instalasi NPM tesseract selesai.

				
					npm install tesseract.js

Studi kasus kali ini adalah penggunaan OCR untuk membaca file KTP yang di upload. Berikut script JS yang digunakan

				
					<!-- SCRIPT JS -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="tesseract.js"></script>
<script>

	//JS Funct
	function ocr_teseract(elm, e){
		let reader = new FileReader();
      reader.onload = function (event) {
			  let files           = $(elm).get(0).files[0];
        let filename        = files.name;
        let data_from_file  = filename.split(".");
        let type_file       = $.trim(data_from_file[data_from_file.length - 1]);
        	
        Tesseract.recognize(files, "ind").then(({ data: { text } }) => {
          $('#hasil').html('<center><img decoding="async" src="'+event.target.result+'" width="100%" /></center><br><br>' + text);
        });
      }
		reader.readAsDataURL($(elm)[0].files[0]);
	}
	//end JS Funct
</script>
Hasil Output

Jika ingin hanya mendapatkan NIK saja maka bisa menambahkan code split dan replace seperti berikut :

				
					Tesseract.recognize(files, "ind").then(({ data: { text } }) => {
      let d_split = text.split('\n');
      $.each(d_split, function(i, item) {
        if(item.toUpperCase().includes('NIK')){
          $('#hasil').html('<center><img decoding="async" src="'+event.target.result+'" width="100%" /></center><br><br>' + item.replace('NIK', '').replace(' ', '').replace(':', ''));
        }
      });
    });
Hasil Output menampilkan NIK saja

Mudah sekali bukan pengimplementasian dari OCR menggunakan Tesseract.js. Penggunaan tesseract.js ini memiliki kelemahan pada pra-pemrosesan data yaitu hasil akan kurang atau bahkan tidak akurat ketika gambar yang diproses memiliki banyak noise, resolusi rendah, rotasi yang tidak benar dan mengaturan teks yang rumit. Berikut contoh jika gambar yang di upload memiliki rotasi yang tidak sesuai :

Hasil ketika rotasi gambar tidak sesuai

Bagaimana ?? seru bukan mempelajari OCR ? xixixi •ᴗ•
Untuk next mari kita kulik-kulik mengenai OCR di sisi server-side yagesya ૮₍´˶• . • ⑅ ₎ა

CategoriesAndroidProgramming

Integrasi AI ke Aplikasi Mobile dengan ML Kit

Posted on 4 September 2024by Ahmad Saifur Ridlo

Dengan perkembangan teknologi yang pesat, machine learning (ML) telah menjadi salah satu tren utama dalam pengembangan aplikasi mobile. Google, melalui ML Kit, menyediakan solusi mudah dan efisien untuk mengintegrasikan fitur-fitur machine learning ke dalam aplikasi Android. ML Kit menawarkan berbagai API yang memungkinkan pengembang untuk mengimplementasikan fitur-fitur canggih seperti pengenalan wajah, pengenalan teks, pemindaian barcode, dan masih banyak lagi tanpa perlu pengetahuan mendalam tentang machine learning.

Continue reading

CategoriesAndroidFlutteriOSProgramming

Reactive Programming di Dart dengan Stream

Posted on 24 April 2024by Ahmad Saifur Ridlo

Stream di Dart adalah aliran berkelanjutan dari data yang mengalir dari satu sumber ke sumber lainnya. Dalam konteks Flutter, stream digunakan untuk mengelola aliran data asynchronous, memungkinkan aplikasi untuk merespons perubahan data secara dinamis tanpa memblokir main thread. Stream cocok digunakan untuk sebuah operasi yang membutuhkan update data secara terus menerus seperti contoh pemutaran suara yang mengupdate durasi setiap detik nya. dengan kata lain Stream adalah salah satu implementasi dari Reactive Programming di Flutter yang mana terdapat variable yang digunakan untuk mengirimkan data dan ada variabel yang menerima data sebagai Subscriber

Continue reading
CategoriesAndroidFlutteriOSProgramming

Meningkatkan Responsivitas Aplikasi Flutter dengan ValueNotifier dan ValueListenableBuilder

Posted on 24 April 2024by Ahmad Saifur Ridlo

Flutter telah menjadi pilihan utama untuk pengembangan aplikasi cross platform untuk saat ini. Salah satu tantangan dalam pengembangan aplikasi Flutter adalah menjaga responsivitasnya, terutama saat data berubah. Dalam artikel ini, kami akan membahas penggunaan ValueNotifier dan ValueListenableBuilder dalam Flutter untuk meningkatkan responsivitas aplikasi tanpa tambahan package lainnya, serta membandingkannya dengan metode setState.

Continue reading
CategoriesAndroidFlutteriOSProgrammingUncategorized

Implementasi Deep Link di Flutter

Posted on 21 December 2023by Ahmad Saifur Ridlo

Pernahkah kalian mengklik suatu link pada Smartphone kalian tapi link tersebut tidak mengarah ke browser melainkan mengarah ke suatu aplikasi ?
hal itu dinamakan Deep Link. Deep Link adalah sebuah hyperlink yang akan mengarahkan user ke sebuah fitur di pada aplikasi. biasanya Deep Link dimanfaatkan untuk link referral, link detail produk, dan banyak fungsi lainnya.

Continue reading
CategoriesAndroidFlutteriOSProgramming

Threading di Flutter dengan Isolate

Posted on 23 November 2023by Ahmad Saifur Ridlo

Pernahkan device kalian terasa berat atau mungkin sampai aplikasinya not responding saat menjalankan suatu method atau function dari kodingan flutter kalian ? kenapa bisa terasa berat padahal sudah dijalankan menggunakan async/await ? itu karena async/await berjalan di thread utama yang bertugas untuk memproses UI / Tampilan atau bisa disebut dengan UI Thread. jika method/function yang membutuhkan waktu lama untuk diproses dijalankan di UI Thread akan menyebabkan Not Responding. biasanya method/function yang berhubungan dengan ImageProcessing yang membutuhkan waktu lama untuk memproses. solusinya agar tidak Not Responding adalah memproses method/function tersebut di Thread lain agar tidak mengganggu UI Thread. salah satu metode Threading di Flutter adalah menggunakan Isolate.

Continue reading
CategoriesAndroidFlutteriOSProgrammingSwift

Berkenalan dengan Sealed Class

Posted on 22 November 2023by Ahmad Saifur Ridlo

Perkembangan bahasa pemrograman semakin memudahkan programmer untuk membuat Aplikasi. semakin banyak metode yang membantu meningkatkan efisiensi dan makin memudahkan dalam Maintenance Aplikasi. salah satu hasil perkembangan tersebut adalah “Sealed Class”.

Sealed Class adalah class yang semua turunannya harus di definisikan di dalam class tersebut. jadi tidak boleh menurunkan class tersebut di luar dari sealed class yang dibuat.

Continue reading
CategoriesInternetJavascriptLaravelProgramming

WAF Sebagai Proteksi Terhadap Serangan XSS pada Aplikasi Web

Posted on 23 September 2023by rozin

Serangan XSS (Cross-Site Scripting) pada aplikasi web merupakan salah satu serangan yang paling sering terjadi. Tipe serangan ini berbentuk injeksi pada code melalui form atau inputan yang disediakan oleh website dan dapat diakses oleh khalayak umum. Akibatnya jika tidak ditangani, penyerang bisa saja menempelkan script yang bertujuan untuk mengganggu pengguna, mengakses cookies, session tokens, atau bahkan informasi sensitif yang hanya bisa diakses oleh pemilik website saja.

Beberapa cara untuk menangani serangan XSS salah satu yang paling sederhana adalah memberikan validasi baik di frontend maupun backend pada inputan user. Namun untuk beberapa organisasi, hal itu dianggap tidak cukup sehingga mereka menambahkan juga proteksi XSS yang disediakan pihak provider domain / hosting.

Continue reading