Membangun Website CRUD Menggunakan Java Server Faces dan MongoDB [1] Pengantar


 

MongoDB

MongoDB

 

Selamat datang di tutorial membangun website CRUD menggunakan Java Server Faces dan MongoDB. Pada artikel ini kita akan belajar membangun website CRUD (Create, Read, Update, Delete) menggunakan Java Server Faces dan sistem basis data MongoDB. Tutorial ini akan dibagi menjadi beberapa bagian, diantaranya :

  1. Pengantar
  2. Merancang Data Tier
  3. Merancang Logic Tier
  4. Merancang Presentation Tier
  5. Implementasi

Teknologi dan Alat yang Digunakan

Ada beberapa teknologi dan alat yang akan digunakan dalam tutorial ini, yaitu :

  • Java Server Faces 2
  • MongoDB 1.6.3
  • GlassFish Web Profile 3
  • Java Development Kit 1.6
  • NetBeans IDE 7

Basis Data Website

Website yang akan dibangun dalam tutorial ini adalah website CRUD, dimana objek CRUD tersebut adalah data Barang, dimana data Barang tersebut memiliki beberapa atribut seperti terlihat pada tabel dibawah ini :

Nama Atribut Tipe Data Keterangan
Kode Produk String Identitas unik produk
Nama Produk String Nama produk
Harga Produk Integer Harga jual produk
Tanggal Kadaluarsa Tanggal Tanggal yang menunjukkan waktu kadaluarsa produk

Halaman Website

Terdapat 5 halaman pada website yang akan dibuat, yaitu :

  • Halaman Daftar Produk, halaman ini menampilkan seluruh daftar produk yang ada pada sistem basis data MongoDB. Daftar produk ditampilkan dalam sebuah tabel, dan pada tabel tersebut terdapat sebuah kolom aksi yang digunakan untuk menampilkan link untuk mengubah, menghapus dan melihat detail produk pada baris tersebut. Selain itu pada bagian bawah tabel, terdapat link untuk membuat sebuah produk baru.
  • Halaman Detail Produk, halaman ini digunakan untuk menampilkan seluruh atribut produk. Pada bagian bawah terdapat link Kembali, Ubah dan Hapus. Link kembagi digunakan untuk kembali ke halaman Daftar Produk, link Ubah digunakan untuk mengubah data produk tersebut dan link Hapus digunakan untuk menghapus data produk tersebut.
  • Halaman Buat Produk, halaman ini digunakan untuk membuat produk baru. Halaman ini berisikan form masukkan data produk, pada bagian bawah produk terdapat dua tombol, Batal dan Simpan. Tombol Batal digunakan untuk membatalkan proses penambahan produk, jika tombol ini diklik maka akan kembali ke halaman Daftar Produk. Tombol Simpan digunakan untuk menyimpan data produk pada form masukkan, jika proses simpan selesai maka halaman Detail Produk akan ditampilkan.
  • Halaman Ubah Produk, halaman ini digunakan untuk mengubah data produk. Halaman ini berisikan form yang telah terisi dengan data produk yang akan diubah. Pada bagian bawah form, terdapat tombol Batal dan Simpan, tombol Batal digunakan untuk membatalkan proses pengubahan dan kembali ke halaman Daftar Produk, sedangkan tombol Simpan digunakan untuk mengubah data produk, jika berhasil halaman Detail Produk akan ditampilkan.
  • Halaman Hapus Produk, halaman ini digunakan untuk menghapus data produk. Halaman ini berisikan informasi produk yang akan dihapus, dimana pada bagian bawah informasi terdapat tombol Batal dan Hapus. Tombol Batal digunakan untuk membatalkan proses penghapusan dan kembali ke halaman Daftar Produk sedangkan tombol Hapus digunakan untuk menghapus data produk, jika proses penghapusan berhasil maka akan masuk ke halaman Daftar Produk.

Bersambung ke artikel selanjutnya…

Iklan

4 pemikiran pada “Membangun Website CRUD Menggunakan Java Server Faces dan MongoDB [1] Pengantar

  1. wow…kerennn…pake glassfish segala.
    sekalian di tambahin multi query dalam satu page si mas..
    coz aq sedang mempelajari untuk multi query untuk di tampilkan di satu page. jadi misal dalam satu page tu nampilin data/tabel Detail Produk dan di bawahnya ada data/tabel Tanggal Kadaluarsa yang mendekati(beda tabel/form).
    terima kasih sebelumnya mas..

  2. mas eko.. gimana caranya membuat menu yang auto centered.. kan kita buat menunya kayak program ebook library.. nah gimana menu-menu ini supaya bisa pas di maksimalkan windownya tetep posisi menu ini di tengah.. terimahaksih sebelumnya mohon pencerahannya..!!

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s