Skip to content

Roni Budianto / Works-Docs

Go to a project
Switch branch/tag
Student Apps V1 Docs.md 4.02 KB

Student Apps Documentation

Definisi

Student Apps adalah aplikasi mobile yang dikembangkan oleh DSTI Universitas Indonesia dengan tujuan menggabungkan sistem Moodle(E-Learning), EMAS dan SIAKNG sehingga, user dapat menggunakan apps ini untuk e-learning, melihat record perkuliahan dan jadwal kuliah dalam satu aplikasi sekaligus. Aplikasi ini dikembangkan dengan codebase moodle mobile app open source Apache 2.0 dari url github milik moodle.

Teknologi

  1. Angular 5
  2. Ionic V3
  3. Moodle LMS
  4. SQLite
  5. Gulp
  6. TypeScript
  7. JavaScript

Dokumentasi

  1. Instalasi

Untuk installasi berberapa hal yang harus dilakukan yaitu:

  • Clone codebase moodle mobile app pada url

  • masuk ke folder dengan cmd dan lakukan instalasi package dengan perintah npm run setup

  • pindah branch ke integration git checkout integration

  • buka 2 cmd dan jalankan npx gulp watch dan npx ionic-app-scripts serve -b --devapp --address=0.0.0.0 pada masing - masing terminal dan moodle akan berjalan pada http://localhost:8100/

  • Dokumentasi lebih lengkap dapat dilihat pada url

  1. Store Modification

Moodle mobile app menggunakan SQLite yang digunakan untuk menyimpan data sementara. oleh karenanya perlu dilakukan modifikasi untuk menyimpan data yang dirasa perlu digunakan

  • src > classes line 202 tambahkan custom table yang diinginkan. contoh static APP_CUST_DATA = 'custom_data'; ini berfungsi untuk membuat table yang baru
  1. Credential

Pada dasarnya App ini digunakan untuk Login ke website moodle yang telah di deploy, sehingga untuk login hanya perlu memasukan url dan username beserta password. namun untuk kasus DSTI diharuskan untuk double login yaitu ke website emas dan ke sso. supaya sso bisa digunakan untuk api student.

  • Configurasi target website moodle

    • Configurasi ada pada file src > config.json line 69. ubah "siteurl": "https://school.moodledemo.net/" dengan site yang diinginkan
    • Modifikasi promise login src > providers > sites.ts ubah dengan promise api login tambahan dengan promise.all

    Gambar

    • Pada credential.ts src > core > login > pages >credentials > credentials.ts masukan data yang ingin dimasukan ke tabel pada line 243 dengan fungsi insertRecord yang telah dibuat pada line 296
  1. Home

Untuk mengganti Page setelah login src > core > login > providers> helper.ts line 794. gantilah dengan halaman yang diinginkan (Lazyloading), yang sebelumnya halamannya sudah harus dibuat terlebih dahulu, untuk contoh pembuatan halaman dapat dilihat pada src > core> home

  1. Pembuatan Halaman

Untuk membuat halaman lain setelah halaman home terbuat dapat dilakukan dengan cara yang sama. menggunakan navpush(fitur ionic 3). Halaman custom pada app ini diantaranya adalah

  • Schedule : src > core > schedule

  • Scedule-exam : src > core > schedule-exam

  • Progress : src > core > progress

  • Side-Profile : src > core > side-profile

  1. Alur Logout

Pada dasarnya app bawaan moodle digunakan untuk menyimpan banyak website, dan dapat login kembali dengan memilih salah satu website yang tersimpan. oleh karenanya dimodifikasi supaya hanya dapat menyimpan 1 website dan ketika logout website terhapus.

Pengaturan ada pada src > core > login > providers> sites.ts pada line 1515 tambahkan await this.deleteSite(siteId)

dan untuk contoh trigger logout ada pada src > core > side-profile > side-profile.ts

  • import { CoreSitesProvider } from '@providers/sites' berfungsi untuk instansiasi fungsi site yang aktif
  • Instance tersebut dimasukan kedalam konstruktor pada line 19 protected sitesProvider: CoreSitesProvider
  • kemudian fungsi untuk trigger logout ada pada fungsi logout line 23 yang isinya menjalankan fungsi dari instance this.sitesProvider.logout();