Modul Tutorial Pembuatan Aplikasi Kasir

-

 PERSIAPAN

1.      Mengaktifkan Server Web
      Server Web adalah sofware yang menjadi tulang belakang dari World Wide Web(www). Server web menunggu permintaan dari client yang menggunakan browser sepert modzila, chrom, Internet Explorer, Opera mini, dan browser lainnya. Jika ada permintaan dari browser, maka server web akan memproses pemintaan itu kemudian memberikan hasil prosesnya berupa data yang diinginkan kembali ke browser. Kami menggunakan software XAMPP. XAMPP adalah sebuah sofware free yang telah menggabungkan web server, PHP dan MySQL kedalam satu program. Sehingga ketika XAMPP digunakan, kita tdak perlu lagi menginstall PHP, MySQL dan Apache. Jika dikomputer anda belum ada XAMPP maka anda bisa mengakses http://www.apachefriends.org. Dan melakukan download sesuai dengan spesifkasi komputer anda, apakah itu Windows, Mac OS, atau Linux
·         Buka aplikasi XAMPP yang ada dikomputer anda
·         Maka muncul seperti gambar dibawah ini
·         Klik Start Apache dan Mysql
2.      Framework
      Pembuatan website di tugas besar ini kami menggunakan framework yaitu CodeIgniter, oleh karena itu kita harus mempersiapkan CodeIgniter. Jika belum ada anda bisa mengakses di http://www.codeigniter.com untuk mendownload framework codeigniternya.
·      Letakkan file yang telah di download pada folder C:/xampp/htdocs lalu extract file tersebut
·   Agar lebih mudah boleh mengganti nama folder codeigniternya contoh pada pembuatan web ini kami mengubah nama folder menjadi TugasBesar
·    Buka foldernya kemudian cari folder applicaton
·    Lihat tiga folder mvc yang ada: Models, Views, Controllers
MVC adalah teknik atau konsep yang memisahkan komponen utama menjadi tiga komponen yaitu model, view, dan controller
§  Model
Model merupakan bagian penangan yang berhubungan dengan pengolahan atau manipulasi database. Seperti mengambil data dari database, menginput dan pengolahan database lainnya. Semua intruksi yang berhubungan dengan pengolahan database di letakkan di dalam model.
§  View
View merupakan bagian yang menangani halaman user interface atau halaman yang muncul pada user. Tampilan dari user interface dikumpulkan pada view untuk memisahkannya dengan controller dan model sehingga memudahkan web design dalam melakukan pengembangan tampilan halaman website
§  Controller
Controller merupakan kumpulan intruksi aksi yang menghubungkan model dan view. Jadi, user tidak akan berhubungan dengan model secara langsung.
3.      Bootstrap
Bootstrap merupakan sebuah library framework CSS yang di buat khusus untuk bagian pengembangan front-end website. Bootstrap merupakan salah satu framework HTML, CSS dan JavaScript yang paling popular di kalangan web developer. Pada saat ini hamper semua web developer telah menggunakan bootstrap untuk membuat tampilan front-end menjadi lebih mudah dan sangat cepat, karena anda hanya perlu menambahkan class-class tertentu misalnya membuat tombol, grid, navigasi dan lainnya.
§  Download bootstrap
§  Buat sebuah folder baru dengan nama assets pada folder codeigniter tadi yang diberi nama TugasBesar(xampp/htdocs/TugasBesar)
§  Copy folder bootstrap yang anda download, lalu simpan di dalam folder assets yang tadi anda buat (xampp/htdocs/TugasBesar/assets).

4.      Html2pdf
Membuat laporan PDF, kebanyakan beberapa website bisnis atau e-commerce ada fitur mencetak laporan untuk mengevaluasi kinerja perusahaan kersebut. Saat ini sudah banyak pengembang pemograman website yang membuat plugin untuk membuat atau mencetak laporan pdf seperti Html2Pdf, Mpdf, Fpdf, dan lainnya. Pada tugas besar, kami menggunakan Html2Pdf sebagai plugin untuk membuat atau mencetak laporan pdfnya
Instalasi
§  Download plugin Html2Pdf. Pada tugas besar, kami menggunakan Html2Pdf v4.03
§  Jika belum ada folder assets di folder codeigniter, maka anda harus membuat sebuah folder baru dengan nama assets pada folder codeigniter tadi yang diberi nama TugasBesar(xampp/htdocs/TugasBesar)
§  Copy dan Ekstrak file Html2Pdf yang Anda download, lalu simpan di dalam folder assets yang tadi anda buat (xampp/htdocs/TugasBesar/assets).

5.      JQuery
JQuery merupakan suatu framework (library) JavaScript dan cara baru dalam menuliskan kode JavaScript. JavaScript sendiri adalah bahasa pemograman yang dapat bekerja di sebagian besar browser seperti Google Chrome, Mozilla Firefox, Safari, Internet Explorer, Opera mini dan lainnya. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag SCRIPT. JQuery digunakan untuk mempermudah cara penulisan library JavaScript sehingga dengan menggunakan JQuery kita dapat mempercepat perpindahan dokumen HTML, penanganan event (event handling), pembuatan animasi didalam web.

6.      Perancangan Entity Relationship Diagram
Penjelasan tentang diagram :
a.       Entitas             : user , barang
b.      Atribut            
·         user           : id_user, nama_user, username, password, level, Is_blokir
·         barang       : kode, nama, harga, stok, gambar
·         transaksi    : jam,  tanggal, jumlah, total
c.       Relationship    : transaksi
d.      Cardinality      : Many-to-Many
Relational Scheme
Karena Kardinaltas many-to-many maka relationship transaksi menjadi tabel baru dan mengambil primary key dari tabel yang terhubung dengannya seperti mengambil primary key dari tabel user yaitu id_user dan mengambil primary key dari tabel barang yaitu kode.

·         user           : id_user, nama_user, username, password, level, Is_blokir
·         barang       : kode, nama, harga, stok, gambar
·         transaksi    : id_user, kode_barang, jam,  tanggal, jumlah, total

7.      Perancangan Database

§  Nama Database : kasir
§  Nama Tabel
1. barang
2. transaksi
3. user
§  Struktur masing-masing tabel
1. barang
Field
Type
Null
Key
Default
Extra
kode
Varchar(10)
No
Primary Key
Null

nama
Varchar(50)
No

Null

harga
Int(11)
No

Null

stok
Int(11)
No

Null

gambar
Varchar(100)
Yes

Null

2. transaksi
Field
Type
Null
Key
Default
Extra
id_user
Int(11)
No
Primary Key
Null

tanggal
Date
No
Primary Key
Null

jam
Varchar(11)
No
Primary Key
Null

kodebarang
Varchar(10)
No
Primary Key
Null

jumlah
Int(11)
No

Null

total
Int(11)
No

Null

3. user
Field
Type
Null
Key
Default
Extra
id_user
Varchar(10)
No
Primary Key
0

nama_user
Varchar(100)
No

Null

username
Varchar(30)
No

Null

password
Varchar(50)
No

Null

level
Varchar(30)
No

Null

is_blokir
Varchar(10)
No

Null

8.      Langkah pembuatan aplikasi kasir
(File disimpan di xampp/htdocs/TugasBesar/application/models)
Login_model.php
(File disimpan di xampp/htdocs/TugasBesar/application/controllers)
Login.php

(File disimpan di xampp/htdocs/TugasBesar/application/views)
login_form.php



(File disimpan di xampp/htdocs/TugasBesar/application/models)
aksi_login.php

(File disimpan di xampp/htdocs/TugasBesar/application/views)
aksi_login.php

Tampilan Form Login
(File disimpan di xampp/htdocs/TugasBesar/application/controllers)

Home.php


(File disimpan di xampp/htdocs/TugasBesar/application/views)
index.php
 
 
 

Tampilan Home

(File disimpan di xampp/htdocs/TugasBesar/application/models)

Kasir_Model.php



(File disimpan di xampp/htdocs/TugasBesar/application/controllers)
Kasir.php



(File disimpan di xampp/htdocs/TugasBesar/application/views/barang)
tampil.php

  
(File disimpan di xampp/htdocs/TugasBesar/application/views/barang)
tambah.php



(File disimpan di xampp/htdocs/TugasBesar/application/views/barang)
ubah.php

Tampilan barang

(File disimpan di xampp/htdocs/TugasBesar/application/models)

Penjualan_Model.php



(File disimpan di xampp/htdocs/TugasBesar/application/controllers)
Penjualan.php

(File disimpan di xampp/htdocs/TugasBesar/application/views/transaksi)
tampil.php
 
 

  
Tampilan Penjualan

(File disimpan di xampp/htdocs/TugasBesar/application/models)
Transaksi_Model.php
                

(File disimpan di xampp/htdocs/TugasBesar/application/controllers)
Transaksi.php

(File disimpan di xampp/htdocs/TugasBesar/application/views/transaksi)
tambah.php

Tampilan Transaksi

(File disimpan di xampp/htdocs/TugasBesar/application/views)
template.php

(File disimpan di xampp/htdocs/TugasBesar/application/views)
header.php

(File disimpan di xampp/htdocs/TugasBesar/application/views)
footer.php

(File disimpan di xampp/htdocs/TugasBesar/application/views)
content.php

(File disimpan di xampp/htdocs/TugasBesar/application/views)
navbar.php

(File disimpan di xampp/htdocs/TugasBesar/application/views)
sidebar.php

(File disimpan di xampp/htdocs/TugasBesar/application/models)
Laporan_Model.php

(File disimpan di xampp/htdocs/TugasBesar/application/controllers)
Laporan.php

(File disimpan di xampp/htdocs/TugasBesar/application/views/laporan)
penjualan.php

Tampilan tampilkan laporan


(File disimpan di xampp/htdocs/TugasBesar/application/views/laporan)
Penjualan_pdf.php


Tampilan cetak laporan

Comments

Post a Comment

Popular posts from this blog

Soal pilihan ganda dan essay pemrograman web dan perangkat bergerak

-
Pilihan Ganda  1.        Web server antar platform yang dapat berjalan di beberapa platform seperti LINUX dan windows adalah... a.         Web route b.        Apache c.         Xampp d.        Web server e.         DHCP server 2.        Server yang dapat membuat sistem berbasis unix (seperti linux) untuk melakukan sharing resource dengan sistem berbasi windows adalah... a.         Apache b.        Samba c.         Squid d.        Squired e.         Proxy 3.      ...
Read more

SOAL PEMROGRAMAN BERORIENTASI OBJEK (PBO) kelas 12

-
Image
Bidang study : Pemrograman Berbasis Object Kelas/ prog : XII RPL Hari/ tgl : Waktu : Petunjuk ! Baca basmalah dulu sebelum mengerjakan soal ujian ! Baca dengan teliti soal yang diberi kan Jawablah soal-soal dengan benar di lembar jawaban! Pilihan Ganda 1. Apa developer java sekarang ? Sun microsystem     c. Mysql AB Oracle                        d. Microsoft 2. Apa nama tipe data dalam java yang berupa array of char int       c. char String d. byte 3. Apa nama tipe data pada java yang hanya memiliki dua output char     c . boolean String  d. double 4. Mana di bawah ini yang bukan merupakan tipe data dalam java String  c. varchar...
Read more

Soal PBO Pilihan Ganda dan Essay SMT 19

-
Soal Pilihan Ganda dan Essay kls 12 PBO (Pemograman Berorientasi Objek) A. Pilihan Ganda 1. Kumpulan dari method-method yang belum terdapat operasi di dalam tubuh method tersebut disebut ... a. Abstract class b. Inheritance c. Interface d. Method abstract e. Implements 2. Nama lain dari istilah pewarisan adalah ... a. Inheritance b. Interface c. Overriding d. Overloading e. Implements 3. Class yang mempunyai sedikitnya satu abstract metode disebut ... a. Abstract class b. Class c. Multiple interface d. Implementasi e. Interface 4. Class yang digunakan menggunakan array dan character disebut ... a. Class math b. Class string c. Class string buffer d. Class wrapper e. Class procces 5. Method yang menghasilkan nilai mutlak adalah ... a. Publik static double max (double a, b) b. Publik static double cell (double a) c. Publik static double abs (double a) d. Publik static double floor (double a) e. Publik static dou...
Read more