1 BAB II LANDASAN TEORI 2.1 Profil Perusahaan GAZE.inc Clothing Company Waroeng Badjoe merupakan outlet baru asal kota Medan yang memproduksi produk-produk fashion seperti t-shirts, celana, jaket, tas, dan lain sebagainya. Mempunyai konsep pop art, dan remaja sebagai target pasarnya. Adapun struktur organisasinya sebagai berikut: OWNER BENDAHARA ART DIRECTOR/ MARKETING SEKSI-SEKSI DESAINER Gambar 1.1 Struktur Organisasi 2.2 Pengenalan Perancangan Sistem Perancangan sistem merupakan suatu kebutuhan perangkat lunak yang akan dibuat dengan menggunakan prinsip tertentu sehingga rancangan dapat menjadi perangkat lunak yang siap pakai. 2.2.1 Flowchart Merupakan alat bantu yang digunakan untuk menerangkan logika program, berupa suatu bagan yang menjelaskan secara rinci langkah-langkah dari proses program. Bagan alir program dibuat dengan simbol-simbol standar sebagai berikut:
8 Tabel 2.1 Tabel Flowchart SIMBOL KETERANGAN Menujukkan dokumen input dan output baik proses manual, mekanik atau computer Menujukkan kegiatan manual Menujukkan kegiatan proses dari operasi komputer Penghubung kesatu halaman atau halaman lain. Menujukkan kegiatan pengarsipan Input/Output Symbol. Simbol Input/Output digunakan untuk menyatakan dan mewakili data masukan atau keluaran. Flow Lines Symbol. Simbol Garis Alir digunakan untuk menunjukkan aliran atau arus dari proses. 2.2.2 Data Flow Diagram (DFD) Data Flow Diagram adalah diagram untuk menggambarkan arus data didalam system terstruktur dan jelas yang dikembangkan secara logika. Data Flow Diagram sangat membantu sekali dalam berkomunikasi dengan pemakai system untuk memahami secara logika. Simbol dalam Data Flow Diagram adalah:
9 Tabel 2.1 Simbol Data Flow Diagram SIMBOL KETERANGAN Terminator merupakan sumber atau tujuan data Data Flow atau Arus Data menunjukan keluar atau masuk kesuatu Proses. Jadi sebagai alur data atau informasi dari suatu bagian kebagian lainnya dalam suatu sistem. Proses merupakan kegiatan yang dilakukan oleh orang,mesin, atau komputer dari hasil suatu arus data yang masuk kedalam proses, untuk dihasilkan arus data yang akan keluar dari proses Data Strore digunakan sebagai sarana untuk pengumpulan data. Data store juga diberi nama. 2.3 Database (basis data) 2.3.1 Pengertian Database Database adalah kumpulan data yang umumnya mendeskripsikan aktivitas satu organisasi yang berhubungan atau lebih. Tujuan dari desain database adalah untuk menentukan data-data yang dibutuhkan dalam sistem, sehingga informasi yang dihasilkan dapat terpenuhi. 2.3.2 ERD (Entity Relationship Diagram) Entity realtionship diagram adalah salah satu penyajian data dengan menggunakan entity dan relationship. Komponen utama ERD adalah :
10 Atribut Secara umum sifat atau karakteristik dari suatu enitas. Cardinality Dalam Entity Relationship Diagram terdapat tingkat hubungan antara hubungan yang satu dengan yang lain dilihat dari segi bahasa jumlah ketergatungan dalam suatu entity dengan entity lain, inilah yang dinamakan Cardinality. Ada tiga kemungkinan yang terjadi yaitu : Tabel 2.2 Cardinality One to One (1:1) Terjadi suatu hubungan yang hanya memiliki sebuah hubungan yang satu dengan yang lain. One To Many / Many To One (1:N/N:1) Terjadi apabila sebuah hubungan memiliki banyak hubungan atau banyak hubungan memiliki sebuah hubungan lain. Many To Many (N:N) Terjadi apabila banyak hubungan memiliki banyak hubungan. 1 1 1 n n n 2.4 Pemrograman Web 2.4.1 Client Side 2.4.1.1 Hyper Text Markup Language (HTML) HTML kependekan dari Hyper Text Markup Language. Dokuman HTML adalah file teks murni yang dapat dibiuat dengan editor teks sembarang. Dokumen ini dikenal sebagai web page. Dokumen HTML merupakan dokumen yang disajikan dalam browser web surfer. Dokumen ini umumnya berisi informasi atau interface aplikasi di dalam Internet.
11 HTML merupakan bahasa yang digunakan untuk menulis halaman web. Biasanya mempunyai ekstensi.htm,.html, atau.shtml. HTML tersusun atas tag-tag, digunakn untuk menetukan tampilan dari dokumen HTML yang ditejemahkan oleh browser. Tag HTML tidak case sentive, jadi bisa menggunakan <HTML> atau <html>. Keduanya menghasilkan output yang sama. HTML berawal dari bahasa SGML (Standard Generalize MarkUp Language) yang penulisannya disederhanakan. HTML dapat dibaca oleh berbagai macam platform. HTML juga merupakan bahasa pemrograman yang fleksibel, dapat disisipi atau digabungkan dengan bahasa pemrograman lain, seperti PHP, ASP, JSP, JavaScript, dan lainnya. Jika ada kesalahan pada penulisan HTML, browser tidak akan memperlihatkan syntax error, tetapi hanya tidak (Sidik dan Pohan 2009) menampilkannya. HTML terus berkembang seiring perkembangan browser. 2.4.1.2 Cascading Style Sheets CSS (Cascading Style Sheets) banyak digunakan untuk memperluas kemampuan HTML dalam memformat dokumen atau untuk mepercantik tampilan web, bahkan untuk pemosisian dan layouting halaman web. Dengan mendefinisikan suatu style sakali saja itu akan dapat digunakan berulang kali. CSS telah didukung kebanyakan browser, terutama versi baru sehingga penempatan layout manjadi lebih fleksibel. Membuat HTML menggunakan tag minimal berpengaruh terhadap ukuran file, dapat menampilkan isi utama terlebih dahulu sementara gambar dan yang lain dapat ditampilkan sesudahnya. Selain itu penggunaan CSS pada file terpisah dapat mempermudah pengubahan tampilan situs secara keseluruhan. 2.4.1.3 JavaScript JavaScript mulanya bernama LiveScript, dikembangkan pertama kali tahun 1995 di Netscape Communication. Pada akhir tahun 1995 Netscape Communication dan Sun Microsistem berkolaborasi dan menggati nama LiveScript menjadi JavaScript. JavaScript adalah bahan skrip yang ditempatkan pada kode HTML dan diproses pada sisi klien. Dengan adanya bahasa ini maka kemampuan dokumen HTML menjdai labih luas. Sebagai contoh, digunakan untuk validasi masukan pada formulir sebelum diproses ke tahap selanjutnya. Bisa untuk membuat permainan interaktif dan juga bisa untuk menambah desain web.
12 2.4.1.4 Browser Browser merupakan tool yang berada di sisi client. Untuk mengakses web, diperlukan suatu program yang disebut web browser. Browser merupakan suatu program yang dirancang untuk mengambil informasi-informasi dari suatu server komputer pada jaringan internet. Informasi-informasi ini biasanya dikemas dalam page-page, dimana setiap page bisa memiliki beberapa link yang menghubungkan web page tersebut ke sumber informasi lainnya. 2.4.1.5 Website Website diartikan sebagai kumpulan halaman yang menampilkan informasi data teks, data gambar diam atau gerak, data animasi, suara, video, atau gabungan dari semuanya, baik yang bersifat statis maupun dinamis yang membentuk satu rangkaian bangunan yang saling terkait dimana masing-masing dihubungkan dengan jaringan-jaringan halaman (hyperlink). Bersifat statis apabila isi informasi website tetap, jarang berubah, dan isi informasinya searah hanya dari pemilik website. Bersifat dinamis apabila isi informasi website selalu berubahubah, dan isi informasinya interaktif dua arah berasal dari pemilik serta pengguna website. Contoh website statis yaitu profil perusahaan, sedangkan website dinamis seperti Facebook, Multiply, Twitter, dll. Dalam sisi pengembangannya, website statis hanya bisa diupdate oleh pemiliknya saja, sedangkan website dinamis bisa diupdate oleh pengguna maupun pemilik. 2.4.1.6 Adobe Dreamweaver Adobe Dreamweaver CS5 adalah editor HTML professional untuk merancang, mengodekan, dan mengembangkan website, halaman web, dan aplikasi web. Kita bisa melakukan secara manual untuk coding HTML ataupun mengerjakan dalam lingkungan editing visual. Dreamweaver menyediakan tool yang sangat menolong untuk meningkatkan pengalaman dalam menciptakan web. Visual editing feature di Dreamweaver memungkinkan kita dengan cepat menciptakan halaman tanpa menulis satupun baris kode. Kita dapat memandang semua asset atau unsurunsur lokasi dan menyeretnya dari suatu panel easy-to-use secara langsung ke dalam suatu dokumen. Kita dapat mengefektifkan workflow pengembangan dengan menciptakan dan mengedit gambar di dalam Firework atau aplikasi grafik yang lain, dan kemudian
13 mengimpornya secara langsung ke dalam Dreamweaver, atau dengan menambahkan objek Flash. Dreamweaver juga menyediakan lingkungan pengkodean penuh, meliputi code-editing tool (seperti kode mewarnai dan penyelesaian tag) dan material referensi pada HTML, Cascading Style Sheets (CSS), JavaScript, ColdFusion Markup Language (CFML), Microsoft Active Server Page (ASP), dan JavaServer Page (JSP). Teknologi Roudtrip HTML mengimpor dokumen HTML yang dikode secara manual tanpa reformating kode. Kita kemudian bisa memformat kembali kode itu dengan gaya pengaturan yang lebih disukai. Dreamweaver juga memungkinkan kita untuk membangun aplikasi web dinamis yang didukung database yang menggunakan teknologi server seperti CFML, ASP.NET, ASP, JSP, dan PHP. Dreamweaver secara penuh customizable. Kita dapat menciptakan objek dan perintah, meodifikasi shortcut keyboard, bahkan menuliskan kode JavaScript untuk memperluas kemampuan Dreamweaver dengan behavior baru, Property Inspector, dan Site (Prasetyo 2005) Report. 2.4.2 Server Side 2.4.2.1 Web Server Web server adalah software yang menjadi tulang belakang dari world wide web (www). Web server menunggu permintaan dari client yang menggunakan browser seperti Netscape Navigator, Internet Explorer, Modzilla, dan program browser lainnya. Jika ada permintaan dari browser, maka web server akan memproses permintaan itu kemudian memberikan hasil prosesnya berupa data yang diinginkan kembali ke browser. Data ini mempunyai format yang standar, disebut dengan format SGML (standar general markup language). Data yang berupa format ini kemudian akan ditampilkan oleh browser sesuai dengan kemampuan browser tersebut. Contohnya, bila data yang dikirim berupa gambar, browser yang hanya mampu menampilkan teks (misalnya lynx) tidak akan mampu menampilkan gambar tersebut, dan jika ada akan menampilkan alternatifnya saja. 2.4.2.2 Database Database adalah kumpulan dari item data yang saling berhubungan satu dengan yang lainnya yang diorganisasikan berdasarkan sebuah skema atau struktur tertentu, tersimpan di komputer dan dengan software untuk melakukan manipulasi untuk kegunaan tertentu.
14 Pada database yang memiliki struktur relasional. Ada tabel-tabel yang menyimpan data. Setiap tabel terdiri dari kolom dan baris. Sebuah kolom mendefinisikan jenis informasi apa yang akan disimpan. Setiap data memerlukan kolom khusus untuk setiap jenis informasi yang ingin disimpan (misalnya umur, tinggi, berat, alamat). Jika kolom mendefinisikan jenis informasi apa yang akan disimpan, maka sebuah baris adalah data aktual yang disimpan. Setiap baris dari tabel adalah masukan dari tabel tersebut dan berisi nilai-nilai untuk setiap kolom tabel tersebut. Database sangatlah diperlukan karena database salah satu komponen terpenting dalam sistem informasi, karena merupakan dasar dalam menyediakan informasi, database juga menentukan kualitas informasi seperti: akurat, tepat pada waktunya dan relevan. Informasi dapat dikatakan bernilai bila manfaatnya lebih efektif dibandingkan dengan biaya mendapatkannya, database dapat mengurangi duplikasi data (data redudancy) dan dengan database hubungan data dapat ditingkatkan (data relatability) dan dengan database juga akan mengurangi pemborosan tempat simpanan luar. 2.4.2.3 SQL SQL (dibaca "ess-que-el") singkatan dari Structured Query Language. SQL adalah bahasa yang digunakan untuk berkomunikasi dengan database. Menurut ANSI (American National Standards Institute), bahasa ini merupakan standard untuk relational database management sistem (RDBMS). Pernyataan-pernyataan SQL digunakan untuk melakukan beberapa tugas seperti: update data pada database, atau menampilkan data dari database. Beberapa software RDBMS dan dapat menggunakan SQL, seperti: Oracle, Sybase, Microsoft SQL Server, Microsoft Access, Ingres, dsb. Setiap software database mempunyai bahasa perintah/ sintaks yang berbeda, namun pada prinsipnya mempunyai arti dan fungsi yang sama. Perintah-perintah tersebut antara lain: "Select", "Insert", "Update", "Delete", "Create", dan "Drop", yang dapat digunakan untuk mengerjakan hampir semua kebutuhan untuk memanipulasi sebuah database. MySQL merupakan database yang paling digemari dikalangan Programmer Web, dengan alasan bahwa program ini merupakan database yang sangat kuat dan cukup stabil untuk digunakan sebagai media penyimpanan data. Sebagai sebuah database Server yang mampu untuk memanajemen database dengan baik, MySQL terhitung merupakan database yang paling digemari dan paling banyak digunakan dibanding database lainnya.
15 Di dalam dunia Internet, MySQL dijadikan sebagai sebuah database yang paling banyak digunakan selain database yang bersifat share ware seperti Ms Access, penggunaan MySQL ini biasanya dipadukan dengan menggunakan program aplikasi PHP, karena dengan menggunakan kedua program tersebut telah terbukti akan kehandalannya dalam menangani permintaan data (Nugroho 2004). Beberapa kelebihan MySQL antara lain : a. Free (bebas didownload) b. Stabil dan tangguh c. Fleksibel dengan berbagai pemrograman d. Security yang baik e. Dukungan dari banyak komunitas f. Kemudahan management database g. Mendukung transaksi h. Perkembangan software yang cukup cepat. 2.4.2.4 PHP Personal Home Page atau yang biasa disebut PHP (sekarang PHP: Hypertext Processor) adalah skrip yang dijalankan di sisi server. Jadi, konsepnya berbeda dengan JavaScript yang dijalankan pada sisi klien. Keuntungan penggunaan PHP, kode yang menyusun program tidak perlu dibagikan ke pemakai, yang berarti bahwa kerahasiaan kode dapat dilindungi. Secara khusus, PHP dirancang untuk membentuk web dinamis. Artinya, ia dapat membentuk suatu tampilan berdasarkan permintaan terkini. Misalnya, anda bisa menampilkan isi database ke halaman web. Pada prinsipnya, PHP mempunyai fungsi yang sama dengan skrip-skrip seperti ASP (Active Server Page), Cold Fusion, ataupun Perl. Hal menarik yang didukung oleh PHP tetapi tidak mungkin dilakukan oleh JavaScript adalah kenyataan bahwa PHP bisa digunakan untuk mengakses berbagai macam database seperti Access, Oracle, MySQL, dan lain-lain. Seperti halnya JavaScript, kode PHP dapat disisipkan pada kode HTML. Selain itu PHP juga bisa digunakan untuk menghasilkan kode- (Prasetyo 2005) kode HTML.
16 2.4.2.5 Apache Apache merupakan web server yang paling banyak dipergunakan di Internet. Program ini pertama kali didesain untuk sistem operasi lingkungan UNIX. Namun demikian, pada beberapa versi berikutnya Apache mengeluarkan programnya yang dapat dijalankan di Windows NT. (Kusworo 2010) Web server Apache ini mempunyai kelebihan antara lain: a. Apache termasuk dalam kategori freeware b. Apache mudah sekali proses instalasinya jika dibanding web server lainnya seperti NCSA, IIS, dan lain-lain c. Mampu beroperasi pada berbagai paltform sistem operasi d. Mudah mengatur konfigurasinya, Apache mempunyai hanya empat file konfigurasi e. Mudah dalam menambahkan peripheral lainnya ke dalam platform web servernya. 2.4.2.6 XAMPP Xampp merupakan tool yang menyediakan paket perangkat lunak ke dalam satu buah paket. Dengan menginstall XAMPP maka tidak perlu lagi melakukan instalasi dan konfigurasi web server Apache, PHP dan MySQL secara manual. XAMPP akan menginstalasi dan mengkonfigurasikannya secara otomatis. (Kadir, Dasar Pemrograman Web Dinamis Menggunakan PHP 2003)