Pembelajaran Interaktif Web Bagi Guru dan Siswa SMKN 1 Kamal Madura

Fakultas Teknik, Universitas Trunojoyo Madura yang diketuai oleh Dr. Noor Ifada, S.T., M.ISD dengan anggota Sri Wahyuni, S.Kom., M.T juga melibatkan beberapa mahasiswa Triyani Fathur Rahman, Wrida Adi Wardana dan Dennis Thandy Nur C.  bekerja sama dengan SMK Negeri 1 Kamal telah menyelesaikan rangkaian Program Kemitraan Masyarakat (PKM) untuk tahun pelaksanaan 2019, dimulai pada bulan Maret sampai Desember 2019. PKM merupakan salah satu skema Pengabdian Masyarakat dari DRPM Ristekdikti, untuk pengajuan proposal tahun 2018. PKM bertujuan untuk membentuk/mengembangkan sekelompok masyarakat yang mandiri secara ekonomi dan sosial; membantu menciptakan ketentraman, dan kenyamanan dalam kehidupan bermasyarakat; dan meningkatkan keterampilan berpikir, membaca dan menulis atau keterampilan lain yang dibutuhkan (softskill dan hardskill). Bagi mahasiswa sendiri kegiatan ini sangat penting, guna mendapatkan pengalaman terjun langsung ke masyarakat dan berperan serta  meningkatkan kualitas pendidikan.

Mitra dalam kegiatan Program Kemitraan Masyarakat (PKM) ini adalah SMKN 1 Kamal yang merupakan salah satu SMK Negeri di Kabupaten Bangkalan yang memiliki kompetensi keahlian RPL. Selama ini, pembelajaran web di sekolah ini dilaksanakan dengan metode konvensional dimana aplikasi penyunting teks dan web browser dibuka dalam window yang terpisah (lihat Gambar 1.). Jadi proses pembelajaran dilaksanakan dalam dua tahapan, yaitu dari membuka window pertama untuk membuat skrip program dan kemudian membuka window kedua untuk untuk melihat hasilnya. Meskipun metode ini umum dan mudah untuk diterapkan, namun proses pembelajarannya menjadi kurang interaktif.

Metode pembelajaran akan menjadi interaktif apabila kedua aplikasi tersebut dapat ditampilkan dalam satu kesatuan window, sehingga ketika skrip program dibuat maka hasilnya akan langsung dapat dilihat di dalam window yang sama. 

Contoh tampilan media pembelajaran interaktif untuk pemrograman web di W3schools.com dan Khan Academy dapat dilihat dalam Gambar 2 dan Gambar 3. Dari kedua gambar tersebut terlihat jelas bahwa aplikasi penyunting teks (sisi kiri) dan aplikasi web browser (sisi kanan) berada dalam satu window yang sama.

Gambar 2. Media pembelajaran interaktif untuk pemrograman web di W3schools.com

Gambar 3. Media pembelajaran interaktif untuk pemrograman web di Khan Academy

Pemrograman web adalah salah satu aspek penting dalam pengembangan web. Web itu sendiri dapat dibagi menjadi dua jenis, yaitu web statis dan web dinamis.  Web statis merupakan jenis situs web yang menampilkan informasi yang sifatnya statis (tetap). Bahasa yang digunakan dalam pengembangan web statis adalah bahasa standar yaitu HTML (HyperText Markup Language), CSS (Cascading Style Sheet), dan JavaScript. Aplikasi yang digunakan untuk membuat atau mengelola konten digital dan dimanfaatkan sebagai media pembelajaran interaktif web adalah WordPress sebagai salah satu CMS (Content Management System) yang paling sering digunakan. Salah satu fitur yang tersedia dalam WordPress adalah fitur tab yang memungkinkan terjadinya pergantian pilihan antara aplikasi penyunting teks skrip program (tab HTML) dengan aplikasi tampilan dalam web browser (tab Visual) di dalam satu window yang sama, seperti yang diperlihatkan dalam Gambar 4.

            

Gambar 4. Fitur tab untuk pergantian aplikasi penyunting teks skrip program (tab HTML) dengan aplikasi tampilan dalam web browser (tab Visual)

Tim pelaksana kegiatan PKM mengenalkan dan memberikan pelatihan fitur yang ada di dalam WordPress sebagai media pembelajaran interaktif untuk mata pelajaran pemrograman web bagi guru dan siswa di SMKN 1 Kamal. Pelatihan dilaksanakan tanggal 22-27 April 2019 sehari penuh dari jam 09.00 hingga 16.00, selama enam hari pelatihan, peserta diberikan pembekalan mengenai materi-materi HTML, CSS, dan JavaScript melalui media CMS WordPress, seperti beberapa momen yang ditunjukkan pada Gambar. 5. Materi diberikan berselang-seling dengan latihan praktik. Pemateri didampingi asisten pemateri sehingga jika selama pelatihan peserta mengalami kesulitan saat mengerjakan latihan praktik maka asisten dengan segera membantu. Pertemuan pelatihan hari terakhir, peserta diberikan tugas untuk mengerjakan tugas mandiri membuat web sesuai studi kasus yang masing-masing peserta inginkan dengan memanfaatkan fitur HTML, CSS dan JavaScript yang dibutuhkan. Tugas mandiri digunakan tim pelaksana sebagai tolok ukur untuk menilai seberapa dalam tingkat pemahaman peserta selama PKM berjalan. Kesulitan-kesulitan yang ditemui oleh para peserta akan dibantu tim pelaksana melalui proses pendampingan.

Gambar 5. Beberapa dokumentasi selama pelatihan

Proses pendampingan dilaksanakan di sekolah, sebanyak lima kali pertemuan sebagaimana ditnjukkan pada Gambar 6. Peserta akan dibantu menemukan solusi selama masa pengerjaan tugas mandiri yang diberikan. Pendamping adalah asisten pemateri yang telah dilibatkan selama masa pelatihan, sehingga paham betul perkembangan peserta sedari awal. Jadwal pendampingan disepakati antara pemateri dan peserta, dimana pelaksanaannya dimulai bulan Juli hingga September, karena tugas mandiri harus sudah terkumpul pada tanggal 15 September 2019.  Materi pendampingan lebih kepada case by case problem solving, sebab setiap peserta membuat implementasi web dengan kasus yang berbeda-beda. Proses pendampingan ini tujuan utamanya adalah mengawal peserta hingga mampu secara mandiri membuat aplikasi web menggunakan CMS hingga pada tahap yang baik. Pada tahap pengembangan selanjutnya adalah tugas peserta dan sekolah dalam meningkatkan kemampuan lebiha baik dan lebih baik lagi.

Gambar 6. Dokumentasi kegiatan pendampingan di sekolah

Penutupan pada tanggal 10 Oktober 2019 kegiatan PKM dengan judul "Pembelajaran Interaktif Pemrograman Web Dengan Menggunakan Media CMS Bagi Guru Dan Siswa SMKN 1 Kamal" menjadi akhir dari selesainya program. 

Salah satu acara penutupan adalah penyerahan bantuan untuk mitra SMKN 1 Kamal sebagai penunjang kegiatan belajar mengajar pembelajaran interaktif di kelas, yaitu 2 buah monitor LED ukuran 43 inch dan 4 buah chromecast. Sarana ini diharapkan akan memudahkan guru dalam memberikan materi web, karena chromecast memudahkan koneksi dengan internet baik dari laptop maupun hp.

Gambar 7. Kegiatan Penutupan dan penyerahan bantuan kepada mitra SMKN 1 Kamal