Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir

Hasil gambar untuk Framework CI wallpaper

Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir –  Framework adalah sebuah software untuk memudahkan para programmer untuk membuat sebuah aplikasi web yang di dalam nya ada berbagai fungsi diantaranya plugin, dan konsep untuk membentuk suatu sistem tertentu agar tersusun dan tersetruktur dengan rapih.


Framework Yang cocok untuk membuat web aplikasi kasir ialah framework CodeIgniter yang biasa kita singkat dengan CI.  Sekarang kita Persiapan Dalam Rangka Pembuatan Aplikasi Web Kasirnya.



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
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 1
·         Klik Start Apache dan Mysql
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 2
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
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 3
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
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 4
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_userkode_barangjam 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
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 5
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 6
(File disimpan di xampp/htdocs/TugasBesar/application/controllers)
Login.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 7

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

Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 8
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 9



(File disimpan di xampp/htdocs/TugasBesar/application/models)
aksi_login.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 10

(File disimpan di xampp/htdocs/TugasBesar/application/views)
aksi_login.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 11


Tampilan Form Login
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 12
(File disimpan di xampp/htdocs/TugasBesar/application/controllers)


Home.php


Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 13
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 14


(File disimpan di xampp/htdocs/TugasBesar/application/views)
index.php
 Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 15

 Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 16
 Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 17

Tampilan Home
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 18

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


Kasir_Model.php

Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 19



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

Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 20
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 21



(File disimpan di xampp/htdocs/TugasBesar/application/views/barang)
tampil.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 22
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 23


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

Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 24



(File disimpan di xampp/htdocs/TugasBesar/application/views/barang)
ubah.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 25

Tampilan barang
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 26

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


Penjualan_Model.php

Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 27



(File disimpan di xampp/htdocs/TugasBesar/application/controllers)
Penjualan.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 28Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 29

(File disimpan di xampp/htdocs/TugasBesar/application/views/transaksi)
tampil.php
 Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 30

 Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 31

  
Tampilan Penjualan
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 32

(File disimpan di xampp/htdocs/TugasBesar/application/models)
Transaksi_Model.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 33
                Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 34

(File disimpan di xampp/htdocs/TugasBesar/application/controllers)
Transaksi.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 35
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 36
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 37
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 38
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 39
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 40

(File disimpan di xampp/htdocs/TugasBesar/application/views/transaksi)
tambah.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 41
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 42
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 43
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 44
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 45
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 46
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 47
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 48
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 49

Tampilan Transaksi
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 50

(File disimpan di xampp/htdocs/TugasBesar/application/views)
template.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 51
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 52

(File disimpan di xampp/htdocs/TugasBesar/application/views)
header.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 53

(File disimpan di xampp/htdocs/TugasBesar/application/views)
footer.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 54

(File disimpan di xampp/htdocs/TugasBesar/application/views)
content.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 55

(File disimpan di xampp/htdocs/TugasBesar/application/views)
navbar.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 56

(File disimpan di xampp/htdocs/TugasBesar/application/views)
sidebar.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 57

(File disimpan di xampp/htdocs/TugasBesar/application/models)
Laporan_Model.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 58

(File disimpan di xampp/htdocs/TugasBesar/application/controllers)
Laporan.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 59
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 60
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 61

(File disimpan di xampp/htdocs/TugasBesar/application/views/laporan)
penjualan.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 62
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 63

Tampilan tampilkan laporan
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 64



(File disimpan di xampp/htdocs/TugasBesar/application/views/laporan)
Penjualan_pdf.php
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 65
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 66



Tampilan cetak laporan
Framework Rekomendasi Untuk Membuat Web Aplikasi Kasir 67

Leave a Reply

Your email address will not be published. Required fields are marked *