RENCANA PELAKSANAAN PEMBELAJARAN ( RPP ) Mata Pelajaran Kelas / Semester Pertemuan Alokasi Waktu Kompetensi Dasar
: : : : :
Pemrograman Web dan Perangkat Bergerak XI / 3 1- 2 16 x 45 Menit Konsep Teknologi Web Page
A. Kompetensi Inti 1. Memahami,menerapkan, menganalisis pengetahuan faktual, konseptual, prosedural berdasarkan rasa ingintahunya tentang ilmu pengetahuan, teknologi, seni, budaya, dan humaniora dengan wawasan kemanusiaan, kebangsaan, kenegaraan, dan peradaban terkait fenomena dan kejadian, serta menerapkan pengetahuan prosedural pada bidang kajian yang spesifik sesuai dengan bakat dan minatnya untuk memecahkan masalah. 2. Mengolah, menalar, menyaji, dan mencipta dalam ranah konkret dan ranah abstrak terkait dengan pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu menggunakan metoda sesuai kaidah keilmuan. B. Kompetensi Dasar dan Indikator KOMPETENSI DASAR 3.1. Memahami konsep teknologi aplikasi web.
IPK 3.1.1 3.1.2
Memahami profesi dalam bidang teknologi informasi Memahami profesi dalam pengembangan aplikasi web
3.1.3 3.1.4 3.1.5
4.1. Menyajikan berbagai teknologi pengembang aplikasi web.
Memahami sejarah web Memahami cara kerja web Memahami alur pengembangan aplikasi web 3.1.6 Memahami perangkat pengembangan aplikasi web 3.1.7 Memahami alur pengembangan aplikasi web 4.1.1 Terampil dalam menyajikan cara kerja web 4.1.2 Terampil dalam menyajikan perangkat pengembangan aplikasi web
C. Tujuan pembelajaran Dengan Penjelasan dalam pembelajaran konsep teknologi aplikasi web ini, diharapkan siswa melakukan kerjasama, disiplin dalam kegiatan pembelajaran menemukan, dan bertanggungjawab dalam pembelajaran serta dapat. 1. Memahami profesi dalam bidang teknologi informasi 2. Memahami profesi dalam pengembangan aplikasi web 3. Memahami sejarah web 4. Memahami cara kerja web 5. Menyajikan cara kerja web 6. Memahami alur pengembangan aplikasi web 7. Memahami perangkat pengembangan aplikasi web 8. Memahami alur pengembangan aplikasi web 9. Menyajikan perangkat pengembangan aplikasi web D. Materi Ajar 1. Profesi dalam pengembangan aplikasi web Ada banyak ragam dalam profesi di dalam bidang Teknologi Informasi, bagaimana dengan profesi yang berada dalam lingkungan pengembangan aplikasi web? Berikut ini adalah profesi-profesi yang langsung terkait dalam pengembangan aplikasi web, diantaranya :
A. Web Designer Seorang desainer Web adalah orang yang bertanggung jawab untuk menentukan tampilan sebuah website B. Web Programmer Web Programmer bertugas dalam melakukan pengcodingan atau pemograman sebuah website agar dinamis. C. Web Tugasnya adalah untuk memaintenance suatu server, mengerti akan Sistem Operasi Server, baik itu mulai dari instalasi sampai kepada masalah (troubleshooting) D. Web Master Seoarang Web Master adalah seorang yang mengerti akan kesemua hal mulai dari disain, program dan keamanan server namun tidak terlalu turut mencampuri ke masing-masing divisi, cukup dengan mempertanggun jawabkan atas jalannya suatu situs (web). 2. Sejarah web Internet adalah jaringan komputer yang saling terhubung. Tidak ada perusahaan yang memiliki internet, yang merupakan upaya kerja sama diatur oleh sistem standar dan aturan. Tujuan dari menghubungkan komputer bersama-sama, tentu saja, adalah untuk berbagi informasi. Ada banyak cara informasi dapat dikirimkan antar komputer, termasuk email, transfer file (File Transfer Protocol), dan banyak layanan yang lebih khusus yang dibangun dalam layanan Internet. Metode ini standar untuk mentransfer data atau dokumen melalui jaringan dikenal sebagai protokol. WWW dikembangkan pertama kali di Pusat Penelitian Fisika Partikel Eropa (CERN : Organisation Europeenne pour la Recherche Nucleaire), Jenewa, Swiss. Pada tahun 1989 Berners-lee membuat pengajuan untuk proyek pembuatan hiperteks global, kemudian pada bulan Oktober 1990, 'World Wide Web' sudah dapat dijalankan dalam lingkungan CERN. Pada musim panas tahun 1991, WWW secara resmi digunakan secara luas pada jaringan Internet. 3. Cara Kerja Web Bagaimana cara kerja website? Cara kerja website pada dasarnya yaitu input, proses dan output. Website adalah halaman informasi yang disediakan melalui jalur internet sehingga bisa diakses di seluruh dunia selama terkoneksi dengan jaringan internet. Website merupakan komponen atau kumpulan komponen yang terdiri dari teks, gambar, suara, video, animasi dan lain sebagainya. Sehingga lebih merupakan media informasi yang menarik untuk dikunjungi. Semua website pasti mempunyai domain dan web server. Domain bisa kita analogikan sebagai alamat rumah, sedangkan web server sebagai rumah untuk menyimpan berbagai perabotan rumah tangga. Bagaimana cara website bekerja? Pertama, misal Anda ingin mencari informasi melalui mesin pencari (search engine) Google. Tentunya Anda terlebih dahulu akan menjalankan aplikasi web browser baik itu Internet Explorer, Mozilla, Chrome, Opera, dan lain sebagainya yang telah terkoneksi internet. An da lalu mengetikan URL (Uniform Resource Locator) atau domain di web browser, misal www.google.com atau google.com.
Nah pada saat itu domain yang Anda ketikkan tersebut perlu diterjemahkan menjadi alamat IP karena komputer Anda sebenarnya hanya bisa mengakses alamat IP. Tugas penerjemahan ini dilakukan oleh Domain Name System (DNS), karena itu komputer Anda akan meminta bantuan DNS server yang terdaftar untuk menerjemahkan nama domain tersebut. DNS server menemukan alamat google.com dan memberikan alamat IP-nya kepada browser Anda. Browser Anda segera menuju server dengan alamat IP yang didapatkan dari DNS server dan meminta halaman yang tersedia didalam web server tersebut. Setelah w eb server menerima permintaan (request), web server lalu akan memprosesnya (process) dan memberikan hasil data (output). Untuk lebih jelasnya silahkan lihat ilustrasi gambar cara kerja website di bawah ini
4. Perangkat Pengembang Aplikasi Web Untuk perangkat pengembangan aplikasi web dapat dikelompokan menjadi perangkat keras dan perangkat lunak. A. Perangkat Keras Untuk lingkungan pengembangan web yang nyaman, berikut ini peralatan yang sebaiknya disediakan: Komputer Utama, dengan operating system Macintosh, Windows, ataupun Linux. Perusahaan B. Perangkat Lunak Untuk perangkat lunak pengembangan web dapat dikelompokkan menjadi beberapa, diantaranya : 1. Web page authoring Ini adalah kelompok perangkat lunak seperti desktop publishing tetapi format yang dihasilkan adalah halaman web. Aplikasi ini biasanya bersifat “WYSIWYG” (What You See Is What You Get, dibaca “whizzy-wig”) yaitu apa yang kamu lihat, itulah yang kamu dapatkan. Jadi aplikasi ini biasanya ketika membuat tampilannya seperti yang akan dihasilkan. Beberapa contoh aplikasi yang termasuk dalam kelompok ini : Adobe Dreamweaver, aplikasi ini berbayar dan dibawah lisensi perusahaan Adobe, aplikasi ini banyak digunakan oleh pengembang web. Memiliki banyak fasilitas dan fiture. 10. Microsoft Expression Web (lisensi dari Windows). Bagian dari Microsoft’s suite yang merupakan aplikasi perancangan professional. 11. Nvu (Linux, Windows, dan Mac OS X). Tidak ingin membayar untuk Editor WYSIWYG? Nvu (diucapkan N-view, untuk "pandangan baru") adalah sebuah aplikasi open source (sumber terbuka) yang cocok dengan banyak fitur dalam Adobe Dreamweaver, dan dapat diunduh secara gratis di nvu.com.
2. Editor Ini adalah kelompok perangkat lunak yang kebalikan dari Adobe Dreamweaver Microsoft Expression Web. Aplikasi ini tidak lagi “WYSIWYG” (What You See Is What You Get”) tetapi lebih ke kode HTML. Beberapa contoh aplikasi yang termasuk dalam kelompok ini : TextPad (Windows saja). TextPad adalah plain-text sederhana dan murah untuk editor kode di Windows. Teks Sublime (Window, Mac, Linux). Editor teks ini terlihat dipreteli namun memiliki banyak fungsi (seperti kode warna dan ikhtisar kode penuh) bagi pengembang web. Coda oleh Panic (hanya Macintosh). Pengguna Coda seperti alur kerja yang visual, alat-alat manajemen file, dan built-in akses terminal. Textmate oleh MacroMates (hanya Macintosh). Editor teks canggih ini memiliki alat manajemen proyek dan antarmuka yang terintegrasi dengan sistem operasi Mac. Hal ini semakin populer karena disesuaikan, kaya fitur, dan murah. BBEdit oleh Bare Bones Software (hanya Macintosh). Untuk pengembang web banyak fitur shortcut yang besar telah membuat editor terkemuka berbasis Mac 3. Aplikasi editing gambar dan menggambar Untuk menambahkan gambar ke halaman web, akan perlu program editing gambar. Berikut ini beberapa aplikasi yang cukup populer : Adobe Photoshop. Photoshop dapat dikatakan sebagai standar industri untuk penciptaan gambar baik dalam cetak maupun dunia web. Adobe Photoshop Elements. Versi ini lebih ringan dari Photoshop dirancang untuk mengedit foto dan manajemen, tetapi beberapa penggemar menemukan bahwa ia memiliki semua alat yang diperlukan untuk menempatkan gambar pada halaman web
E. Metode Pembelajaran 1. Model pembelajaran
2. Metode Pembelajaran F.
: Saintifik (scientific), inquiri terbimbing menggunakan kelompok diskusi yang berbasis masalah (problem-based learning). : Ceramah, diskusi, Tanya jawab dan penugasan
Media pembelajaran Media : Media presentasi powerpoint, lembar kerja siswa, lembar penilaian.
G. Langkah – langkah Pembelajaran Pertemuan 1 Kegiatan A. Pendahuluan
B. Inti
C. Penutup
Deskripsi 1. Siswa menjawab sapaan guru, berdoa, dan mengondisikan diri siap belajar 2. Guru dan siswa bertanya jawab berkaitan dengan identitas diri yang dibutuhkan sebagai warga negara yang baik. 3. Guru menyampaikan tujuan pembelajaran 4. Guru memotivasi siswa agar semakin giat belajar Mengamati : 1. Siswa mengamati dan mendengarkan penjelasan mengenai profesi dalam bidang teknologi informasi 2. Siswa mengamati dan mendengarkan penjelasan mengenai profesi dalam pengembangan aplikasi web. 3. Siswa mengamati dan mendengarkan penjelasan mengenai sejarah dan cara kerja web
Nilai Karakter Santun, Proaktif, responsif
Alokasi Waktu
15 Menit
Disiplin, Proaktif, kreatif
Menanya : 1. Siswa siswa berdiskusi dan menganalisa mengenai profesi dalam bidang teknologi Proaktif, informasi kreatif 2. Siswa berduskisi dan menganalisa mengenai profesi dalam pengembangan aplikasi web. 3. siswa berdiskusi dan menganalisa mengenai sejarah dan cara kerja web Mengeksplorasi: 1. Siswa menyajikan cara kerja aplikasi web. Kreatif 2. Siswa menyajikan cara pengembangan teknologi aplikasi web. Mengasosiasi: 1. Siswa membuat sebuah kesimpulan tentang Proaktif, kreatif, cara kerja dan pengembangan teknologi kerja aplikasi web sama Mengkomunikasikan: 1. Siswa membuat sebuah laporan dan mempresentasikan hasil dari cara kerja Proaktif teknologi aplikasi web. 1. Mereview kembali materi yang telah disampaikan Proakrif, 2. Siswa mengerjakan evaluasi Kreatif, 3. Siswa saling memberikan umpan balik hasil Tanggung evaluasi pembelajaran yang telah dicapai. jawab
150 Menit
15 Menit
Pertemuan 2 Kegiatan A. Pendahuluan
B. Inti
Deskripsi 1. Siswa menjawab sapaan guru, berdoa, dan mengondisikan diri siap belajar 2. Guru dan siswa bertanya jawab berkaitan dengan identitas diri yang dibutuhkan sebagai warga negara yang baik. 3. Guru menyampaikan tujuan pembelajaran 4. Guru memotivasi siswa agar semakin giat belajar Mengamati : 1. Siswa mengamati dan mendengarkan penjelasan mengenai alur pengembangan aplikasi web 2. Siswa mengamati dan mendengarkan penjelasan mengenai perangkat pengembangan aplikasi web Menanya : 1. Siswa berdiskusi dan menganalisa mengenai alur pengembangan aplikasi web
Nilai Karakter Santun, Proaktif, responsif
Alokasi Waktu
15 Menit
Disiplin, Proaktif, kreatif
Proaktif, Siswa siswa berdiskusi dan menganalisa kreatif mengenai perangkat pengembangan aplikasi web Mengeksplorasi: Kreatif 3. Siswa menyajikan cara kerja aplikasi web. 4. Siswa menyajikan cara pengembangan teknologi aplikasi web. Proaktif, Mengasosiasi: kreatif, 2. Siswa membuat sebuah kesimpulan tentang kerja cara kerja dan pengembangan teknologi sama aplikasi web Mengkomunikasikan: 1. Siswa membuat sebuah laporan dan mempresentasikan hasil dari cara kerja Proaktif teknologi aplikasi web. 1. Mereview kembali materi yang telah disampaikan Proakrif, 2. Siswa mengerjakan evaluasi Kreatif, 3. Siswa saling memberikan umpan balik hasil Tanggung evaluasi pembelajaran yang telah dicapai. jawab
2.
3. Penutup
150 Menit
15 Menit
H. Sumber Belajar Buku sekolah electronik Pemrograman Web kurikulum 2013, buku sekolah electronic Rekayasa Perangkat Lunak Jilid 3 untuk SMK, Ainur Rofiq Mulyanto, dkk. 2008, Modul Rekayasa Perangkat Lunak 2, Yudistira, Bogor.2011, sumber dari internet serta sumber lain yang relevan. I.
Alat Pembelajaran 1. Laptop 2. LCD 3. White board 4. Spidol
J. Penilaian Hasil Belajar 1. Teknik Penilaian a. P ngamatan b. Test tertulis 2. Prosedur Penilaian No Aspek yang dinilai Teknik Penilaian Waktu Penilaian 1. Sikap Pengamatan Selama pembelajaran dan a. Terlibat aktif saat diskusi dalam pembelajaran konsep teknologi aplikasi web. b. Bekerjasama No Aspek yang dinilai Teknik Penilaian Waktu Penilaian c. Toleran terhadap proses pemecahan masalah yang berbeda dan 2. Pengetahuan Pengamatan dan tes Penyelesaian tugas individu a. Menjelaskan sejarah dan kelompok dan cara kerja web. b. Menemukan pola serta cara kerja web secara kreatif c. 3.
Menerapkan konsep sesuai dengan
Keterampilan karakteristiknya dalam Pengamatan a. Terampil menerapkan konsep/prinsip dan strategi pemecahan masalah yang relevan yang berkaitan dengan konsep cara kerja web
Penyelesaian tugas (baik individu maupun kelompok) dan saat diskusi
K. Instrumen Penilaian Hasil Belajar a. Tes tertulis b. Lembar Pengamatan penilaian keterampilan
Mengetahui, Kepala Sekolah
Tidore, 15 Juli 2019 Guru Mata Diklat
ALI DJUMATI, S.Pd. M.Si NIP. 19770106 200312 1 005
YUNUS SYAMSI, S.Kom
Lampiran 1 Test tertulis
NO. 1.
2.
3.
4.
SOA L Jelaskan pengertian dari web designer!
JAWABA Merupakan orang yang N melakukan kegiatan perencanaan, termasuk studi kelayakan, analisis dan desain terhadap suatu proyek pembuatan Jelaskan cara kerja web! Pertama, misal web. Anda ingin mencari informasi aplikasi berbasis melalui mesin pencari (search engine) Google. Tentunya Anda terlebih dahulu akan menjalankan aplikasi web browser baik itu Internet Explorer, Mozilla, Chrome, Opera, dan lain sebagainya yang telah terkoneksi internet. Anda lalu mengetikan URL (Uniform Resource Locator) atau domain di web browser, misal www.google.com atau google.com. Nah pada saat itu domain yang Anda ketikkan tersebut perlu diterjemahkan menjadi alamat IP karena komputer Anda sebenarnya hanya bisa mengakses alamat IP. Tugas penerjemahan ini dilakukan oleh Domain Name System (DNS), karena itu komputer Anda akan meminta bantuan DNS server yang terdaftar untuk menerjemahkan nama domain tersebut. DNS server menemukan alamat google.com dan memberikan alamat IP-nya kepada browser Alternatif model dari Formulasi, Perencanaan (planning), Analisis (analysis), Pengembangan Aplikasi Rekayasa (engineering), Implementasi (page Web adalah! generation) & pengujian (testing), Evaluasi oleh konsumen Sebutkan 3 contoh software Adobe Dreamweaver, Microsoft Expression Web (lisensi dari yang termasuk Web Windows), Nvu (Linux, Windows, dan page authoring! Mac OS X).
Kreteria penilaian No Soal (Bobot) a. b. 1 c. (Bobot 25) d. e.
Kriteria Jawaban tepat atau benar semua Jawaban sebagian besar benar Jawaban sebagian kecil benar Jawaban salah Tidak menjawab SkorMaksimal
Skor 25 20 10 5 0 25
1 (Bobot 25)
a. b. c. d. e.
1 (Bobot 25)
a. b. c. d. e.
Jawaban tepat atau benar semua Jawaban sebagian besar benar Jawaban sebagian kecil benar Jawaban salah Tidak menjawab SkorMaksimal Jawaban tepat atau benar semua Jawaban sebagian besar benar Jawaban sebagian kecil benar Jawaban salah Tidak menjawab
1 (Bobot 25)
a. b. c. d. e.
SkorMaksimal Jawaban tepat atau benar semua Jawaban sebagian besar benar Jawaban sebagian kecil benar Jawaban salah Tidak menjawab SkorMaksimal
25 20 10 5 0 25 25 20 10 5 0 25 25 20 10 5 0 25
LEMBAR PENGAMATAN PENILAIAN KETERAMPILAN Mata Pelajaran Kelas/Semester Tahun Pelajaran Waktu Pengamatan
: Pemrograman Web dan Perangkat Bergerak : XI RPL / 3 : 2019/2020 : 45 Menit
Indikator terampil menerapkan konsep/prinsip dan strategi pemecahan masalah yang relevan yang berkaitan dengan konsep teknologi aplikasi web. 1. Kurang terampil jika sama sekali tidak dapat menerapkan konsep/prinsip dan strategi pemecahan masalah yang relevan yang berkaitan dengan konsep teknologi aplikasi web. 2. Terampil jika menunjukkan sudah ada usaha untuk menerapkan konsep/prinsip dan strategi pemecahan masalah yang relevan yang berkaitan dengan konsep teknologi aplikasi web tetapi belum tepat. 3. Sangat terampill jika menunjukkan adanya usaha untuk menerapkan konsep/prinsip dan strategi pemecahan masalah yang relevan yang berkaitan dengan konsep teknologi aplikasi web.dan sudah tepat. Bubuhkan tanda √ pada kolom-kolom sesuai hasil pengamatan. KELAS XI-RPL KETERAMPILAN NO.
MENERAPKAN KONSEP/PRINSIP DAN STRATEGI PEMECAHAN MASALAH
NAMA SISWA
KT 1 2 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
T
ABD. FATAH FARHANI ABD. KARIM M. SALEH AKBAR DANOEARTA ALJUFRI H. GAMTINA AMIRUDIN MARSAOLY ARI PRABU JAYA ASPAR ASRIL E. SURURE FADLY MARSAOLY FAUZAN M PATTY ISKANDAR LAODE JULFIKRI KOMARUDDIN N.S. LIMORO M. BISWAN NAWAWI M. FAHRIZAL R. IBRAHIM M. FERGIAWAN MAKMUR M. RAIS AMIN M. ROVAN TAUFIK FAUDU M. ZEN FABANYO MALIK MAHMUD MOH TAKDIR RAKIB MUAIMAR AL, FARIK MUHAMMAD TEGAR DAHLAN SAMSUDIN HASIM SANDI ABUBAKAR SAYYID YAHYA USRIN DAHLAN ZAINI MUKHTAROM IBRAHIM
Keterangan: KT : Kurang terampil
T
: Terampil
ST : Sangat terampil
ST