Internet dan Web

2,125 views
2,023 views

Published on

..:: Materi Kelas Pemograman Web ::..
Materi terkait Sejarah, Arsitektur dan Aplikasi dari Internet. Dan juga membahas pengenalan dari web berikut komponen pendukungnya.

Published in: Education, Technology
1 Comment
1 Like
Statistics
Notes
No Downloads
Views
Total views
2,125
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
218
Comments
1
Likes
1
Embeds 0
No embeds

No notes for slide
  • Who I am and what we’ll do Course upcoming submittals
  •   The Internet is a vast collection of inter-connected computer networks connecting computers all over the world. No one knows exactly how many computers are connected to the Internet. It is certain, however, that these number in the millions and are increasing at a rapid pace.  
  • 3 These networks contain special computers that store information and serve it out as needed to those who connect to them. “Serve” is a good word because you might have heard of servers – that’s another name for computers that store information and direct it out to people when they request it. So this network of networks is made up of lots of computers or servers, all over the world, that hold information – and ---
  • In spite of the lack of any central control, remarkably, this anarchy by design works exceedingly well. All computers on the Internet communicate with one another using a uniform set of rules which govern the transmitting and receiving of data. This is known as TCP/IP which is an abbreviation for Transmission Control Protocol/Internet Protocol. Computers on the Internet use a client/server architecture. This means that the remote server machine provides files and services to the user’s local client machine. In other words, the computer we are using to access the Internet is the local client which we use to connect to remote servers.
  • 4 One way to think of and describe the Internet is a connected community of servers and networks. It is a virtual community, but just as cities and towns are linked together by roads and highways, the virtual “places” on the Internet are linked together by wires, cables and satellite connections. You’ve heard the phrase “Information Superhighway” – that’s a great way to think of it. To carry that analogy even further you might hear about “traffic” on the Internet. Sometimes we hear about servers crashing because of too much traffic—too many people trying to get to the same place at the same time.   Again, this community is global. It includes servers all over the world, from the United States to Australia – from Greenland to Italy.
  • Internet dan Web

    1. 1. INTERNET DAN WEB Pemograman Web (2010/2011) - Feb 17, 2011 Teknik Informatika, Universitas Islam Indonesia Hari Setiaji, S.Kom Follow Hari Setiaji on Twitter
    2. 2. Agenda Pemograman Web (2010/2011) – Hari Setiaji, S.Kom Internet Architecture History Applications
    3. 3. Connect to the world.. Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    4. 4. Jaringan dalam sebuah jaringan <ul><li>The Internet is the largest group of computers ever linked </li></ul><ul><li>together. </li></ul><ul><li>Jaringan komputer global atau kumpulan komputer dan jaringan </li></ul><ul><li>yang sangat besar yang saling terkoneksi satu sama lain sehingga </li></ul><ul><li>bisa saling bertukar informasi </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    5. 5. Jaringan Komputer - Melayani Kebutuhan Informasi Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    6. 6. Konsep Internet Client/Server Architecture TCP/IP Protocol Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    7. 7. Analogi <ul><li>Cities and Towns = Networks and Servers </li></ul><ul><li>Connected by Roads and Highways = Cables and Wires </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    8. 8. Agenda Pemograman Web (2010/2011) – Hari Setiaji, S.Kom Internet Architecture History Applications
    9. 9. Sejarah Internet <ul><li>Dibangun oleh Departemen Pertahanan AS dalam rangka melakukan hubungan dengan para ilmuwan dan profesor universitas di seluruh dunia </li></ul><ul><li>Tahun 1968 – DARPA (Defense Advanced Research Project Agency) melakukan kontrak dengan BBN (Bold, Banek & Newman) untuk membuat ARPAnet </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    10. 10. Sejarah Internet <ul><li>Tahun 1970 – terbentuk 5 node : </li></ul><ul><ul><li>UCLA, Stanford, US Santa Barbara, Univ.of Utah, BBN </li></ul></ul><ul><li>Tahun 1974 dikembangkan protokol TCP/IP </li></ul><ul><li>Tahun I984- Internet dengan 1000 host menggunakan TCP/IP untuk pengiriman pesan </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    11. 11. Agenda Pemograman Web (2010/2011) – Hari Setiaji, S.Kom Internet Architecture History Applications
    12. 12. An internet is many things, depending on your point of view. <ul><li>It’s a physical network of networks </li></ul><ul><ul><li>Started by the military (ARPANET) </li></ul></ul><ul><ul><li>Subsidized in the US by NSF </li></ul></ul><ul><ul><li>Connects many networks worldwide </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    13. 13. Here’s a neat view of THE internet (circa 1990)...
    14. 14. Konsep Perangkat Lunak Akses Provider Kontent Provider Koneksi Internet Media Provider Pemograman Web (2010/2011) – Hari Setiaji, S.Kom Layer Fisik <ul><li>Kendala </li></ul><ul><li>Kabel </li></ul><ul><li>Jalur yang benar </li></ul><ul><li>Problem </li></ul><ul><li>Kapasitas </li></ul><ul><li>Penyebaran </li></ul><ul><li>Monopoli </li></ul>
    15. 15. Layer Perangkat Lunak Akses Provider Kontent Provider Koneksi Internet Media Provider Pemograman Web (2010/2011) – Hari Setiaji, S.Kom Layer Internet <ul><li>Kendala </li></ul><ul><li>Protokol </li></ul><ul><li>Router, Switch </li></ul><ul><li>Interkoneksi </li></ul><ul><li>Problem </li></ul><ul><li>Kehandalan </li></ul><ul><li>Kapasitas </li></ul><ul><li>Skala </li></ul>
    16. 16. Layer Perangkat Lunak Akses Provider Kontent Provider Koneksi Internet Media Provider Pemograman Web (2010/2011) – Hari Setiaji, S.Kom Layer Aplikasi <ul><li>Kendala </li></ul><ul><li>Software </li></ul><ul><li>Data </li></ul><ul><li>Problem </li></ul><ul><li>Kemudahan </li></ul><ul><li>Privasi </li></ul><ul><li>Keamanan </li></ul>
    17. 17. Agenda Pemograman Web (2010/2011) – Hari Setiaji, S.Kom Internet Architecture History Applications
    18. 18. Aplikasi <ul><li>Email, messaging, VoIP </li></ul><ul><li>Remote computing </li></ul><ul><li>Media </li></ul><ul><li>File sharing </li></ul><ul><li>Search </li></ul><ul><li>Discussions, communities </li></ul><ul><li>E-Commerce </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    19. 19. Commerce Neighborhood Digital Divide Education Governance Globalization Internet Architecture History Applications
    20. 20. World Wide Web <ul><li>Web </li></ul><ul><ul><li>Sistem terdistribusi yang sangat besar yang berisi jutaan klien dan server guna pengaksesan dokumen2 yang saling terhubung </li></ul></ul><ul><ul><li>Server : </li></ul></ul><ul><ul><ul><li>Mengelola koleksi dokumen </li></ul></ul></ul><ul><ul><ul><li>Tiap dokumen disimpan sebagai sebuah file </li></ul></ul></ul><ul><ul><ul><li>Dokumen dapat juga dihasilkan berdasarkan permintaan </li></ul></ul></ul><ul><ul><li>Klien : </li></ul></ul><ul><ul><ul><li>Menyediakan antarmuka yang mudah digunakan oleh pengguna untuk menampilkan dan mengakses dokumen2 </li></ul></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    21. 21. World Wide Web Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    22. 22. World Wide Web <ul><li>Format Dokumen : HTML </li></ul><ul><li>Protokol : HTTP </li></ul><ul><li>Mekanisme Identifier : URI (Uniform Resource Identifier) => menggunakan URL (Uniform Resource Locator) </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    23. 23. World Wide Web <ul><li>Struktur Dokumen yang dipertukarkan </li></ul><ul><ul><li>HTML </li></ul></ul><ul><ul><li>MIME Types => bagian-bagian non-HTML </li></ul></ul><ul><li>Penampilan pada layar </li></ul><ul><ul><li>HTML diparsing oleh klien dan divisualisasikan isinya </li></ul></ul><ul><ul><li>Untuk bagian non-HTML menggunakan </li></ul></ul><ul><ul><ul><li>Plug-in </li></ul></ul></ul><ul><ul><ul><li>Client extension </li></ul></ul></ul><ul><ul><ul><li>Helper Application </li></ul></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    24. 24. HTTP <ul><li>Hypertext Transfer Protocol : kumpulan aturan untuk pertukaran file (teks, grafik, gambar, suara, video, dll) pada web </li></ul><ul><li>Konsep penting </li></ul><ul><ul><li>Ide di mana suatu file bisa mengandung referensi pada file lainnya dengan transfer permintaan ke file tersebut </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    25. 25. HTTP Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    26. 26. URL <ul><li>Alamat sebuah file ( resources ) yang dapat diakses melalui internet </li></ul><ul><li>Jenis resource yang diambil tergantung protokol aplikasi internet yang berlangsung, misal HTTP, File, News. </li></ul><ul><ul><li>Contoh </li></ul></ul><ul><ul><ul><li>file://ftp.serverku.co.id/umum/files/webprog.doc </li></ul></ul></ul><ul><ul><ul><li>news://news.serverku.co.id/soc.culture.indonesia </li></ul></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    27. 27. URL <ul><li>Berisi </li></ul><ul><ul><li>nama protokol , dibutuhkan untuk mengakses resources </li></ul></ul><ul><ul><li>Nama domain , komputer tertentu yang terhubung dengan internet, tempat resource berada </li></ul></ul><ul><ul><li>Hirarki lokasi penyimpanan resources pada komputer tersebut </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    28. 28. URL <ul><li>URL berisi nama domain yang mengidentifikasikan suatu komputer yang spesifik di Internet dan sebuah deskripsi hierarkis dari suatu lokasi file pada komputer yang bersangkutan </li></ul><ul><li>Nama Domain Dikelola oleh InterNIC </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    29. 29. URL Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    30. 30. Domain Name System Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    31. 31. MIME TYPES <ul><li>MIME= Multipurpose Internet Mail Extensions </li></ul><ul><li>Membedakan top-level types dan sub-type </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    32. 32. MIME TYPES Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    33. 33. Web Application <ul><li>Sistem perangkat lunak yang berdasar pada teknologi-teknologi dan standar-standar W3C (World Wide Web Consortium) yang menyediakan sumberdaya tertentu seperti konten dan layanan-layanan melalui antarmuka web browser </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    34. 34. Kategori Aplikasi Web Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    35. 35. Document-Centric web (1) <ul><li>Bentuk awal aplikasi web </li></ul><ul><li>Halaman web disimpan dalam web-server dalam keadaan siap pakai (statis) </li></ul><ul><li>Halaman web diubah secara manual </li></ul><ul><li>Kerugian </li></ul><ul><ul><li>Informasi out-of-date </li></ul></ul><ul><ul><li>Kesulitan dalam peng-update-an informasi </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    36. 36. Document-Centric web (2) <ul><li>Keuntungan </li></ul><ul><ul><li>Sederhana </li></ul></ul><ul><ul><li>Stabil </li></ul></ul><ul><ul><li>Waktu respon singkat, karena halaman2 yang dibutuhkan sudah tersimpan di web server </li></ul></ul><ul><li>Yang masuk kategori </li></ul><ul><ul><li>Situs web statis </li></ul></ul><ul><ul><li>webcast </li></ul></ul><ul><ul><li>situs web personal </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    37. 37. Interactive Web <ul><li>Berkembang dengan adanya teknologi CGI ( Common Gateway Interface ) dan form-form HTML </li></ul><ul><li>Halaman web dan link dihasilkan secara dinamis berdasarkan masukan pengguna </li></ul><ul><li>Yang masuk kategori </li></ul><ul><ul><li>Virtual exhibitions </li></ul></ul><ul><ul><li>Situs berita </li></ul></ul><ul><ul><li>Timetable information </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    38. 38. Transactional web <ul><li>Menyediakan interaktivitas yang lebih dari web interaktif </li></ul><ul><li>Memungkinkan pengguna melakukan update terhadap isi web tertentu </li></ul><ul><li>Membutuhkan sistem basisdata </li></ul><ul><li>Yang masuk kategori </li></ul><ul><ul><li>Online Banking </li></ul></ul><ul><ul><li>Online Shopping </li></ul></ul><ul><ul><li>Booking System </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    39. 39. Workflow-based web <ul><li>Memungkinkan penanganan alur kerja (workflow) inter atau intra perusahaan, pengguna privat, atau public authorities </li></ul><ul><li>Otomatisasi proses dan operasi </li></ul><ul><li>Yang masuk kategori </li></ul><ul><ul><li>B2B (Business-to-Business) – e-commerce </li></ul></ul><ul><ul><li>E-government </li></ul></ul><ul><ul><li>Aplikasi web kesehatan yang mendukung workflow </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    40. 40. Collaborative web <ul><li>Digunakan untuk kerja sama antar pengguna </li></ul><ul><li>Biasanya kebutuhan komunikasi antar pengguna sangat tinggi </li></ul><ul><li>Digunakan untuk saling berbagi informasi dan workspace, melakukan rapat atau membuat keputusan </li></ul><ul><li>Yang masuk kategori </li></ul><ul><ul><li>Weblog </li></ul></ul><ul><ul><li>Wiki </li></ul></ul><ul><ul><li>E-learning </li></ul></ul><ul><ul><li>Sistem penjadwalan </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    41. 41. Social Web <ul><li>Pengguna saling berbagi informasi pribadi dengan pengguna lain yang memiliki kesamaan interest </li></ul><ul><li>Yang masuk kategori ini </li></ul><ul><ul><li>Situs pertemanan </li></ul></ul><ul><ul><li>Forum diskusi topik tertentu </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    42. 42. Portal-Oriented <ul><li>Menyediakan 1 pintu akses untuk berbagai sumber informasi dan layanan yang terpisah dan (berpotensi) heterogen </li></ul><ul><li>Yang masuk kategori </li></ul><ul><ul><li>Portal bisnis (melalui intranet/extranet) </li></ul></ul><ul><ul><li>Portal komunitas </li></ul></ul><ul><ul><li>Marketplace portal </li></ul></ul><ul><ul><ul><li>Horizontal (B2C, B2B) </li></ul></ul></ul><ul><ul><ul><li>Vertical (sektor yang sama, misal vendor/suplier ke manufacturer) </li></ul></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    43. 43. Ubiquitos <ul><li>Situs web yang menyediakan layanan terkustomisasi kapan pun, di manapun dan dapat diakses dengan berbagai peralatan </li></ul><ul><li>Contoh : menampilkan menu of the day, bagi pengguna yang mengunjungi restoran jam 11-2 siang melaui perangkat mobile </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    44. 44. Semantic Web <ul><li>Bentuk lanjut pengembangan aplikasi web </li></ul><ul><li>Tujuan : menampilkan informasi yang tidak hanya dapat dibaca manusia, namun juga dapat dipahami oleh mesin </li></ul><ul><li>Digunakan untuk memfasilitasi knowledge management (menghubungkan dan menggunakan ulang knowledge) – content syndication atau Recommender System </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    45. 45. Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    46. 46. Client Side vs Server Side <ul><li>Client-Side Scripting </li></ul><ul><li>Server-Side Scripting </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    47. 47. Client-Side Scripting <ul><li>Didesain untuk membuat suatu halaman web yang lebih dinamis yang mana halaman tersebut mengadakan interaksi yang tinggi dengan user namun dengan data yang lebih sedikit atau telah tersedia sebelumnya </li></ul><ul><li>Aplikasi dijalankan/dieksekusi di klien (web browser) </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    48. 48. Client-Side Scripting <ul><li>Contoh penggunaan </li></ul><ul><ul><ul><li>Aplikasi yang memerlukan banyak interaksi dengan pengguna seperti aplikasi web untuk permainan kartu, kalkulator, dan lain sebagainya </li></ul></ul></ul><ul><ul><ul><li>Pemeriksaan event pada browser , misalkan pemeriksaan saat tombol klik kanan </li></ul></ul></ul><ul><li>Contoh : JavaScript, VBScript </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    49. 49. Client-Side Scripting <ul><li>Kekurangan : Amat bergantung pada web browser </li></ul><ul><ul><li>Tiap-tiap browser memiliki kapabilitas dan kemampuan yang berbeda-beda bahkan untuk sebuah merek browser yang sama namun versi yang berbeda </li></ul></ul><ul><ul><li>Kelemahan ini tentu menyulitkan, terlebih jika navigasi halaman web banyak menggunakan client-side scripting (misal banyak menggunakan JavaScript sebagai alat bantu navigasi) </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    50. 50. Server-Side Scripting <ul><li>Didesain untuk memproses segala sesuatu yang berhubungan dengan server, seperti lingkungan dari server atau manipulasi data pada basisdata </li></ul><ul><li>Ciri dari server-side scripting : pengguna tidak dapat melihat script yang dijalankan pada server-side. </li></ul><ul><li>Pada awal perkembangan, server-side scripting banyak mempergunakan teknologi CGI ( Common Gateway Interface ) </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    51. 51. Server-Side Scripting <ul><li>Contoh : </li></ul><ul><ul><li>Active Server Pages (ASP) </li></ul></ul><ul><ul><li>Java Server Pages (JSP) </li></ul></ul><ul><ul><li>PHP:Hypertext Preprocessor (PHP) </li></ul></ul><ul><ul><li>ColdFusion (CFM) </li></ul></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom
    52. 52. Exercises <ul><li>Sebutkan situs-situs web populer (yang sering anda kunjungi) dan kelompokkan ke dalam kategori-kategori web yang ada </li></ul>Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

    ×