|
UNIVERSITAS KLABAT
|
RPS-57201-SISW315 |
| RENCANA PEMBELAJARAN SEMESTER | ||||||
| MATA KULIAH (MK) | KODE | Rumpun MK | BOBOT (sks) | SEMESTER | Tanggal Penyusunan | |
| Pengembangan Web Front-End/ Front-End Web Development | SISW315 | Application Development / Programming | 3 | 0 | 5 | 23 Jan 2024 |
| Pengesahan | Dosen Pengembang RPS | Koordinator RMK | Ka PRODI |
 Semmy Taju |
 Stenly Adam |
 Jimmy Herawan Moedjahedy |
| Capaian Pembelajaran | CPL-PRODI yang dibebankan pada MK | |
| CPL08 | Lulusan memiliki kemampuan untuk merancang aplikasi interaktif dan sistem informasi yang efisien, mempertimbangkan aspek fungsionalitas, keamanan, dan user experience. | |
| CPL09 | Lulusan mampu mengembangkan dan mengimplementasikan aplikasi atau sistem informasi yang telah dirancang dengan memanfaatkan teknologi dan metodologi terkini, memastikan kesesuaian dengan kebutuhan organisasi. | |
| Capaian Pembelajaran Mata Kuliah (CPMK) | ||
| CPMK04 | Mampu merancang dan mengembangkan sistem dan aplikasi inovatif | |
| CPMK09 | Mampu merancang aplikasi sistem informasi dengan user experience dan keamanan | |
| CPMK23 | Mampu merancang aplikasi interaktif dan sistem informasi | |
| Kemampuan akhir tiap tahapan belajar (Sub-CPMK) | ||
| sub.cpmk.SISW315.CPMK04.1 | Mampu mengoperasikan online repository Github | |
| sub.cpmk.SISW315.CPMK04.2 | Memahami konsep Branching dan Pull Requst pada Github Ketika bekerja sama dalam kelompok | |
| sub.cpmk.SISW315.CPMK04.3 | Memahami tools yang digunakan dalam pengembangan aplikasi web | |
| sub.cpmk.SISW315.CPMK04.4 | Memahami konsep component, props dan state pada ReactJS | |
| sub.cpmk.SISW315.CPMK09.1 | Mampu mengintegrasikan aplikasi web dengan Bootstrap dan REST API | |
| sub.cpmk.SISW315.CPMK09.2 | Mampu membuat aplikasi web real time yang terintegrasi dengan Firebase. | |
| sub.cpmk.SISW315.CPMK23.1 | Memahami tentang sejarah perkembangan Bahasa pemograman JavaScript, Framework JavaScript dan tools yang digunakan dan cara menjalankan JavaScript di browser dan Node JS | |
| sub.cpmk.SISW315.CPMK23.2 | Memahami syntax dan konsep dasar pemograman JavaScript ES5 | |
| sub.cpmk.SISW315.CPMK23.3 | Memahami syntax dan konsep pemograman JavaScript ES6 | |
| sub.cpmk.SISW315.CPMK23.4 | Mampu mengoperasikan dan menjalankan perintah-perintah Git pada terminal/command prompt | |
| Korelasi CPMK terhadap Sub-CPMK | ||
| CPMK23 |
sub.cpmk.SISW315.CPMK23.1 sub.cpmk.SISW315.CPMK23.2 sub.cpmk.SISW315.CPMK23.3 sub.cpmk.SISW315.CPMK23.4 |
|
| CPMK04 |
sub.cpmk.SISW315.CPMK04.1 sub.cpmk.SISW315.CPMK04.2 sub.cpmk.SISW315.CPMK04.3 sub.cpmk.SISW315.CPMK04.4 |
|
| CPMK09 |
sub.cpmk.SISW315.CPMK09.1 sub.cpmk.SISW315.CPMK09.2 |
|
| Deskripsi Singkat MK | Mata kuliah Front-end Web Development merupakan mata kuliah dengan materi pembuatan aplikasi web yang real-time, dinamis dan memiliki tampilan yang responsive. Bahasa pemograman yang digunakan adalah JavaScript dengan framework ReactJS. Dalam mata kuliah ini mahasiswa juga akan belajar bagaimana bekerja sama dalam membuat aplikasi web secara tim dengan menggunakan tools git dan github. Hasil akhir yang harus dicapai mahasiswa adalah kemampuan membuat aplikasi web yang terintegrasi dengan Firebase dengan memiliki fitur CRUD (create, read, update dan delete). | |
| Bahan Kajian : Materi Pembelajaran | The Front-end Web Development course is a course with material on creating web applications that are real-time, dynamic and have a responsive appearance. The programming language used is JavaScript with the ReactJS framework. In this course students will also learn how to work together to create web applications as a team using git and github tools. The final result that students must achieve is the ability to create web applications that are integrated with Firebase and have CRUD (create, read, update and delete) features. | |
| Pustaka | Utama | |
|
||
| Pendukung | ||
|
||
| Dosen Pengampu | Adam, Stenly, Taju, Semmy Wellem | |
| Mata Kuliah Syarat | Object Oriented Programming | |
| Pertemuan Ke | Kemampuan akhir tiap tahapan belajar (Sub-CPMK) | Penilaian | Bentuk Pembelajaran; Metode Pembelajaran; Penugasan Mahasiswa; | Materi Pembelajaran | Bobot Penilaian | ||
|---|---|---|---|---|---|---|---|
| Indikator | Kriteria & Teknik | Luring | Daring | ||||
| 1 | sub.cpmk.SISW315.CPMK23.1-Memahami tentang sejarah perkembangan Bahasa pemograman JavaScript, Framework JavaScript dan tools yang digunakan dan cara menjalankan JavaScript di browser dan Node JS | Ketepatan mahasiswa dalam menjelaskan tentang sejarah dan perkembangan JavaScript, Framework JavaScript dan mampu untuk menjalankan aplikasi JavaScript sederhana melalui Browser dan juga Node JS |
Kriteria Penguasaan materi Teknik Ceramah dan Diskusi |
kehadiran,Ceramah,[CR=60 Menit] |
Topik JavaScript and React Introduction: a) Sejarah dan perkembangan JavaScript b) React Introduction c) How to run JavaScript Sub Topik |
0 | |
| 2 | sub.cpmk.SISW315.CPMK23.2-Memahami syntax dan konsep dasar pemograman JavaScript ES5 | Ketepatan mahasiswa dalam menggunakan syntax dasar pemograman JavaScript dan mampu menerapkannya dalam memecahkan masalah |
Kriteria Ketepatan konsep atau teori yang digunakan Teknik Ceramah diskusi |
Tugas,Project Based Learning,[PBL=30 Menit] |
Topik Basic JavaScript ES5 a) Variables b) Operators c) Function d) Array e) Object f) Conditional g) Loop Sub Topik Membuat program dengan menggunakan fungsi JavaScript, Array dan Object |
5 | |
| 3 | sub.cpmk.SISW315.CPMK23.2-Memahami syntax dan konsep dasar pemograman JavaScript ES5 sub.cpmk.SISW315.CPMK23.3-Memahami syntax dan konsep pemograman JavaScript ES6 | Ketepatan mahasiswa dalam menggunakan syntax pemograman JavaScript ES6 dan mampu menerapkannya dalam memecahkan masalah |
Kriteria Ketepatan analisis dan interpretasi Teknik Ceramah, diskusi |
Tugas,Project Based Learning,[PBL=60 Menit] |
Topik Basic JavaScript ES6 a) Let & Const b) String Literals c) Arrow Function d) Default Parameter e) Destructuring f) Rest & Spread Operator Sub Topik |
2 | |
| 4 | sub.cpmk.SISW315.CPMK23.3-Memahami syntax dan konsep pemograman JavaScript ES6 | Ketepatan mahasiswa dalam menggunakan syntax pemograman JavaScript ES6 dan mampu menerapkannya dalam memecahkan masalah |
Kriteria Kemampuan sintesis dan integrasi materi Teknik Ceramah diskusi Penjelasan materi pertemuan 7 Menanyakan materi yang belum jelas ke dosen Latihan membuat program Diskusi |
Tugas,Problem Based Learning,[PBL=60 Menit] |
Topik Asynchronous JS Class Sub Topik |
3 | |
| 5 | sub.cpmk.SISW315.CPMK04.1-Mampu mengoperasikan online repository Github sub.cpmk.SISW315.CPMK04.2-Memahami konsep Branching dan Pull Requst pada Github Ketika bekerja sama dalam kelompok | Memiliki pemahaman tentang cara mengoperasikan online repository Github dan memahami konsep branching dan pull request |
Kriteria Teknik • Penjelasan materi pertemuan 9, 10 • Menanyakan materi yang belum jelas ke dosen • Diskusi |
Project,Problem Based Learning,[PBL=60 Menit] |
Topik a) Working on online repository (remote) using Github b) Branches c) Pull Request d) Merge Conflict Sub Topik |
5 | |
| 6 | sub.cpmk.SISW315.CPMK04.3-Memahami tools yang digunakan dalam pengembangan aplikasi web | Memiliki pemahaman tentang tools yang digunakan dalam pengembangan aplikasi web dan memahami konsep component, props dan state pada ReactJS |
Kriteria Kemampuan pemecahan masalah Teknik • Penjelasan materi pertemuan 11, 12 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi |
Project,Problem Based Learning,[PBL=60 Menit] |
Topik Basic ReactJS a) Setup environtment b) Basic Component c) State d) Props Sub Topik |
5 | |
| 7 | sub.cpmk.SISW315.CPMK04.3-Memahami tools yang digunakan dalam pengembangan aplikasi web sub.cpmk.SISW315.CPMK04.4-Memahami konsep component, props dan state pada ReactJS | Memiliki pemahaman tentang tools yang digunakan dalam pengembangan aplikasi web dan memahami konsep component, props dan state pada ReactJS |
Kriteria Kemampuan pemecahan masalah Teknik • Penjelasan materi pertemuan 13, 14 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi |
Project,Problem Based Learning,[PBL=90 Menit] |
Topik Sub Topik |
5 | |
| 8 | sub.cpmk.SISW315.CPMK04.1-Mampu mengoperasikan online repository Github sub.cpmk.SISW315.CPMK04.2-Memahami konsep Branching dan Pull Requst pada Github Ketika bekerja sama dalam kelompok sub.cpmk.SISW315.CPMK04.3-Memahami tools yang digunakan dalam pengembangan aplikasi web sub.cpmk.SISW315.CPMK04.4-Memahami konsep component, props dan state pada ReactJS | Ketepatan mencapai tujuan Proyek 1 untuk CPMK1, CPMK2, CPMK3 |
Kriteria Kesesuaian sintaks atau implementasi teknis Teknik Mengikuti ujian mid |
UTS,Problem Based Learning,[PBL=90 Menit] |
Topik Mid Exam Sub Topik |
20 | |
| 9 | sub.cpmk.SISW315.CPMK09.1-Mampu mengintegrasikan aplikasi web dengan Bootstrap dan REST API | Memiliki pemahaman tentang cara mengintegrasi ReactJS dengan Bootstrap |
Kriteria Kesesuaian output dengan spesifikasi yang diminta Teknik • Penjelasan materi pertemuan 15, 16 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi |
Project,Problem Based Learning,[PBL=90 Menit] |
Topik Routing and REST API Integration a) Bootstrap integration b) React Router DOM Sub Topik |
5 | |
| 10 | sub.cpmk.SISW315.CPMK09.1-Mampu mengintegrasikan aplikasi web dengan Bootstrap dan REST API | Memiliki pemahaman tentang cara mengintegrasi ReactJS dengan Bootstrap |
Kriteria Kesesuaian sintaks atau implementasi teknis Teknik |
Project,Problem Based Learning,[PBL=90 Menit] |
Topik c) HTTP Request concept d) API Testing using Postman e) Online Fake API f) REST API Integration using vanillaJS and axios Sub Topik |
5 | |
| 11 | sub.cpmk.SISW315.CPMK09.2-Mampu membuat aplikasi web real time yang terintegrasi dengan Firebase. | Memiliki pemahaman tentang state manajemen |
Kriteria Kemampuan sintesis dan integrasi materi Teknik • Penjelasan materi pertemuan 19, 20 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi |
Latihan,Problem Based Learning,[PBL=90 Menit] |
Topik State Manajemen a) State manajemen concept b) React Redux c) Store, reducer, combine reducer, action creator, redux thunk Sub Topik |
5 | |
| 12 | sub.cpmk.SISW315.CPMK09.2-Mampu membuat aplikasi web real time yang terintegrasi dengan Firebase. | Memiliki pemahaman tentang integrasi firebase |
Kriteria Ketepatan metode atau prosedur penyelesaian Teknik • Penjelasan materi pertemuan 21, 22 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi |
Praktikum,Problem Based Learning,[PBL=90 Menit] |
Topik Firebase Integration a) Firebase introduction b) Firebase setup and registration Sub Topik |
5 | |
| 13 | sub.cpmk.SISW315.CPMK09.2-Mampu membuat aplikasi web real time yang terintegrasi dengan Firebase. | Memiliki pemahaman tentang integrasi firebase |
Kriteria Kesesuaian output dengan spesifikasi yang diminta Teknik • Penjelasan materi pertemuan 23, 24 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi |
Praktikum,Problem Based Learning,[PBL=90 Menit] |
Topik c) Firebase authentication d) Firebase realtime database Sub Topik |
5 | |
| 14 | sub.cpmk.SISW315.CPMK09.2-Mampu membuat aplikasi web real time yang terintegrasi dengan Firebase. | Memiliki pemahaman tentang integrasi firebase |
Kriteria Kesesuaian output dengan spesifikasi yang diminta Teknik • Penjelasan materi pertemuan 25, 26 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi |
Praktikum,Problem Based Learning,[PBL=90 Menit] |
Topik CRUD using firebase (create, read, update, delete) Sub Topik |
5 | |
| 15 | sub.cpmk.SISW315.CPMK09.2-Mampu membuat aplikasi web real time yang terintegrasi dengan Firebase. | Memiliki pemahaman tentang integrasi firebase |
Kriteria Kemampuan sintesis dan integrasi materi Teknik • Penjelasan materi pertemuan 27, 28 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi |
Praktikum,Problem Based Learning,[PBL=90 Menit] |
Topik CASE studi Sub Topik |
5 | |
| 16 | sub.cpmk.SISW315.CPMK09.1-Mampu mengintegrasikan aplikasi web dengan Bootstrap dan REST API sub.cpmk.SISW315.CPMK09.2-Mampu membuat aplikasi web real time yang terintegrasi dengan Firebase. | Ketepatan mencapai tujuan Proyek 2 untuk CPMK4, CPMK5 |
Kriteria Kesesuaian output dengan spesifikasi yang diminta Teknik Mengumpulkan revisi source code proyek 2 menggunakan github |
Problem Based Learning,Problem Based Learning,[PBL=90 Menit] |
Topik Final Exam Demo Proyek Sub Topik |
20 | |
Teknik Penilaian CPMK
| CPL | MK | CPMK | Tugas | Latihan | Project | Mid Test (UTS) | Final Test (UAS) | |
|---|---|---|---|---|---|---|---|---|
| CPL03 | Pengembangan Web Front-End/ Front-End Web Development | CPMK04 | Y | Y | ||||
| CPL08 | Pengembangan Web Front-End/ Front-End Web Development | CPMK09 | Y | Y | ||||
| CPL08 | Pengembangan Web Front-End/ Front-End Web Development | CPMK23 | Y | Y |
Prosedur Penilaian CPMK
1. Komponen Penilaian CPMK
| CPL | CPMK | Sub-CPMK | Detail Penugasan (Teknik Penilaian) | Bobot % | Kriteria Penilaian |
|---|---|---|---|---|---|
| CPL08 | CPMK23 | sub.cpmk.SISW315.CPMK23.1 | Ceramah dan Diskusi | 0 | Penguasaan materi |
| CPL08 | CPMK23 | sub.cpmk.SISW315.CPMK23.2 | Ceramah diskusi | 5 | Ketepatan konsep atau teori yang digunakan |
| CPL08 | CPMK23 | sub.cpmk.SISW315.CPMK23.2, sub.cpmk.SISW315.CPMK23.3 | Ceramah, diskusi | 2 | Ketepatan analisis dan interpretasi |
| CPL08 | CPMK23 | sub.cpmk.SISW315.CPMK23.3 | Ceramah diskusi Penjelasan materi pertemuan 7 Menanyakan materi yang belum jelas ke dosen Latihan membuat program Diskusi | 3 | Kemampuan sintesis dan integrasi materi |
| CPL03 | CPMK04 | sub.cpmk.SISW315.CPMK04.1, sub.cpmk.SISW315.CPMK04.2 | • Penjelasan materi pertemuan 9, 10 • Menanyakan materi yang belum jelas ke dosen • Diskusi | 5 | |
| CPL03 | CPMK04 | sub.cpmk.SISW315.CPMK04.3 | • Penjelasan materi pertemuan 11, 12 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi | 5 | Kemampuan pemecahan masalah |
| CPL03 | CPMK04 | sub.cpmk.SISW315.CPMK04.3, sub.cpmk.SISW315.CPMK04.4 | • Penjelasan materi pertemuan 13, 14 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi | 5 | Kemampuan pemecahan masalah |
| CPL03 | CPMK04 | sub.cpmk.SISW315.CPMK04.1, sub.cpmk.SISW315.CPMK04.2, sub.cpmk.SISW315.CPMK04.3, sub.cpmk.SISW315.CPMK04.4 | Mengikuti ujian mid | 20 | Kesesuaian sintaks atau implementasi teknis |
| CPL08 | CPMK09 | sub.cpmk.SISW315.CPMK09.1 | • Penjelasan materi pertemuan 15, 16 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi | 5 | Kesesuaian output dengan spesifikasi yang diminta |
| CPL08 | CPMK09 | sub.cpmk.SISW315.CPMK09.1 | 5 | Kesesuaian sintaks atau implementasi teknis | |
| CPL08 | CPMK09 | sub.cpmk.SISW315.CPMK09.2 | • Penjelasan materi pertemuan 19, 20 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi | 5 | Kemampuan sintesis dan integrasi materi |
| CPL08 | CPMK09 | sub.cpmk.SISW315.CPMK09.2 | • Penjelasan materi pertemuan 21, 22 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi | 5 | Ketepatan metode atau prosedur penyelesaian |
| CPL08 | CPMK09 | sub.cpmk.SISW315.CPMK09.2 | • Penjelasan materi pertemuan 23, 24 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi | 5 | Kesesuaian output dengan spesifikasi yang diminta |
| CPL08 | CPMK09 | sub.cpmk.SISW315.CPMK09.2 | • Penjelasan materi pertemuan 25, 26 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi | 5 | Kesesuaian output dengan spesifikasi yang diminta |
| CPL08 | CPMK09 | sub.cpmk.SISW315.CPMK09.2 | • Penjelasan materi pertemuan 27, 28 • Menanyakan materi yang belum jelas ke dosen • Latihan membuat program • Diskusi | 5 | Kemampuan sintesis dan integrasi materi |
| CPL08 | CPMK09 | sub.cpmk.SISW315.CPMK09.1, sub.cpmk.SISW315.CPMK09.2 | Mengumpulkan revisi source code proyek 2 menggunakan github | 20 | Kesesuaian output dengan spesifikasi yang diminta |
| Total | 100 | ||||
2. Penilaian CPMK
| CPL | MK | CPMK | Tugas | Latihan | Project | Mid Test (UTS) | Final Test (UAS) | Total | |
|---|---|---|---|---|---|---|---|---|---|
| CPL03 | Pengembangan Web Front-End/ Front-End Web Development | CPMK04 | 0% | 0% | 0% | 15% | 20% | 0% | 35% |
| CPL08 | Pengembangan Web Front-End/ Front-End Web Development | CPMK09 | 0% | 0% | 0% | 35% | 0% | 20% | 55% |
| CPL08 | Pengembangan Web Front-End/ Front-End Web Development | CPMK23 | 0% | 7% | 3% | 0% | 0% | 0% | 10% |
| 100% | |||||||||