BAB 2 TINJAUAN PUSTAKA 2.1 XAMPP XAMPP merupakan singkatan dari : X : Multi sistem operasi, bisa Windows, Linux, Mac OS, maupun Solaris A : Apache HTTP Server M : MySQL Database Server P : PHP Scripting Language P : Pearl Scripting Language XAMPP merupakan sebuah alat atau tool yang menyediakan perangkat lunak kedalan satu buah paket. Di dalam paket tersebut sudah terdapat Apache (Web Server ), MySQL ( Database ), PHP, PhpMyAdmin dan berbagai alat bantu lainnya. Dengan menginstall XAMPP maka tidak perlu lagi melakukan instalasi dan konfigurasi web server Apache, PHP dan MySQL secara manual. XAMPP akan mengkonfigurasikannya secara otomatis. 2.1.1 Apache Tugas Utama Apache adalah menghasilkan halaman web yang benar berdasarkan kode PHP yang dituliskan oleh pembuat halaman web. Universitas Sumatera Utara 18 2.1.2 PHP PHP merupakan bahasa pemrograman untuk membuat web yang bersifat dinamis. PHP dapat dijalankan pada berbagai macam sistem operasi dan juga mendukung beberpa web server lainnya. Sedangkan untuk sistem manajemen database yang sering digunakan bersama PHP ialah MySQL. 2.1.3 MySQL MySQL adalah sebuah sistem manajemen database yang bersifat open source. Digunakan untuk membuat dan mengelola database beserta isinya, menambah, mengubah dan menghapus data yang berada dalam database. Sifat dari MySQL ialah relational, yang berarti data-data yang dikelola dalam database akan diletakkan pada beberapa tabel yang terpisah sehingga memanipulasi data akan lebih cepat. 2.2 HTML HTML atau HyperText Markup Language adalah bahasa pemrograman yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di sebuah program web browser internet. Ada dua cara untuk membuat sebuah web page, yaitu dengan HTML editor atau dengan editor biasa (notepad,Wordpad atau SublimeText). Dokumen HTML disusun oleh elemen-elemen yang berupa head, body, table, paragraf, dan list. Elemen-elemen tersebut ditandai dengan menggunakan tag, yaitu tanda “ < > “. Universitas Sumatera Utara 19 Tag umumnya dituliskan berpasangan, misal nya < body > dengan < /body> Namun ada beberapa tag yang tidak diharuskan ditulis berpasangan, contoh: 1. Paragraf dengan tag <p> 2. Ganti baris dengan tag <br> 3. Garis datar dengan tag <hr> 4. List item dengan tag <li> Elemen-elemen yang dibutuhkan untuk membuat suatu dokumen HTML dinyatakan dengan tag < HTML >, < Head > dan < Body > berikut dengan pasangannya. Setiap dokumen terdiri atas head dan body. Elemen head berisi informasi tentang dokumen tersebut dan elemen body berisi teks yang sebenarnya tersusun dari link, grafik, paragraf, dan elemen lainnya. Tabel 2.1 Tag Awal dan Tag Akhir HTML Nama Tag Tag Awal Tag Akhir Keterangan HTML <HTML> </HTML> Tag dasar untuk mendefinisikan dokumen HTML Head <Head> </Head> Untuk menuliskan keterangan tentang dokumen web yang akan ditampilkan Title <Title> </Title> Untuk memberi judul/informasi pada caption web browser Body <Body> </Body> Line Break Isi utama dalam dokumen web Membuat ganti baris pada dokumen <Br> </Br> web Universitas Sumatera Utara 20 Heading <Hn> </Hn> Membentuk tulisan dengan pola judul dan ‘n’ adalah nomor tingkatannya Garis Membuat <Hr> Mendatar Komentar garis mendatar pada </Hr> dokumen <!-- --> Memberi komentar atau membentuk tulisan menjadi komentar Paragraf <p> </p> Membuat teks berparagraf Sumber : komputerdynamic.blogspot.com 2.3 Web Browser Web Browser ialah sebuah aplikasi perangkat lunak yang memungkinkan pengguna untun menayangkan atau berinteraksi dengan tulisan, gambar, video, music, dan berbagai informasi lainnya yang terdapat pada pada halaman web disebuah situs world wide web atau jaringan LAN lokal. Web Browser memungkinkan pengguna secara cepat dan mudah mengakses informasi yang diberikan oleh banyak situs web dengan menjelajahi link tersebut. Web Browser memformat informasi HTML untuk di tayangkan, oleh karena itu penampakan halaman web akan berbeda dari satu browser dengan browser yang lain nya, namun sesungguhnya kegunaan web browser sama. Penulis menggunakan web browser : Mozilla Firefox dalam merancang aplikasi ini. Universitas Sumatera Utara 21 2.3.1 Mozilla Firefox Dibuat oleh Mozilla Corporation, Firefox adalah salah satu web browser open source yang di bangun dengan Gecko layout engine. Tak hanya handal, Firefox juga didukung oleh sejumlah addons/plugin yang merupakan aplikasi tambahan yang dapat dipasang sehingga memperkaya fitur software yang bersangkutan. 2.4 Sublime Text 3 Sublime text pertama kali dirilis pada tanggal 18 januari 2008, dan sekarang versi sublime text sudah mencapai versi ke 3 yang dirilis pada 29 januari 2013. Sublime text mendukung sejumlah bahasa pemrograman diantaranya C, C++, PHP, CSS, HTML, ASP, dan masih banyak lagi. Sublime Text ialah editor teks untuk berbagai bahasa pemrograman, termasuk pemrograman PHP. Sublime teks juga mendukung berbagai sistem operasi seperti Linux, Mac OS dan juga Windows. Sangat banyak fitur yang tersedia pada sublime text, diantaranya minimap, membuka script side by side, bracket highlight sehingga tidak bingung mencari pasangan nya. Universitas Sumatera Utara 22 2.5 Database (Basis Data) Basis data merupakan kumpulan dari data yang saling berhubungan satu dengan yang lainnya, tersimpan di perangkat keras komputer dan digunakan perangkat lunak untuk memanipulasinya. Data di dalam basis data perlu diorganisasikan sedemikian rupa supaya informasi yang dihasilkan berkualias. Data perlu disimpan di dalam dasar data untuk keperluan penyediaan informasi lebih lanjut. Organisasi basis data yang baik juga berguna untuk efisiensi kapasitas penyimpanannya. Basis data diakses atau dimanipulasi dengan menggunakan perangkat lunak paket yang disebut dengan DBMS (Database Management Systems). 2.6 Casading Style Sheet ( CSS ) CSS banyak digunakan untuk memperluas kemampuan HTML dalam memformat dokumen web atau untuk mempercantik tampilan web, bahkan untuk pemosisian dan layouting halaman web. Dengan mendefinisikan suatu style sekali saja, maka style itu akan dapat digunakan berulang kali. CSS telah didukung di beberapa browser, terutama versi baru sehingga penempatan layout menjadi lebih fleksibel. Membuat HTML menggunakan tag minimal berpengaruh terhadap ukuran file, dapat menampilkan konten utama terlebih dahulu, sementara gambar dan file lain dapat menampilkan sesudahnya. Universitas Sumatera Utara 23 Selain itu penggunaan CSS pada file terpisah dapat mempermudah pengubahan tampilan situs secara keseuruhan. 2.7 Data Flow Diagram Data flow diagram yaitu suatu diagram yang menggunakan notasi-notasi untuk menggambarkan arus data dari suatu sistem dengan menggunakan pendekatan metode analisis sistem terstruktur. Tujuan data flow diagram yaitu memberikan indikasi mengenai bagaimana data ditransformasi pada saat data bergerak melalui sistem dan menggambarkan fungsi-fungsi yang mentransformasi aliran data. Komponen-komponen data flow diagram yaitu : entitas luar, proses penyimpanan data, dan arus data. DFD memiliki simbol-simbol yang digunakan untuk menggambarkan model data seperti yang tertera pada table berikut ini. Tabel 2.2 Simbol Data Flow Diagram Gane/Sarson Yourdon/De Marco Keterangan Entitas eksternal dapat berupa unit terkait yang berinteraksi dengan Entitas Entitas sistem tapi berada di Eksternal Eksternal luar sistem. Universitas Sumatera Utara 24 Unit yang mempergunakan atau melakukan transformasi Proses data. Komponen fisik tidak diidentifikasi. Aliran data dengan arah khusus dari sumber ke tujuan. Penyimpanan data atau Data Store tempat data dilihat oleh proses. Sumber : www.id.wikipedia/wiki/data_flow_diagram 2.8 Flowchart ( Diagram Alir ) Flowchart adalah bagan yang menggambarkan arus logika dari data yang akan diproses dalam suatu program dari awal sampai akhir. Flowchart digunakan untuk menggambarkan sebuah algoritma. Menurut bentuknya, flowchart dibedakan menjadi 3 jenis : 1. Flowchart berurut, yaitu bentuk flowchart yang bentuknya urut ke bawah dan biasanya hanya menyelesaikan satu persoalan dengan satu penyelesain. Universitas Sumatera Utara 25 2. Flowchart memilih yaitu bentuk flowchart yang digunakan untuk menyelesaikan persoalan dengan penyelesaian lebih dari satu, dan biasa memilih satu diantara dua penyelesaian yang ada. 3. Flowchart berulang yaitu bentuk flowchart yang digunakan untuk menyelesaikan persoalan dengan bentuk berulang. Simbol-simbol flowchart dalam bentuk seperti dalam tabel berikut: Tabel 2.3 Simbol Simbol Flowchart No 1 Simbol Keterangan Terminator yang berarti digunakan untuk menunjukkan awal dan akhir suatu algoritma 2 Proses yang digunakan untuk mewakili suatu proses. 3 Data yang digunakan untuk mewakili data input atau output atau menyatakan operasi pemasukan data dan pencetakan hasil 4 Decision untuk suatu pemilihan, penyeleksian kondisi di dalam suatu program 5 Preparation untuk memberi nilai awal, nilai akhir, Universitas Sumatera Utara 26 penambahan/pengurangan bagi suatu variable counter 6 Predefined Process yang digunakan untuk menunjukkan suatu operasi yang rinciannya ditunjukkan ditempat lain (prosedur, sub-prosedur, fungsi) 7 Connector untuk menunjukkan sambungan dari flowchart yang terputus di halaman yang sama atau halaman berikutnya 8 Untuk menyimpan data Sumber : www.id.wikipedia/wiki/diagram_alir Universitas Sumatera Utara