9
BAB III
METODOLOGI
3.1 Flowchart Sistem
Berikut tampilan flowchart sistem dari skripsi ini:
Gambar 3.1 Flowchart Sistem
Mulai Login Mencari Lowongan Pekerjaan Metode Spelling Correction Pilihan Lowongan Pekerjaan Informasi Lowongan Pekerjaan Pilih Lowongan Pekerjaan? Selesai Tidak Iya Input Kata Apakah kata yang diinputkan sudah benar? Metode Autocomplete S. Tidak Iya Database Admin
10 Proses cara kerja mengenai alur pencarian lowongan pekerjaan. Dimana ketika ingin mencari informasi lowongan pekerjaan maka alurnya harus login terlebih dahulu, jika belum punya akun diharuskan untuk mendaftar setelah selesai mendaftar secara otomatis akun tersebut akan tersimpan di database, kemudian setelah mendaftar user langsung masuk ke tampilan beranda aplikasi dimana user bisa mencari informasi lowongan pekerjaan yang disediakan oleh admin. Jika ingin mencari lowongan pekerjaan harus meng-input-kan kata kunci dalam tabel pencarian dan secara otomatis sistem autocomplete suggest akan berjalan, yang sebelum itu admin telah memberikan informasi-informasi lowongan pekerjaan dari database, meskipun input-an kata salah selama kata tersebut pelafalanya mirip yang ada dalam database maka sistem akan membenarkan kata yang salah melalui metode spelling correction setelah itu akan ditampilkan rekomendasi lowongan pekerjaan, dan jika input-an kata yang dimasukkan benar maka langsung ditampilkan lowongan pekerjaan yang diinginkan, selanjutnya akan ada informasi-informasi dalam pekerjaan dengan memencet lowongan pekerjaan tersebut dan selesai. Dalam sistem ini user hanya bisa mencari lowongan pekerjaan di aplikasi android yang hanya disediakan oleh admin melalui database.
3.2 Usecase Sistem
Pada gambar 3.2 bawah ini menjelaskan alur dari user saat menggunakan aplikasi dan pemberian informasi lowongan kerja dari
admin. Pertama admin harus meng-input-kan informasi lowongan
pekerjaan melalui database yang kemudian akan ditampilkan dalam aplikasi lowongan pekerjaan. Sesudah itu user harus login terlebih dahulu jika belum punya maka akan dialihkan ke form pendaftaran. Setelah login masuklah ke menu aplikasi utama yaitu menu untuk mencari lowongan pekerjaan. Ketika ingin mencari lowongan pekerjaan di menu tersebut user dapat mencari di kolom pencarian setelah dapat lowongan pekerjaan yang diinginkan maka akan masuk ke dalam informasi tentang lowongan pekerjaan tersebut.
11 Login Form Pendaftaran Mencari Lowongan Pekerjaan Melihat Informasi Lowongan Pekerjaan <<include>> User Database Admin <<include>> Admin
Gambar 3.2 Usecase Sistem
3.3 Database
Pada Gambar 3.3 dibawah ini menjelaskan alur penggunaan dari admin. Dimana admin bisa membuat, melihat dan menghapus lowongan pekerjaan melalui database dalam tabel list lowongan pekerjaan. Sekaligus admin juga bisa membuat, melihat dan menghapus user melalui database dalam tabel user.
DATABASE ADMIN
TABEL USER TABEL LIST LOKER
MEMBUAT USER MELIHAT USER MENGHAPUS USER MEMBUAT LOWONGAN PEKERJAAN MELIHAT LOWONGAN PEKERJAAN MENGHAPUS LOWONGAN PEKERJAAN NO ID USER USERNAME PASSWORD USER NAMA LENGKAP USER
USIA IJAZAH EMAIL USER NO TELEPON USER NO ID LOKER JUDUL LOKER DESKRIPSI LOKER NAMA PERUSAHAAN NAMA KOTA TANGGAL TERBIT LOKER
TANGGAL BERAKHIR IJAZAH USIA MINIMAL USIA MAXIMAL
12
3.4 Cara Kerja Autocomplete Suggest
Fitur autocomplete suggest yang bertujuan untuk memberikan prediksi pada pengguna ketika mengenikan kata dalam tabel pencarian. Jadi didalam aplikisi ini akan muncul seperti gambar dibawah ini.
Sal
Sales executive Sales enginner Sales manager Sales marketing
Gambar 3.4 Cara Kerja Dari Proses Autocomplete
Fitur ini membantu user untuk mencari kata selanjutnya yang akan di-input-kan.
3.5 Cara Kerja Spelling Correction
Spelling Correction yang bertujuan untuk memperbaiki ejaan yang
salah pada kolom pencarian. Contoh Spelling Correction yang akan digunakan dengan metode SOUNDS LIKE dimana ketika user meng-input-kan kata yang ameng-input-kan dicari kemudian ketika diucapmeng-input-kan dengan bahasa inggris mirip dengan data yang ada didalam database maka akan ditampilkan.
Disen
Design CV.Green Red Blue
………. Malang
Design CV.Batik Malang
………. Kepanjen
Design PT.Mano Site
………. Surabaya
13
3.6 Design Sistem
Dalam subab ini menggambarkan tentang tampilan-tampilan yang akan dibuat. Seperti tampilan tentang menu login, menu pendaftaran, menu utama dan menu deskripsi lowongan pekerjaan.
Gambar 3.6 Tampilan Login
Pada gambar 3.6 diatas merupakan tampilan bahwasanya user diharuskan untuk login terlebih dahulu. Jika sudah memiliki akun lowongan pekerjaan maka bisa langsung mengisi Username dan password kemudian
Login, jika belum maka masuk ke Register.
Gambar 3.7 Tampilan Register
Pada gambar 3.7 ini merupakan tampilan ketika user mendaftar ke aplikasi, daftar manual dengan mingisi Username, Password, Nama lengkap, Alamat e-mail dan No. Telepon kemudian Umur dan Ijazah sebagai fitur tambahan agar user mudah mencari lowongan pekerjaan sesuai
range umur dan ijazah. Setelah itu tekan Register untuk mendaftar dan akan
masuk ke menu utama yakni pencarian tentang lowongan pekerjaan seperti gambar berikut. Username Password Login Register Username Password Nama Lengkap E-mail No Telepon Umur Ijazah Register
14
Des
Design CV.Green Red Blue
27-08-2021 Malang
Design CV.Batik Malang
(tanggal berakhir) Kepanjen Design PT.Mano Site
………. Surabaya
Gambar 3.8 Tampilan Menu Utama
Pada gambar 3.8 ini user bisa mencari pekerjaan dari kotak pencarian yang dilengkapi fitur autocomplete suggest dan spelling
corection. User dapat mencari lowongan pekerjaan yang diinginkan
dimulai dari lowongan pekerjaan yang akan berakhir, terdapat juga informasi-informasi tentang jenis pekerjaan, nama perusahaan, kota bahkan tanggal berakhirnya (deadline) lowongan itu dibuat. Jika
User telah sesuai yang diinginkan ketika di klik atau masuk kedalam
informasi lowongan pekerjaan akan terdapat informasi lengkap seperti gambar berikut.
Desaign close
Kepanjen
PT. Batik Malang Syarat dan Ketentuan ....
....
Batas Pengiriman Sampai Tanggal ...
Gambar 3.9 Tampilan Deskripsi Lowongan Pekerjaan
Pada gambar 3.9 ini memperlihatkan deskripsi mengenai persyaratan pekerjaan dalam informasi lowongan pekerjaan terdapat juga judul lowongan pekerjaan, nama kota dan nama perusahaan. Seperti itulah gambaran / tampilan tentang User yang penulis buat.
15
3.7 ERD (Entity Relationship Diagram)
Dalam subab ini menggambarkan alur ERD dari sistem. Dimana alur pemodelan basisdata ini Admin dapat membuat lowongan pekerjaan sekaligus dapat merubah dan menghapus, juga dapat membuat User serta menghapus dan merubahnya hanya bisa dilakukan Admin melalui database. Dan disini untuk mengakses sebagai admin harus melalui webrowser
PHPmyadmin sedangkan User hanya bisa mendaftar dan masuk untuk
melihat informasi lowongan pekerjaan melalui aplikasi Lowongan Pekerjaan. Admin User Informasi Lowongan Pekerjaan idUser Username Password Email NoHp NamaLengkap idLoker JudulLoker nm_perusahaan nm_kota DescLoker TglTambah Membuat, Melihat, Menghapus Melihat Membuat, Melihat, Menghapus Umur Ijazah TglBerakhir Ijazah TargetUmur MaxTargetUmur
Gambar 3.10 Tampilan ERD Sistem
Pada gambar 3.10 diatas merupakan tampilan dari ERD, yang terdapat 3 Entitas, 3 Relasi dan 18 Atribut yakni Entitas Admin, User dan Informasi Lowongan Pekerjaan, 2 Relasi membuat, merubah dan menghapus masing-masing dari admin ke user dan informasi lowongan pekerjaan dan 1 Relasi dari user untuk melihat informasi lowongan
16 pekerjaan, kemudian untuk Atribut di Entitas Informasi Lowongan Pekerjaan ada idLoker, JudulLoker, DescLoker(isi), nm_perusahaan, nm_kota, TglTambah, TglBerakhir, Ijazah, TargetUmur dan MaxTargetUmur. Sedangkan Atribut untuk Entitas User ada idUser,
Username, Password, NamaLengkap, Umur, Ijazah, Email dan NoHp. 3.8 Rancangan Perangkat Lunak
Langkah demi langkah perancangan program pembuatan aplikasi lowongan pekerjaan dengan mengimplementasikan Autocomplete Suggest dan Spelling Corecction berbasis Android.
Proses pertama pembuatan program yaitu tentang server dan
Database sebagai penyimpanan data. Disini penulis menggunakan Software Xampp yang kemudian mengaktifkan Apache sebagai server dan MySQL
untuk penyedia penyimpanan data (database) yang nantinya akan dioperasikan oleh Admin.
3.8.1 Database
Kemudian masuk ke Admin MySQL untuk pembuatan database sebagai penyimpanan data-data dari User dan informasi lowongan pekerjaan nantinya akan masuk ke phpMyAdmin.
Setelah itu buatlah database baru dan tabel atau subfolder masing-masing untuk data user dan lowongan pekerjaan.
Gambar 3.11 Tampilan tabel listloker dan user
Setelah itu membuat kolom-kolom data yang akan dimasukan dalam tabel lowongan pekerjaan seperti id loker, judul loker, nama
17 perusahaan, nama kota, deskripsi loker, tanggal pembuatan loker, tanggal berakhirnya loker, ijazah, target umur dan max target umur.
Gambar 3.12 Tampilan tabel pembuatan lowongan pekerjaan
Selanjutnya pembuatan kolom untuk menyimpan data-data user yang didalamnya berisi tentang id user, username, nama lengkap, ijazah, umur, email, password dan no telepon.
Gambar 3.13 Tampilan Tabel Pembuatan User
Dengan begitu proses perancangan pembuatan database selesai.
3.8.2 Aplikasi
Pembuatan Interfaces menggunakan software Visual Studio Code dimana tempat pengodingan telah di install framework ionic melalui CMD Node.Js, jadi harus menginstall Software Node.Js terlebih dahulu kemudian install framework ionic.
18 Selanjutnya setelah membuka Software CMD Node.js lakukanlah instalasi framework ionic dengan mengetikan “npm install –g
@ionic/cli” di dalam direktori proyek.
Gambar 3.14 Tampilan Instalasi Farmework IONIC
Instal juga codova sebagai bahan building ketika aplikasi telah selesai dibuat.
Gambar 3.15 Tampilan Instalasi Cordova
Kemudian buat tampilan dasar atau pondasi aplikasi dengan mengetikan “ionic start myApp blank(jenis tampilan)” di CMD Node.js.
19 Gambar 3.16 Tampilan Pembuatan framework
Pada gambar 3.16 di atas merupakan tampilan proses pembuatan dasar tampilan aplikasi dan pilih framework dengan bahasa Angular. Setelah pembuatan selesai buat tampilan-tampilan yang akan di masuki
user, seperti tampilan Login, Pendaftaran, Beranda dan Deskripsi
Lowongan pekerjaan.
Selanjutnya masuk kedalam software Visual Studio Code, open menggunakan folder proyek (ayo-kerjo-ker) dan mulai pembuatan aplikasi untuk user.
Lampiran A Script Login.
Masuk di “src\app\login” dan isi script seperti data diatas untuk tampilan Login dan fungsi-fungsi tombol seperti kolom username dan password, captcha dan tombol login, register.
Lampiran B Script Register.
Selanjutnya masuk di “src\app\register” dan isi script seperti data diatas untuk tampilan Register dan fungsi-fungis kolom pendaftaran seperti
20 Lampiran C Script Home.
Kemudian masuk di “src\app\home” isi script seperti data diatas untuk tampilan Beranda. Dimana ini adalah tampilan utama dari aplikasi tempat pencarian lowongan pekerjaan. Terdapat banyak script seperti tampilan header, kalimat selamat datang, kolom mesin pencarian, list lowongan pekerjaan dari pembuatan yang terbaru sampai yang terlama, informasi-informasi singkat judul lowongan pekerjaan, tanggal tambah, nama perusahaan dan nama kota.
Lampiran D Script Deskripsi.
Menu yang terakhir yaitu deskrpisi masuk di “src\app\desc” isi script seperti data diatas untuk tampilan Deskripsi.
<ion-toolbar>
<ion-searchbar[(ngModel)]="searchInput" [showCancelButton]=
"shouldShowCancel" (ionInput)="onSearch($event)" (ionCancel)= "onBatal($event)">
</ion-searchbar>
</ion-toolbar>
Tambahkan pula di “../home.page.html” sebuah fungsi toolbar pencarian seperti diatas didalam header untuk memfungsikan metode
autocomplete suggest.
functiongetListSound($param) {
if (strlen($param) >= 1) {
$sql = "SELECT * FROM `listloker` WHERE TglTambah BETWEEN CURRENT_DATE - INTERV AL 30DAYANDDATE(NOW()) AND JudulLoker SOUNDS LIKE '%" . urldecode($param) . "%' OR n m_perusahaan SOUNDS LIKE '%" . urldecode($param) . "%' OR nm_kota SOUNDS LIKE '%" . urldeco de($param) . "%' ORDER BY TglTambah DESC ";
$query = $this->db->query($sql); } else {
$sql = "SELECT * FROM `listloker` WHERE TglTambah BETWEEN CURRENT_DATE - INTERV AL 30DAYANDDATE(NOW()) ORDER BY TglTambah DESC";
$query = $this->db->query($sql); }
if ($query->num_rows() > 0) { return$query->result(); } else {
21
returnfalse; }
}
Untuk mengaktifkan metode spelling correction menggunakan SOUNDS LIKE atau kata yang mirip dengan yang ada database buat perintah di “xampp/htdocs/ayo-kerjo-ker/application/models/M_api.php”, dengan membuat fungsi “getListSound” dan memberi tindakan jika pencarian judul lowongan pekerjaan, nama perusahaan dan nama kota mirip dengan yang ada didalam database maka akan ditampilkan, jika tidak mirip maka salah atau data tidak ada. Dengan begitu pembuatan aplikasi selesai.
