Jadi Kreator Digital! Hosting Script dengan GitHub
Pernahkah kamu membuat proyek digital seperti game atau halaman web sederhana dan ingin menunjukkannya ke teman-temanmu? Atau pernah terpikir untuk menyimpan hasil karyamu di internet agar bisa dibuka kapan saja, dari mana saja?
Nah, melalui bab ini kamu akan belajar menggunakan GitHub alat keren yang dipakai oleh para programmer profesional di seluruh dunia. Kamu juga akan belajar menghubungkannya dengan App Inventor supaya bisa membuat aplikasi sendiri!
Webviewer di AppInventor
WebViewer adalah komponen di App Inventor yang digunakan untuk menampilkan halaman web langsung di dalam aplikasi, seperti membuka Google tanpa harus keluar ke browser. Komponen ini sangat berguna untuk membuat aplikasi yang membutuhkan akses informasi dari internet, seperti portal berita, pencarian, atau tampilan website sekolah. Dengan WebViewer, siswa dapat belajar cara menghubungkan aplikasi dengan dunia online secara mudah dan praktis.
Langkah 1: Desain Tampilan Aplikasi
Pada tahap awal, buka MIT App Inventor dan buat sebuah proyek baru. Di tampilan Designer, tambahkan komponen berikut:
Langkah 2: Pemrograman Blok
Masuk ke tab Blocks. Tambahkan blok berikut:
Langkah 3: Menjalankan Aplikasi
Setelah aplikasi dikompilasi atau diuji menggunakan companion App Inventor, tampilan awal akan menunjukkan:
Setelah tombol ditekan, WebViewer akan otomatis membuka halaman Google sesuai perintah pada blok sebelumnya. Kini, pengguna dapat menjelajah Google langsung dari dalam aplikasi.
Tutorial ini memperlihatkan cara cepat dan mudah menggunakan WebViewer di App Inventor untuk menampilkan halaman web. Dengan hanya satu tombol dan satu blok pemrograman, kamu sudah bisa membuka situs seperti Google langsung dari aplikasimu. Cocok untuk pemula yang ingin belajar interaksi aplikasi dengan web.
Apa Itu GitHub dan Mengapa Penting?
Bayangkan kamu punya sebuah karya, seperti cerita, gambar, atau program komputer, dan kamu ingin menyimpannya agar tidak hilang, bisa dibuka kapan saja, dan bahkan dibagikan ke temanmu. Nah, GitHub adalah tempat penyimpanan online khusus untuk script atau kode program. Banyak orang di seluruh dunia menggunakan GitHub untuk:
Langkah-Langkah Membuat Akun GitHub
Untuk mulai menggunakan GitHub, kamu perlu punya akun terlebih dahulu. Tenang, caranya sangat mudah, bahkan bisa langsung menggunakan akun Google yang sudah kamu miliki!
Berikut langkah-langkahnya:
1. Buka situs https://github.com.
2. Klik tombol Sign Up di pojok kanan atas.
3. Pilih opsi Continue with Google.
4. Login dengan akun Google kamu seperti biasa.
5. Setelah berhasil login, kamu akan diminta memilih:
7. Selesai! Kamu sekarang sudah punya akun GitHub yang terhubung dengan akun Google-mu.
Cara Membuat Project Baru (Repository)
Setelah punya akun, saatnya membuat "tempat" untuk menyimpan script-mu. Di GitHub, tempat ini disebut repository. Anggap saja seperti folder khusus di awan (cloud).
Langkah-langkahnya:
1. Masuk ke akun GitHub kamu.
2. Klik tombol New Repository.
3. Isi nama project kamu (contoh: ScriptWebViewer).
4. Tambahkan deskripsi singkat (opsional).
5. Pilih opsi Public (biar bisa diakses semua orang).
6. Klik Create Repository.
Sekarang kamu punya tempat untuk menyimpan script buatanmu!
Membuat Script index.html di Repository Github
Setelah repository dibuat, kita dapat mengisi file HTML untuk percobaan kita.
Langkah-langkahnya:
1. Masuk ke URL ScriptWebViewer, misalnya, https://github.com/onnowpurbo-code/ScriptWebViewer
2. Klik “creating a new file”
3. Isi nama file “index.html”
4. Isi dengan text HTML berikut
<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<h1>Selamat datang di halaman web pertamaku!</h1>
</body>
</html>
Klik “Commit Changes” setelah yakin tidak ada yang salah.
Aktifkan URL di Github:
Langkah-langkahnya:
1. Masuk ke repository di GitHub.
2. Klik tab Settings.
3. Cari bagian "Pages" (di sidebar atau dalam sub-menu "Code and automation").
4. Di bagian "Source", pilih branch (misalnya main) dan folder (/root atau/docs) tempat file HTML kamu berada.
5. Klik Save.
6. Setelah itu GitHub akan menyediakan URL, seperti: https://onnowpurbo-code.github.io/ScriptWebViewer/
1. Buka repository yang tadi kamu buat.
2. Klik Add file > Upload files.
3. Seret file index.html ke halaman.
4. Klik Commit changes.
Tada! Script kamu sekarang sudah tersimpan online.
Uji Coba dengan App Inventor: WebViewer
Sekarang saatnya menguji script buatanmu lewat aplikasi! Gunakan MIT App Inventor, lalu buat aplikasi sederhana dengan WebViewer.
Langkah ringkas:
1. Buka https://ai2.appinventor.mit.edu.
2. Buat proyek baru.
3. Tambahkan komponen WebViewer ke layar aplikasi.
4. Pada pengaturan WebViewer, masukkan alamat GitHub Pages dari script kamu. Misalnya https://onnowpurbo-code.github.io/ScriptWebViewer/
5. Jalankan aplikasi. Jika berhasil, halaman web buatanmu akan tampil di layar!
Contoh Kasus atau Ilustrasi
Kasus 1: “Website Klub Rahasia”
Ilustrasi: Bayangkan kamu dan teman-temanmu membentuk klub rahasia bernama The Digital Explorers. Kalian ingin membuat halaman web berisi kode rahasia, daftar anggota, dan tantangan mingguan.
Tantangannya: Kamu perlu menyimpan halaman web klub itu agar bisa diakses dari mana saja. Tapi… kamu tidak mau filenya hilang atau rusak!
Solusi: Gunakan GitHub untuk menyimpan file index.html berisi halaman informasi tentang klub. Dengan begitu, semua anggota bisa membuka halaman itu hanya dengan klik link! Konsep yang Dipelajari:
Ilustrasi: Bayangkan kamu punya web tentang dirimu sendiri hobimu, impianmu, dan video favoritmu. Tapi kamu ingin web itu bisa dibuka lewat aplikasi buatanmu sendiri.
Tantangannya: Bisakah kamu membuat aplikasi Android sederhana yang menampilkan halaman HTML dari GitHub?
Solusi: Gunakan App Inventor dan komponen WebViewer. Sambungkan ke GitHub Pages kamu. Boom! Aplikasi Android-mu bisa menampilkan halaman web buatanmu sendiri.
Konsep yang Dipelajari:
Ilustrasi: Kamu hobi menggambar dan bikin komik. Kamu ingin komikmu bisa dibaca dari HP siapapun bahkan tanpa install apa pun!
Tantangannya: Bagaimana caranya membuat halaman komik digital dan membagikannya ke teman?
Solusi: Scan atau gambar komik, tempelkan ke halaman HTML, lalu unggah ke GitHub. Buat link-nya jadi GitHub Pages. Tinggal buka, dan komikmu terbaca seperti e-book! Konsep yang Dipelajari:
Ilustrasi: Bayangkan kamu membuat aplikasi pintar yang bisa merespons saat kamu bilang "halo" atau "bye". Aplikasi ini akan menampilkan pesan dan efek animasi. Seru banget, kan?
Tantangannya: Bisa nggak ya bikin aplikasi Android yang bisa mendengar suara dan merespons?
Solusi: Gunakan Teachable Machine untuk melatih suara “halo” dan “bye”. Sambungkan ke HTML, unggah ke GitHub, dan tampilkan di App Inventor pakai WebViewer. Konsep yang Dipelajari:
Ilustrasi: Kamu ingin membuat game sederhana di mana karakter bisa bergerak ke kiri atau ke kanan saat kamu mengucapkan perintah. Tanpa tombol—cukup dengan suaramu!
Tantangannya: Apakah kamu bisa menggabungkan AI, HTML, dan App Inventor?
Solusi: Latih suara “kiri” dan “kanan” di Teachable Machine, buat tampilan game dengan HTML, upload ke GitHub, lalu mainkan lewat App Inventor. Konsep yang Dipelajari:
Ilustrasi: Kamu suka menulis rangkuman pelajaran dengan gaya sendiri. Daripada hanya di buku, kamu ingin menjadikannya seperti e-book yang bisa dibaca online!
Tantangannya: Bisa nggak ya membuat buku digital sendiri dan membaginya dengan teman?
Solusi: Gunakan HTML untuk menulis bab per bab. Tambahkan gambar, link antar bab, lalu upload ke GitHub. Dengan GitHub Pages, buku digitalmu bisa dibaca siapa saja. Konsep yang Dipelajari:
Setiap kasus ini:
1. GitHub tuh kayak Instagram-nya para programmer! Bedanya, yang di-posting bukan foto, tapi kode-kode keren yang bisa jadi website, game, bahkan aplikasi!
2. File index.html adalah bintang utamanya website! Kalau website itu drama, index.html itu pemeran utamanya. Semua web dimulai dari file ini!
3. App Inventor diciptakan oleh MIT, kampus para ilmuwan jenius dunia! Yup, kampus yang sama dengan penemu roket, AI, dan robot super canggih. Sekarang kamu bisa pakai buatan mereka dari rumah!
4. GitHub pertama kali dibuat untuk programmer, tapi sekarang digunakan oleh seniman, ilmuwan, guru, hingga pelajar!
5. Presiden Barack Obama pernah unggah kode pertamanya di GitHub!
6. Banyak aplikasi populer (seperti VS Code, React, atau TensorFlow) adalah proyek open-source GitHub.
7. GitHub juga dipakai untuk bikin AI, robot, dan game-game populer! Banyak proyek canggih di dunia ini dimulai dari… ya, dari sebuah repository kecil di GitHub!
8. Script kamu bisa “terbang” ke awan dengan GitHub! Karena GitHub berbasis cloud, semua script-mu bisa diakses dari mana saja bahkan dari gunung (asal ada sinyal ).
Kalimat-kalimat ini bisa kamu tampilkan di slide, pojok buku siswa, atau diselipkan di sela-sela latihan soal untuk menjaga semangat dan rasa ingin tahu mereka tetap tinggi! Mau dibantu juga untuk membuat stiker digital atau infografis dari fun facts ini?
Rangkuman
Pernahkah kamu ingin menunjukkan proyek digitalmu seperti game atau web buatan sendiri ke teman-teman, tapi bingung cara menyimpannya secara online? Nah, di bab ini kamu akan belajar menjadi kreator digital dengan bantuan GitHub, sebuah platform keren yang dipakai para programmer dunia. Di sini, kamu akan belajar cara membuat akun GitHub, menyimpan script HTML sederhana di repository, lalu mengujinya melalui aplikasi buatan kamu sendiri dengan bantuan App Inventor. Seru kan? Ayo kita mulai petualangan digitalmu!
Setelah akun GitHub siap, kamu akan membuat repository, yaitu semacam folder online untuk menyimpan karya kode kamu. Lalu, kamu akan belajar membuat file HTML dasar bernama index.html berisi halaman web sederhana. Script ini nantinya akan di-upload ke GitHub agar bisa diakses siapa saja melalui internet. Ini adalah langkah awal menuju dunia pemrograman yang sesungguhnya, dan kamu bisa mengakses proyekmu kapan saja ahkan dari HP!
Tantangan makin seru ketika kamu menguji hasil karyamu lewat App Inventor menggunakan komponen WebViewer. Dengan memasukkan alamat dari halaman web GitHub-mu, aplikasi yang kamu buat bisa menampilkan halaman tersebut. Di akhir bab, kamu bahkan bisa mencoba membuat proyek suara dengan AI yang mengenali kata seperti “kiri” dan “kanan”. Ini bukan hanya belajar teknologi, tapi kamu juga sedang melatih kemampuan berpikir logis, kreatif, dan jadi pembuat aplikasi sejak dini. Siap jadi kreator digital sejati?
Webviewer di AppInventor
WebViewer adalah komponen di App Inventor yang digunakan untuk menampilkan halaman web langsung di dalam aplikasi, seperti membuka Google tanpa harus keluar ke browser. Komponen ini sangat berguna untuk membuat aplikasi yang membutuhkan akses informasi dari internet, seperti portal berita, pencarian, atau tampilan website sekolah. Dengan WebViewer, siswa dapat belajar cara menghubungkan aplikasi dengan dunia online secara mudah dan praktis.
Langkah 1: Desain Tampilan Aplikasi
Pada tahap awal, buka MIT App Inventor dan buat sebuah proyek baru. Di tampilan Designer, tambahkan komponen berikut:
- Button dengan label default "Text for Button1".
- WebViewer, letakkan di bawah tombol. WebViewer ini akan menampilkan halaman web.
- Opsional: tambahkan gambar globe (ikon bumi) sebagai hiasan.
Langkah 2: Pemrograman Blok
Masuk ke tab Blocks. Tambahkan blok berikut:
- Blok when Button1.Click
- Di dalamnya, tambahkan blok call WebViewer1.GoToUrl
- Isi URL dengan "https://www.google.com"
Langkah 3: Menjalankan Aplikasi
Setelah aplikasi dikompilasi atau diuji menggunakan companion App Inventor, tampilan awal akan menunjukkan:
- Sebuah tombol bertuliskan "Text for Button1"
- WebViewer masih kosong karena belum ada aksi yang dijalankan.
Setelah tombol ditekan, WebViewer akan otomatis membuka halaman Google sesuai perintah pada blok sebelumnya. Kini, pengguna dapat menjelajah Google langsung dari dalam aplikasi.
Tutorial ini memperlihatkan cara cepat dan mudah menggunakan WebViewer di App Inventor untuk menampilkan halaman web. Dengan hanya satu tombol dan satu blok pemrograman, kamu sudah bisa membuka situs seperti Google langsung dari aplikasimu. Cocok untuk pemula yang ingin belajar interaksi aplikasi dengan web.
Apa Itu GitHub dan Mengapa Penting?
Bayangkan kamu punya sebuah karya, seperti cerita, gambar, atau program komputer, dan kamu ingin menyimpannya agar tidak hilang, bisa dibuka kapan saja, dan bahkan dibagikan ke temanmu. Nah, GitHub adalah tempat penyimpanan online khusus untuk script atau kode program. Banyak orang di seluruh dunia menggunakan GitHub untuk:
- Menyimpan kode mereka dengan aman di internet.
- Berbagi proyek mereka dengan orang lain.
- Bekerja sama membuat program secara tim, walau dari tempat yang berbeda.
- Menjadikan proyek mereka bisa diakses oleh aplikasi atau website lain.
Langkah-Langkah Membuat Akun GitHub
Untuk mulai menggunakan GitHub, kamu perlu punya akun terlebih dahulu. Tenang, caranya sangat mudah, bahkan bisa langsung menggunakan akun Google yang sudah kamu miliki!
Berikut langkah-langkahnya:
1. Buka situs https://github.com.
2. Klik tombol Sign Up di pojok kanan atas.
3. Pilih opsi Continue with Google.
4. Login dengan akun Google kamu seperti biasa.
5. Setelah berhasil login, kamu akan diminta memilih:
- Nama pengguna (username),
- Preferensi email (bisa diatur nanti),
- Beberapa pengaturan akun awal.
7. Selesai! Kamu sekarang sudah punya akun GitHub yang terhubung dengan akun Google-mu.
Cara Membuat Project Baru (Repository)
Setelah punya akun, saatnya membuat "tempat" untuk menyimpan script-mu. Di GitHub, tempat ini disebut repository. Anggap saja seperti folder khusus di awan (cloud).
Langkah-langkahnya:
1. Masuk ke akun GitHub kamu.
2. Klik tombol New Repository.
3. Isi nama project kamu (contoh: ScriptWebViewer).
4. Tambahkan deskripsi singkat (opsional).
5. Pilih opsi Public (biar bisa diakses semua orang).
6. Klik Create Repository.
Sekarang kamu punya tempat untuk menyimpan script buatanmu!
Membuat Script index.html di Repository Github
Setelah repository dibuat, kita dapat mengisi file HTML untuk percobaan kita.
Langkah-langkahnya:
1. Masuk ke URL ScriptWebViewer, misalnya, https://github.com/onnowpurbo-code/ScriptWebViewer
2. Klik “creating a new file”
3. Isi nama file “index.html”
4. Isi dengan text HTML berikut
<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<h1>Selamat datang di halaman web pertamaku!</h1>
</body>
</html>
Klik “Commit Changes” setelah yakin tidak ada yang salah.
Aktifkan URL di Github:
Langkah-langkahnya:
1. Masuk ke repository di GitHub.
2. Klik tab Settings.
3. Cari bagian "Pages" (di sidebar atau dalam sub-menu "Code and automation").
4. Di bagian "Source", pilih branch (misalnya main) dan folder (/root atau/docs) tempat file HTML kamu berada.
5. Klik Save.
6. Setelah itu GitHub akan menyediakan URL, seperti: https://onnowpurbo-code.github.io/ScriptWebViewer/
7. Tampak pada screenshot Github Setting berikut: (Alternatif) Membuat Script Sederhana untuk Diunggah
Jika kamu ingin membuat file index.html dari komputer sendiri. Kita dapat mengikuti langkah ini. Sebelum mengunggah ke GitHub, kamu perlu punya script sederhana dulu. Contohnya, kamu bisa membuat file bernama index.html dengan isi seperti ini:
<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<h1>Selamat datang di halaman web pertamaku!</h1>
</body>
</html>
File ini bisa kamu buat dengan Notepad, lalu disimpan sebagai index.html.
Upload Script ke GitHub
Cara mengunggah script:
Jika kamu ingin membuat file index.html dari komputer sendiri. Kita dapat mengikuti langkah ini. Sebelum mengunggah ke GitHub, kamu perlu punya script sederhana dulu. Contohnya, kamu bisa membuat file bernama index.html dengan isi seperti ini:
<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<h1>Selamat datang di halaman web pertamaku!</h1>
</body>
</html>
File ini bisa kamu buat dengan Notepad, lalu disimpan sebagai index.html.
Upload Script ke GitHub
Cara mengunggah script:
1. Buka repository yang tadi kamu buat.
2. Klik Add file > Upload files.
3. Seret file index.html ke halaman.
4. Klik Commit changes.
Tada! Script kamu sekarang sudah tersimpan online.
Uji Coba dengan App Inventor: WebViewer
Sekarang saatnya menguji script buatanmu lewat aplikasi! Gunakan MIT App Inventor, lalu buat aplikasi sederhana dengan WebViewer.
Langkah ringkas:
1. Buka https://ai2.appinventor.mit.edu.
2. Buat proyek baru.
3. Tambahkan komponen WebViewer ke layar aplikasi.
4. Pada pengaturan WebViewer, masukkan alamat GitHub Pages dari script kamu. Misalnya https://onnowpurbo-code.github.io/ScriptWebViewer/
5. Jalankan aplikasi. Jika berhasil, halaman web buatanmu akan tampil di layar!
Contoh Kasus atau Ilustrasi
Kasus 1: “Website Klub Rahasia”
Ilustrasi: Bayangkan kamu dan teman-temanmu membentuk klub rahasia bernama The Digital Explorers. Kalian ingin membuat halaman web berisi kode rahasia, daftar anggota, dan tantangan mingguan.
Tantangannya: Kamu perlu menyimpan halaman web klub itu agar bisa diakses dari mana saja. Tapi… kamu tidak mau filenya hilang atau rusak!
Solusi: Gunakan GitHub untuk menyimpan file index.html berisi halaman informasi tentang klub. Dengan begitu, semua anggota bisa membuka halaman itu hanya dengan klik link! Konsep yang Dipelajari:
- Membuat akun GitHub
- Membuat repository
- Mengunggah file HTML
Ilustrasi: Bayangkan kamu punya web tentang dirimu sendiri hobimu, impianmu, dan video favoritmu. Tapi kamu ingin web itu bisa dibuka lewat aplikasi buatanmu sendiri.
Tantangannya: Bisakah kamu membuat aplikasi Android sederhana yang menampilkan halaman HTML dari GitHub?
Solusi: Gunakan App Inventor dan komponen WebViewer. Sambungkan ke GitHub Pages kamu. Boom! Aplikasi Android-mu bisa menampilkan halaman web buatanmu sendiri.
Konsep yang Dipelajari:
- WebViewer di App Inventor
- Menautkan HTML dari GitHub Pages
Ilustrasi: Kamu hobi menggambar dan bikin komik. Kamu ingin komikmu bisa dibaca dari HP siapapun bahkan tanpa install apa pun!
Tantangannya: Bagaimana caranya membuat halaman komik digital dan membagikannya ke teman?
Solusi: Scan atau gambar komik, tempelkan ke halaman HTML, lalu unggah ke GitHub. Buat link-nya jadi GitHub Pages. Tinggal buka, dan komikmu terbaca seperti e-book! Konsep yang Dipelajari:
- HTML dengan gambar
- Hosting dengan GitHub Pages
Ilustrasi: Bayangkan kamu membuat aplikasi pintar yang bisa merespons saat kamu bilang "halo" atau "bye". Aplikasi ini akan menampilkan pesan dan efek animasi. Seru banget, kan?
Tantangannya: Bisa nggak ya bikin aplikasi Android yang bisa mendengar suara dan merespons?
Solusi: Gunakan Teachable Machine untuk melatih suara “halo” dan “bye”. Sambungkan ke HTML, unggah ke GitHub, dan tampilkan di App Inventor pakai WebViewer. Konsep yang Dipelajari:
- AI dasar dengan suara
- Integrasi GitHub dan App Inventor
Ilustrasi: Kamu ingin membuat game sederhana di mana karakter bisa bergerak ke kiri atau ke kanan saat kamu mengucapkan perintah. Tanpa tombol—cukup dengan suaramu!
Tantangannya: Apakah kamu bisa menggabungkan AI, HTML, dan App Inventor?
Solusi: Latih suara “kiri” dan “kanan” di Teachable Machine, buat tampilan game dengan HTML, upload ke GitHub, lalu mainkan lewat App Inventor. Konsep yang Dipelajari:
- Coding AI interaktif
- Script HTML untuk game sederhana
- WebViewer untuk uji coba game
Ilustrasi: Kamu suka menulis rangkuman pelajaran dengan gaya sendiri. Daripada hanya di buku, kamu ingin menjadikannya seperti e-book yang bisa dibaca online!
Tantangannya: Bisa nggak ya membuat buku digital sendiri dan membaginya dengan teman?
Solusi: Gunakan HTML untuk menulis bab per bab. Tambahkan gambar, link antar bab, lalu upload ke GitHub. Dengan GitHub Pages, buku digitalmu bisa dibaca siapa saja. Konsep yang Dipelajari:
- HTML untuk navigasi bab
- GitHub sebagai perpustakaan digital
- Desain web edukatif
Setiap kasus ini:
- Mengajak siswa berpikir kreatif, seperti menyusun cerita atau membangun sesuatu.
- Menyisipkan tantangan teknis yang menyenangkan.
- Memperkenalkan konsep pemrograman, AI, dan aplikasi tanpa menakut-nakuti.
- Bisa digunakan sebagai bahan diskusi, simulasi, atau tantangan kelas.
1. GitHub tuh kayak Instagram-nya para programmer! Bedanya, yang di-posting bukan foto, tapi kode-kode keren yang bisa jadi website, game, bahkan aplikasi!
2. File index.html adalah bintang utamanya website! Kalau website itu drama, index.html itu pemeran utamanya. Semua web dimulai dari file ini!
3. App Inventor diciptakan oleh MIT, kampus para ilmuwan jenius dunia! Yup, kampus yang sama dengan penemu roket, AI, dan robot super canggih. Sekarang kamu bisa pakai buatan mereka dari rumah!
4. GitHub pertama kali dibuat untuk programmer, tapi sekarang digunakan oleh seniman, ilmuwan, guru, hingga pelajar!
5. Presiden Barack Obama pernah unggah kode pertamanya di GitHub!
6. Banyak aplikasi populer (seperti VS Code, React, atau TensorFlow) adalah proyek open-source GitHub.
7. GitHub juga dipakai untuk bikin AI, robot, dan game-game populer! Banyak proyek canggih di dunia ini dimulai dari… ya, dari sebuah repository kecil di GitHub!
8. Script kamu bisa “terbang” ke awan dengan GitHub! Karena GitHub berbasis cloud, semua script-mu bisa diakses dari mana saja bahkan dari gunung (asal ada sinyal ).
Kalimat-kalimat ini bisa kamu tampilkan di slide, pojok buku siswa, atau diselipkan di sela-sela latihan soal untuk menjaga semangat dan rasa ingin tahu mereka tetap tinggi! Mau dibantu juga untuk membuat stiker digital atau infografis dari fun facts ini?
Rangkuman
Pernahkah kamu ingin menunjukkan proyek digitalmu seperti game atau web buatan sendiri ke teman-teman, tapi bingung cara menyimpannya secara online? Nah, di bab ini kamu akan belajar menjadi kreator digital dengan bantuan GitHub, sebuah platform keren yang dipakai para programmer dunia. Di sini, kamu akan belajar cara membuat akun GitHub, menyimpan script HTML sederhana di repository, lalu mengujinya melalui aplikasi buatan kamu sendiri dengan bantuan App Inventor. Seru kan? Ayo kita mulai petualangan digitalmu!
Setelah akun GitHub siap, kamu akan membuat repository, yaitu semacam folder online untuk menyimpan karya kode kamu. Lalu, kamu akan belajar membuat file HTML dasar bernama index.html berisi halaman web sederhana. Script ini nantinya akan di-upload ke GitHub agar bisa diakses siapa saja melalui internet. Ini adalah langkah awal menuju dunia pemrograman yang sesungguhnya, dan kamu bisa mengakses proyekmu kapan saja ahkan dari HP!
Tantangan makin seru ketika kamu menguji hasil karyamu lewat App Inventor menggunakan komponen WebViewer. Dengan memasukkan alamat dari halaman web GitHub-mu, aplikasi yang kamu buat bisa menampilkan halaman tersebut. Di akhir bab, kamu bahkan bisa mencoba membuat proyek suara dengan AI yang mengenali kata seperti “kiri” dan “kanan”. Ini bukan hanya belajar teknologi, tapi kamu juga sedang melatih kemampuan berpikir logis, kreatif, dan jadi pembuat aplikasi sejak dini. Siap jadi kreator digital sejati?