Pertemuan II. Ali Tarmuji, S.T., M.Cs. Pemrograman Web. Teknik Informatika Fakultas Teknologi Industri.

Transkripsi

1 Pertemuan II Ali Tarmuji, S.T., M.Cs. 1

2 Materi minggu ini: 2

3 3

4 Pemahaman Pemrograman: suatu usaha menulis suatu perintah (program aplikasi) sehingga komputer dapat menjalankan apa yang kita inginkan Pemrograman web: membuat program aplikasi berbasis web Aplikasi berbasis web: Aplikasi yang dibuat dengan memanfaatkan mekanisme dan aplikasi yang sudah ada pada sistem web (WWW) 4

5 Membuat aplikasi berbasis web Memperkaya fungsi web server dengan cara menambahkan program pada dokumen web yang akan dieksekusi oleh server ketika file dokumen web tersebut diakses oleh web server Misalnya, program yang mengambil data ke basis data untuk ditampilkan ke web browser Memperkaya interaktivitas dokumen dengan cara menambahkan program pada dokumen web yang akan dieksekusi oleh web browser ketika file dokumen tersebut ditampilkan oleh web browser Misalnya, program yang memvalidasi data masukan pada form sebelum disubmit ke web server 5

6 Cara kerja Web 6

7 Aplikasi Berbasis Web Sistem Berbasis Web atau Aplikasi Berbasis Web adalah sebuah sistem yang dibangun dengan konsep rekayasa web (web engineering) dan diaplikasikan secara online melalui media internet. Web engineering adalah suatu proses yang digunakan untuk menciptakan suatu sistem aplikasi berbasis web dengan menggunakan ilmu rekayasa, prinsip-prinsip manajemen dan pendekatan sistematis sehingga dapat diperoleh sistem dan aplikasi web dengan kualitas tinggi. Tujuannya untuk mengendalikan pengembangan, meminimalisasi resiko dan meningkatkan kualitas sistem berbasis web (kmrg.itb.ac.id, 2005). 7

8 Aplikasi Berbasis Web Ada banyak aplikasi berbasis web yang tersedia saat ini, antara lain: Chatting, sistem informasi, , milis, forum, penjualan online, dll. Keunggulan aplikasi berbasis web ini antara lain: Platform Independent, artinya aplikasi ini dapat dijalankan dari sistem operasi windows, linux, BSD, Mac. Tidak memerlukan instalasi software untuk menjalankan aplikasi di setiap komputer. Untuk komputer lain yang ingin menjalankan program ini cukup buka browsernya dan membuka alamat host server dimana program ini disimpan. Aplikasi ini dapat dijalankan dari jarak jauh dengan menggunakan internet. 8

9 Aplikasi Berbasis Web Berarsitektur client-server software web browser di sisi client software web server di sisi server Menggunakan protokol HTTP dalam komunikasi antara client dan server Mempunyai fungsi untuk mengambil/ menjalankan isi file dokumen web di server dan menampilkannya di sisi client 9

10 Aplikasi Berbasis Web Keunggulan Dapat diakses kapan pun dan dari mana pun selama ada internet Dapat diakses hanya dengan menggunakan web browser (umumnya sudah tersedia di PC, PDA, dan handphone terbaru), tidak perlu menginstall aplikasi client khusus Kekurangan Antarmuka yang dapat dibuat terbatas sesuai spesifikasi standar untuk membuat dokumen web keterbatasan kemampuan web browser untuk menampilkannya Terbatasnya kecepatan internet mungkin membuat respon aplikasi menjadi lambat 10

11 Web Statis vs. Web Dinamis Web Statis Sebagian besar halaman web statis Isi (teks / link / gambar) yang sama setiap kali diakses HyperText Markup Language (HTML) digunakan untuk menentukan teks / format gambar contoh: dokumen online, kebanyakan homepage Web Dinamis Sebagai Web dinamis mengarah ke layanan online/ e-commerce halaman Webnya juga harus menyediakan konten dinamis halaman harus update, berubahubah (misalnya: berputar banner, artikel ganti) harus mampu bereaksi terhadap tindakan info pengguna, permintaan dan proses, pemesanan jasa, dll Contoh:

12 12

13 Model Klien (PC) Web Server Request (URL) HTTP Server Web Browser Response (Content) Content 13

14 Yang perlu diingat Komunikasi antara web browser dan web server berdasarkan protokol HTTP. Dokumen dan semua sumber daya apapun di jaringan yang dikehendaki diidentifikasi dengan Universal Resource Locator (URL) bagian dari URI Dokumen web ditulis berdasarkan standar HTML. Pemrograman sisi klien (client-side scripting) Pemrograman sisi server (server-side scripting/ programming). 14

15 Client-Side Scripting Pemrograman sisi klien Bahasa pemrograman yang digunakan untuk mengaplikasikannya tidak memerlukan web server bahasa pemrograman yang berjalan di sisi client. Cukup menggunakan web browser Contoh: HTML, Javascript, Java Applet, Flash. 15

16 server-side scripting Pemrograman web sisi server Bahasa pemrograman untuk mengaplikasikannya memerlukan web server, atau bahasa pemrograman yang berjalan di sisi server. Contoh : ASP, memerlukan web server IIS. PHP, memerlukan web server Apache. 16

17 Client Side vs. Server Side Client Side Programming Dapat men-download program dengan halaman Web di browser Dijalankan pada mesin klien sederhana, generik, tapi tidak aman Menggunakan bahasa standar HTML Untuk penggunaan di localhost tidak memerlukan webserver, cukup aplikasi editor teks dan brwoser Server Side Programming Dapat menyimpan dan menjalankan program pada server web, link dari halaman Web Lebih kompleks, membutuhkan hak akses server, tetapi aman Di localhost memerlukan webserver lokal (mis. Vertrigo, WAMP, dll) di samping aplikasi editor dan browser 17

18 Client Side vs. Server Side Client Side Programming Diperkaya dengan bahasa skrip JavaScript bahasa scripting untuk halaman web, yang dikembangkan oleh Netscape pada 1995 menggunakan sintaks mirip C + +/ Java, begitu akrab untuk programmer, tetapi sederhana baik untuk menambahkan fitur yang dinamis untuk halaman Web, pengendalian bentuk dan GUI Diperkaya dengan programming Java applet dapat mendefinisikan hal-hal kecil, program dg tujuan khusus di java disebut applet memberikan kekuatan ekspresif penuh baik untuk tugas-tugas yang lebih kompleks atau tugas data berat, seperti grafik, dll Server Side Programming Menggunakan pemrograman CGI Program dapat ditulis agar sesuai dengan Common Gateway Interface Bila halaman Web menyampaikan, data dari halaman tersebut dikirim sebagai masukan untuk program CGI Mengeksekusi program CGI di server, mengirimkan hasilnya kembali ke browser sebagai halaman web Baik jika perhitungan besar / kompleks atau membutuhkan akses ke data pribadi Menggunakan pemrograman: Active Server Pages (ASP), Servlets Java, PHP, dll: Vendor-spesifik alternatif pengganti CGI Menyediakan banyak kemampuan yang sama tetapi menggunakan tag mirip HTML 18

19 19

20 Browser Merupakan sebuah software yang digunakan untuk mengakses/menampilkan halaman web. Berkomunikasi dengan server web melalui protokol HTTP Mekanisme kerja pengaksesan dokumen web yang berbasis HTML adalah sebagai berikut : Browser meminta sebuah halaman web ke suatu situs web melalui protokol HTTP Permintaan diterima oleh server Web server mengirimkan dokumen HTML yang diminta ke client Browser client menampilkan dokumen yang diterima berdasarkan kode yang terdapat pada dokumen HTML 20

21 Browser Mozilla Firefox 21

22 Browser Internet Explorer Opera 22

23 Browser Netscape Navigator Chrome 23

24 Pengolah Grafis photoshop Mcromedia Firework 24

25 Pengolah Animasi/multimedia Macromedia Flash SwishMax 25

26 Web Editor Notepad++ Dreamweaver 26

27 Bahasa Client Side HTML CSS JavaScript JavaApplet ActiveX Control Server Side Platform Windows ASP (bahasa pemrograman) Ms. Access / SQL Server (database) Platform Linux PHP (bahasa pemrograman) MySQL / PosgreeSQL (database) 27

28 28

29 Desainer Web Bertanggung jawab kepada tampilan visual sebuah situs web, meliputi tipografi, grafis, animasi, tata letak, warna dan lain-lain Kemampuan utama : seni, desain grafis, imajenasi dan kreasi. Software yang harus dikuasai : Pengolah grafis (Adobe Photoshop, CorelDraw, dll), pengolah animasi (Macromedia Flash, Swish, dll), pengolah multimedia (CoolEdit Pro, Xara3D, dll) 29

30 Master Web Bertanggung jawab atas kelancaran dan jalannya sebuah situs web. Kemampuan yang harus dimiliki meliputi desain, pemrograman, dan maintenance sebuah situs web. Tidak mencampuri profesi yang ada, hanya memberi arahan kepada desainer maupun programmer mengenai apa yang harus dilakukan dalam membangun situs 30

31 Programmer Web Bertanggung jawab membuat halaman web interaktif dan dinamis dengan sebuah bahasa scripting menyangkut dengan transaksi, input output data dan database. Kemampuan yang harus dimiliki : HTML Pemrograman Server (misalnya : PHP & MySQL) Pemrograman Client (Seperti : CSS, JavaScript/ JavaApplet) 31

32 Web Administrator memaintenance suatu server agar situs yang dikelola senantiasa online. Kemampuan yg harus dimiliki : Menguasai sistem operasi server (Windows NT/Server, Linux, dll) Jaringan Komputer (LAN, Intranet, dll) Keamanan komputer dan internet 32

33 33

34 Jenis Web Katalog Menampilkan daftar produk yang dijual oleh suatu perusahaan yang biasanya memiliki produk dalam jumlah yang besar. Harus mempertimbangkan update katalog dengan mudah, efisien dan continue. E-Commerce Suatu kumpulan yang dinamis antara teknolgi, aplikasi dan proses bisnis yang menghubungkan perusahaan, konsumen dan komunitas tertentu melalui transaksi elektronik. Secara umum transaksi yang dilakukan : find it (mencari produk), explore it (mempelajari produk), select it (memilih produk), buy it (membeli produk), ship it (pengiriman barang). 34

35 Jenis Web E-Learning Media pengajaran dan pembelajaran yang menggunakan rangkaian elektronik (LAN, WAN atau Internet) untuk menyampaikan isi pembelajaran, interaksi atau bimbingan. Tiga hal yang wajib dipenuhi : sederhana (memudahkan peserta didik dalam memanfaatkan teknologi) personal (guru dapat berinteraksi dengan peserta didik layaknya pembelajaran konvensional) cepat (mengatasi rasa jenuh dan bosan). 35

36 Jenis Web Komunitas Memungkinkan pengunjung berkomunikasi secara bersamaan. Contoh : friendster, blog, facebook, dll Portal Aplikasi berbasis web yang menyediakan akses suatu titik tunggal dari informasi online terdistribusi, seperti dokumen yang didapat dari pencarian, kanal berita dan link ke situs tertentu Contoh : portal sekolah, portal kampus, portal dakwah, dll. Personal Bertujuan untuk mempromosikan tentang seseorang. Biasanya berisi : biodata, portofolio (kumpulan hasil karya), prestasi atau kegiatan sehari-hari 36

37 Fungsi Web Fungsi Komunikasi Berupa web dinamis karena melibatkan server dan pengelolaan data sehingga memungkinkan terjadinya interaksi dengan user Fungsi-fungsi komunikasi : webmail, form contact, chatting, forum, dll Fungsi Informasi Lebih ditekankan pada kualitas bagian konten karena tujuannya adalah menyampaikan informasi. Berisi teks dan grafik yang mudah didownload. Fungsi informasi : news, profile company, library, reference, dll. 37

38 Fungsi Web Fungsi Entertainment/Hiburan Menekankan pada penggunaan animasi gambar dan elemen bergerak. Fungsi hiburan : game online, film online, musik online, dll. Fungsi Transaksi Sebagai sarana transaksi bisnis baik barang, jasa atau lainnya. Menguhubungkan perusahaan, konsumen dan komunitas tertentu. Pembayaran dapat menggunakan kartu kredit, transfer, paypal, dll. 38

39 Fungsi Web Fungsi ekonomi Alat Pemasaran Bertujuan mempromosikan dan memasarkan produk atau jasa layanan suatu perusahaan. Dapat juga berupa company profile Nilai Tambah Nilai tambah dari sekedar promosi atau pemasaran secara online misalnya : trend perusahaan modern, branding image, dll. 39

40 Referensi Jack Febrian, Menggunakan Internet, Penerbit Informatika, 2008 Anastasia Diana & Fandy Tjiptono, E-Business, Penerbit Andi, 2007 Happy Chandraleka, Cara Mudah Mengelola untuk Pemula, Mediakita,

41 Materi minggu depan: HTML Dasar Pengantar HTML Sejarah HTML dan XHTML Elemen HTML Sintaks HTML Tag dan property HTML 41