Membuat Website SekolahSederhana DenganDreamweaver dan PHP MYSQLEdisi PemulaFajrul Azmi Syahputra KATA PENGANTARPuji dan syukur kita panjatkan ke hadirat Allah SWT yang telah memberikan rahmatdan hidayah-Nya kepada kita semua sehingga penulis dapat melaksanakan bukupertamanya, yang berjudul Membuat Website Sekolah Sederhana DenganDreamweaver dan PHP MYSQL Edisi Pemula. Dibuku ini akan membahas pengertian PHP, MYSQL, database, session danlain sebagainya. Buku ini ditujukan untuk teman-teman yang masih pemula namuningin membangun website sederhana. Akan dijelaskan dengan spesifik, agar teman-teman paham. Semoga Buku ini bermanfaat, terutama bagi programmer pemula sepertipenulis. Juga agar membantu perkembangan SDM di Indonesia agar lebih maju danengga gaptek. Penulis mengucapkan terima kasih kepada orang tua, saudara dan teman-teman penulis yang telah membantu memberi ilmu kepada penulis. DAFTAR ISI HalamanKata Pengantar ...................................................................................................... iDaftar Isi ................................................................................................................ iiBab 1. Pengertian 1. PHP ..........................................................................................................1 2. MySQL.....................................................................................................2 3. Basis Data ................................................................................................2 4. Session .....................................................................................................3 5. HTML ......................................................................................................4 6. Htaccess....................................................................................................4 7. Dreamweaver ...........................................................................................5Bab 2. Membuat Desain 1. Tampilan Index ........................................................................................6 2. Daftar Page...............................................................................................8 3. Login ........................................................................................................9 4. Tentang.....................................................................................................10 5. Siswa ........................................................................................................11 6. Profil.........................................................................................................11Bab 3. Membuat Database 1. Membuat Database...................................................................................12Bab 4. Pengkodingan 1. Pengenalan ...............................................................................................15 2. Pengarahan Link.......................................................................................15 3. Koding PHP MySql .................................................................................17Bab 5. Hosting 1. Pengertian Hosting ...................................................................................22 2. Cara Hosting ............................................................................................22Daftar Pustaka BAB 1 PENGERTIAN1. PHPPHP: Hypertext Preprocessor adalah bahasa skrip yang dapat ditanamkan ataudisisipkan ke dalam HTML. PHP banyak dipakai untuk memrogram situs webdinamis. PHP dapat digunakan untuk membangun sebuah CMS. Apa itu CMS ? Sistem manajemen konten (Inggris: Content ManagementSystem, disingkat CMS), adalah perangkat lunak yang digunakan untukmenambahkan atau memanipulasi (mengubah) isi dari suatu situs web. Umumnya,sebuah CMS (Content Management System) terdiri dari dua elemen: Aplikasi manajemen isi (Content Management Application, CMA) Aplikasi pengiriman isi (content delivery application, CDA)Elemen CMA digunakan untuk mengelola konten yang mungkin tidak memilikipengetahuan mengenai HTML untuk mengelola pembuatan, pengubahan, danpenghapusan isi dari suatu situs web tanpa perlu memiliki keahlian sebagai seorangwebmaster. Elemen CDA menggunakan dan menghimpun informasi-informasiyang sebelumnya telah ditambah, dikurangi atau diubah oleh pemilik situs webuntuk memperbaharui situs web tersebut. Kemampuan atau fitur dari sebuah sistemCMS berbeda-beda. Walaupun begitu, kebanyakan dari perangkat lunak inimemiliki fitur publikasi berbasis Web, manajemen format, kontrol revisi,pembuatan indeks, pencarian, dan pengarsipan. Jadi intinya itu, PHP adalah skrip tambahan untuk mengolah data yang ada diwebsite, ini penjelasan menurut saya sih. Dengan ada nya PHP, website mampumenjadi lebih dinamis. 2. MySQL MySQL adalah sebuah implementasi dari sistem manajemen basisdata relasional (RDBMS) yang didistribusikan secara gratis dibawah lisensi GPL (General Public License). Setiap pengguna dapat secara bebas menggunakan MySQL, namun dengan batasan perangkat lunak tersebut tidak boleh dijadikan produk turunan yang bersifat komersial. MySQL sebenarnya merupakan turunan salah satu konsep utama dalam basisdata yang telah ada sebelumnya; SQL (Structured Query Language). SQL adalah sebuah konsep pengoperasian basisdata, terutama untuk pemilihan atau seleksi dan pemasukan data, yang memungkinkan pengoperasian data dikerjakan dengan mudah secara otomatis. Kehandalan suatu sistem basisdata (DBMS) dapat diketahui dari cara kerja pengoptimasi-nya dalam melakukan proses perintah-perintah SQL yang dibuat oleh pengguna maupun program-program aplikasi yang memanfaatkannya. Sebagai peladen basis data, MySQL mendukung operasi basisdata transaksional maupun operasi basisdata non-transaksional. Pada modus operasi non- transaksional, MySQL dapat dikatakan unggul dalam hal unjuk kerja dibandingkan perangkat lunak peladen basisdata kompetitor lainnya. Namun pada modus non- transaksional tidak ada jaminan atas reliabilitas terhadap data yang tersimpan, karenanya modus non-transaksional hanya cocok untuk jenis aplikasi yang tidak membutuhkan reliabilitas data seperti aplikasi blogging berbasis web (wordpress), CMS, dan sejenisnya. Untuk kebutuhan sistem yang ditujukan untuk bisnis sangat disarankan untuk menggunakan modus basisdata transaksional, hanya saja sebagai konsekuensinya unjuk kerja MySQL pada modus transaksional tidak secepat unjuk kerja pada modus non-transaksional. 3. Basis Data Pangkalan data atau basis data (bahasa Inggris: database), atau sering pula dieja basisdata, adalah kumpulan informasi yang disimpan di dalam komputer secara sistematik sehingga dapat diperiksa menggunakan suatu program komputer untuk memperoleh informasi dari basis data tersebut. Perangkat lunak yang digunakan untuk mengelola dan memanggil kueri (query) basis data disebut sistem manajemen basis data (database management system, DBMS). Sistem basis data dipelajari dalam ilmu informasi.2|Membuat Website Sekolah Sederhana Istilah \"basis data\" berawal dari ilmu komputer. Meskipun kemudian artinya semakin luas, memasukkan hal-hal di luar bidang elektronika, artikel ini mengenai basis data komputer. Catatan yang mirip dengan basis data sebenarnya sudah ada sebelum revolusi industri yaitu dalam bentuk buku besar, kuitansi dan kumpulan data yang berhubungan dengan bisnis. Jadi, database ini berguna untuk menyimpan data yang sudah diinput melalui bantuan PHP dan MYSQL tadi, contohnya, jika kita mendaftar Facebook. Maka data diri kita tersimpan di data base nya mereka. 4. Session Saat berinternet, kita tentu sering menjumpai situs yang mengharuskan pengunjung melakukan login terlebih dahulu agar dapat mengakses informasi mereka. Misalnya saja pada situs e-mail, disitu kita perlu mengisikan user name dan password sebelum mengakses email, kemudian melakukan logout setelah selesai. Pada PHP terdapat fitur bernama session handling yang bisa dipakai untuk keperluan otentikasi seperti di atas. Pada dasarnya session adalah cara untuk menjaga suatu variabel tetap ada selama sesi kunjungan user. Meskipun berpindah-pindah halaman, variabel session tetap ada dan bisa diakses sampai session ditutup. Fasilitas session handling ini baru ada secara built-in mulai PHP versi 4. PHP mempunyai session (catatan aktivitas) yang digunakan untuk menjaga / memelihara informasi akses dari seorang pengakses / pemakai aplikasi web. Session memungkinkan pelacakan akses pemakai, pangaturan pemakaian aplikasi oleh pemakai dan meningkatkan layanan situs web. Setiap pengunjung akan diberi sebuah id yang unik, yang disebut dengan id session (session_id). ID ini dapat disimpan dalam suatu cookie pada sisi user atau disertakan dalam URL. Session koneksi antara klien dan server akan hilang atau putus apabila browser ditutup. Apabila browser dijalankan kembali dan koneksi ke server dilakukan maka dianggap sebagai koneksi baru. Jadi, Session ini menampung data sementara kita ketika kita telah login. Misalnya kita login Facebook, maka session akan menampung email atau id kita. Ketika logout, maka session tadi dihapuskan, sehingga ketika tekan back, mesti login ulang.3|Membuat Website Sekolah Sederhana 5. HTML Hyper Text Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan dalam format ASCII normal sehingga menjadi halaman web dengan perintah-perintah HTML. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee Robert ketika mereka bekerja di CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di Jenewa). 6. HtAccess .Htaccess adalah adalah sebuah file unutk konfigurasi yang biasanya disediakan oleh penyedia layanan web hosting yang berfungsi untuk mengubah pengaturan default dari setbuah situs. Berikut beberapa kegunaan .htaccess : Mem-proteksi Folder / Melindungi Folder dengan password Mengalihkan pengunjung website anda dengan otomatis Membuat halaman pesan tampilan error anda sendiri Menolak pengunjung dengan IP Address tertentu Merubah extensi file anda Hanya mengijinkan pengunjung dengan IP Address tertentu Mengijinkan/Menolak list direktori4|Membuat Website Sekolah Sederhana 7. Dreamweaver Adobe Dreamweaver adalah aplikasi desain dan pengembangan web yang menyediakan editor WYSIWYG visual (bahasa sehari-hari yang disebut sebagai Design view) dan kode editor dengan fitur standar seperti syntax highlighting, code completion, dan code collapsing serta fitur lebih canggih seperti real-time syntax checking dan code introspection untuk menghasilkan petunjuk kode untuk membantu pengguna dalam menulis kode. Tata letak tampilan Design memfasilitasi desain cepat dan pembuatan kode seperti memungkinkan pengguna dengan cepat membuat tata letak dan manipulasi elemen HTML. Dreamweaver memiliki fitur browser yang terintegrasi untuk melihat halaman web yang dikembangkan di jendela pratinjau program sendiri agar konten memungkinkan untuk terbuka di web browser yang telah terinstall. Aplikasi ini menyediakan transfer dan fitur sinkronisasi, kemampuan untuk mencari dan mengganti baris teks atau kode untuk mencari kata atau kalimat biasa di seluruh situs, dan templating feature yang memungkinkan untuk berbagi satu sumber kode atau memperbarui tata letak di seluruh situs tanpa server side includes atau scripting. Behavior Panel juga memungkinkan penggunaan JavaScript dasar tanpa pengetahuan coding, dan integrasi dengan Adobe Spry Ajax framework menawarkan akses mudah ke konten yang dibuat secara dinamis dan interface.5|Membuat Website Sekolah Sederhana BAB 2 MEMBUAT DESAIN1. Tampilan IndexApa itu index? Index biasanya merupakan tampilan home atau awal sebuahwebsite. Seperti jika teman teman buka facebook, maka tampilan nya berupa logindan daftar. Disini biasanya website sekolah mendesain websitenya, agar lebihmenarik untuk dikunjungi.Berikut cara saya membuat halaman indexnya :a. Buka aplikasi dreamweaver di laptop kita. b. Create new PHP, sudah tersedia coding bawaan c. Tulis di bagian Code dengan koding yang seperti saya buat Title adalah judul atas halaman, div class=header adalah bagian atas tampilan, body bagian tengah dan footer bagian bawah tampilan. SaveAs file nya ke C:\xampp\htdocs\sekolahphp dengan nama index.php. Jika teman belum ada foldernya, jangan dibuat normal. Teman harus install aplikasi yang namanya xampp ya.7|Membuat Website Sekolah Sederhana d. Tampilan design setelah dibuat koding seperti gambar diatas seperti berikut Agar desain lebih ciamik, teman bisa kreasikan sesuai keinginan di menu yang ada di dreamweaver. 2. Daftar Page Sama seperti halaman index, teman bisa mengikuti koding saya seperti pada gambar dibawah Copy seluruh kode dari index ke file php baru, tambahkan kode seperti gambar pada bagian body, agar letaknya di tengah halaman. Form adalah tag untuk menginput ke database nantinya. Method post adalah metode untuk menginput datanya, action adalah halaman tujuan setelah submit diklik nantinya. Input type teks, berarti yang dimasukkan data berupa teks, juga password. Name adalah nama field yang ada di database yang akan kita buat nantinya. Value itu tampilan teks yang ditombol, defaultnya submit, kita ganti jadi daftar. Hasil tampilannya seperti berikut:8|Membuat Website Sekolah Sederhana Tamilan daftar seperti diatas. Lalu save kembali dengan nama daftar.php ya teman. 3. Login Sama seperti halaman daftar, copy sebagian kehalaman baru yang dibuat. Lalu ketikkan kode tambahan seperti berikut: Sama seperti kode pada daftar, hanya action, baris contact dan value login saja yang diubah. Sehingga tampilannya sedikit mirip dengan daftar form.9|Membuat Website Sekolah Sederhana 4. Tentang Dihalaman ini kita buat profil sekolah kita. Bisa ditambah sesuai kreasi tapi tidak merubah tampilan yang umum. Tampilan seperti berikut Disini, jika teman ingin menambah gambar, lebih baik gambarnya di pindahkan ke folder yang sama dengan file-file php kita tadi yaitu di \xampp\htdocs\sekolahphp. Simpan file dengan nama tentang.php10 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a 5. Siswa Halaman siswa disini adalah halaman yang akan tampil setelah kita login nantinya. Bisa dibuat sesuai keinginan teman-teman. Tampilan koding punya saya seperti berikut: Seperti halaman index, hanya saja pada tabel di ubah seperti gambar. Simpan dengan nama akun.php 6. Profil Halaman ini tidak nampak di index, daftar, login dan tentang, karena halaman ini khusus ketika sudah login dan menuju halaman akun. Berikut tampilannya Copy kode yang ada di akun.php ke yang baru, disini kita buat profil.php, lalu tambahkan kode seperti diatas. Kenapa ???? karena masih belum ada database nya. Nanti kita akan bahas di bab selanjutnya.11 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a BAB 3 MEMBUAT DATABASE1. Membuat DatabaseKali ini saya akan membahas bagaimana membuat database untuk sekolah kita ini.Syaratnya yang pasti sudah menginstall aplikasi XAMPP yang sudah sayarekomendasi di bab sebelumnya, karena tanpa aplikasi ini kita tidak mempunyailocalhost. Localhost ini sebagai pengelola website kita secara offline, ini menurutpendapat saya sih. Oke tanpa panjang lebar, kita mulai aja cara membuat databasenya.a. Buka browser, disini saya menggunakan Google Chrome. Lalu ketik di pencarian “localhost/phpmyadmin/” tanda tanda kutip. Maka akan tampak seperti gambar dibawah b. Pilih pada new, lalu ketiklah nama database kita, disini saya buat “sekolahphp”. Membuat database mesti tanpa spasi. Lalu buat/create. c. Maka akan muncul database kita di bilik kiri, dan saatnya membuat tabel. Nama tabelnya saya buat “siswa” dengan field nya 3. Karena sebelumnya kita hanya buat 3, yaitu nama, contact dan password.13 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a d. Ketik seperti digambar bawah ini lalu simpan/save e. Pembuatan database selesai. Maka tampak seperti dibawah ini14 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a BAB 4 PENGKODINGAN1. PengenalanOk teman kita sampai ditahap peng-coding-an. Ditahap ini mesti diperhatikan baik-baik agar web buatan kita bisa berjalan sesuai keinginan kita. Pengkodingan disiniyang dimaksud adalah menghubungkan php dengan mysql untuk menyimpaninputan data yang telah diinput ke database mysql yang sudah dibuat tadi.2. Pengarahan LinkKita belum membuat link yang menghubungkan antar halaman php. Disini akandiberitahukan caranya bagi pemula kayak saya.Pada gambar dapat dilihat tabel yang berisi daftar, login dan tentang masih belumterlink. Karena tulisan masih hitam. Untuk membuatnya: Blok pada tulisan daftar, lalu lihat dibawah ada tulisan link. Klik gambar folder yang ada disebelah kanan, pilih daftar.php dan lakukan terus pada login dan tentang pada semua file. Karena ini baru file index yang dibuat. Jadi total ada 12 link yang mesti diarahkan belum termasuk di halaman setelah login siswa. Hasil akhirnya seperti dibawah. Lakukan juga pada halaman akun siswa ya..16 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a O iya guys. Untuk link “keluar” yang ada dihalaman akun, kita arahkan ke “logout.php” ya. Kenapa belum dibuat, karena difile itu nanti kita berikan koding yang lain lagi. Ketik koding manual seperti gambar dibawah ini Maka semua halaman sudah ter-link dengan pas. 3. Koding PHP MySQL Setelah semua di-link langkah selanjutnya adalah menghubungkan file php ke mysql. Semoga teman bisa paham nantinya. a. Pada Halaman Daftar Gambar diatas bisa dilihat form action kita buat “prosesdaftar.php”, maka kita buat file baru yang namanya sama dengan action tadi.17 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a Buat file “prosesdaftar.php” lalu masukkan kode seperti pada gambar. Disini kita belum membuat file “koneksi.php” saya lupa. Pada gambar kita membuat variabel baru yaitu nama,kontak dan password yang berfungsi menampung data input kita tadi. Lalu variabel tambah memasukkan nya ke tabel siswa. Dan diproses. Dikatakan jika sukses maka beralih ke index.php, jika gagal maka akan muncul tampilan gagal. Saatnya kita membuat file koneksi.php. Dengan kodingan sebagai berikut: Variabel abc menjelaskan bahwa host bernama localhost, user kita pakai root dan tiada password ini adalah settingan default. Lalu pilih database dengan koding mysql_select_db, sesuai nama database yang sudah saya buat bernama sekolahphp. Jika gagal maka akan muncul tampilan database bermasalah. File koneksi berguna untuk menghubungkan ke database, dsebut juga file induk untuk membuat web ini.18 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a b. Pada halaman Login Pada koding nya dapat dilihat form action menuju proses login, yang artinya jika ditekan tombol submit maka akan beralih ke proseslogin.php. Maka sebelumnya kita buat file baru, proseslogin.php dengan koding sebagai berikut Pada gambar kita menggunakan session, pengertian session sudah kita bahas sebelumnya, untuk menampung data sementara. Disini yang ditampung adalah nama yang login. Setelah login maka beralih ke akun.php c. Akun Karena kita sudah buat session yang menuju akun.php, maka pada akun.php kita tambahkan kode berikut19 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a Untuk tidak sembarangan masuk ke akun tanpa login. Jika demikian maka akan dialihkan ke login.php tuk login ulang. Lakukan hal yang sama pada halaman profil. d. Profil Karena sebelumnya di koding profil masih ???? disini kita tambahkan kode untuk memunculkan data kita. Disini kita ambil kembali data dari session untuk dimasukkan ke variabel use dan dipakai dalam database, agar hanya data yang login yang akan tampil alias tidak semua.20 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a e. Logout Untuk halaman logout, pertama kita buat file php baru dengan nama logout.php, bisa pakai koding simpel seperti berikut Disini session tadi dihancurkan, agar tidak bisa kembali dengan seenaknya..Jika semua hal tadi sudah kita lakukan, maka selanjutnya uji coba website kita dengancara, buka browser disini saya pakai chrome, lalu ketikkan dipencarianlocalhost/namafoldertempatsimpanfiletadi/ . Disini saya menyimpannya di folder yangbernama sekolahphp. Semoga berjalan dengan baik21 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a BAB 5 HOSTING1. Pengertian HostingHosting (disebut juga Web Hosting / sewa hosting) adalah penyewaan tempat untukmenampung data-data yang diperlukan oleh sebuah website dan sehingga dapatdiakses lewat Internet. Data disini dapat berupa file, gambar, email,aplikasi/program/script dan database.2. Cara HostingDisini saya hosting menggunakan jasa dari IDHostinger. Mungkin kawan-kawansebagian ada yang sudah pernah mendengar namanya. IDHostinger adalah websiteyang menyewakan jasa hosting, bisa gratis maupun berbayar. Disini sayamenggunakan domain yang gratis aja ya. Berikut cara menghosting :a. Buka website Idhostinger Pastikan kawan punya koneksi internet untuk membuka website Idhostingernya. Berikut tampilan websitenya b. Daftar atau Login Jika kawan sudah punya akunnya, silakan login. Disini saya akan mendaftar baru akun idhostinger. Klik tombol buat akun, dibawah form login. Lalu daftar c. Setelah mendaftar dan verifikasi, saatnya kita login masuk. Pilih tab hosting, lalu order hosting baru23 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a d. Pilih yang gratisan aja dulu, karena disini kita baru belajar e. Pilih yang sub-domain, lalu isi nama website yang akan kita buat, isi password yang mudah kawan ingat, lalu lanjutkan24 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a f. Isi deskripsi dengan ketik apa aja, Pilih order g. Setelah itu, maka hosting kita akan segera terbit. Hanya saja butuh waktu. Mungkin sekitar seharian. h. Jika sudah, maka kita bisa mengelola hosting kita tadi. Seperti berikut25 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a i. Pilih file manajer 2, untuk mengupload semua file yang telah kita buat j. Pada public_html lah tempat kita mengupload file kita tadi k. Karena ingin mengupload semua sekaligus, pilih file zip. Tapi sebelum itu kawan mesti kompres semua file-file tadi ke satu file zip dengan aplikasi winzip26 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a l. Maka file kita tadi sukses di upload m. Pada tab yang lain, coba buka database nya n. Buat database baru, setelah jadi pilih phpmyadmin27 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a o. Buat tabel siswa dengan kolom sebanyak 3, yaitu nama, contact dan pass, lalu simpan p. Kembali lagi ke tab file Manajer 2, edit file koneksi.php untuk menyesuaikan nama database baru, user dan passwordnya. Lalu save q. Buka website kita di pencarian, maka kita sukses telah menghosting website sekolahphp kita cobalah untuk daftar akun baru, login dan cek semua halaman php kawan, apakah sukses ? saya sendiri sukses melakukannya.28 | M e m b u a t W e b s i t e S e k o l a h S e d e r h a n a Daftar Pustakahttp://www.idebagus.com/help/tanya-jawab/hosting/apa-yang-dimaksud-dengan-hostinghttps://id.wikipedia.org/wiki/Sistem_manajemen_kontenhttps://id.wikipedia.org/wiki/PHPhttps://id.wikipedia.org/wiki/MySQLhttps://id.wikipedia.org/wiki/Basis_datahttp://eddypurwoko.blogspot.co.id/2014/03/pengertian-session-dan-fungsinya.htmlhttps://id.wikipedia.org/wiki/HTMLhttps://id.wikipedia.org/wiki/Adobe_Dreamweaverhttp://www.lingkarmerah.com/2009/02/apa-itu-htaccess-dan-kegunaannya.html
