Source Code Game HTML5: Isi Paket Sungguhan yang Kami Bedah

Source code game HTML5 bisa berarti tiga hal berbeda: build yang siap diunggah, file pengembang yang Anda edit, atau proyek yang hanya bisa dibuka di satu editor tertentu. Template game HTML5 beserta source code dari marketplace kami adalah dua yang pertama sekaligus, dalam bentuk file web biasa, dan panduan ini membuka paket sungguhan untuk menunjukkan seperti apa wujudnya.

Kami menjual template ini, jadi bacalah ini sebagai tur paket kami sendiri, bukan survei netral atas pasar. Kami menelusuri beberapa edisi, terutama Velvet Pool, Puttide, dan Sunset Rally, membaca manual publik dan ketentuan toko, lalu mencatat apa yang ada di dalam kotak, apa yang dibutuhkan untuk menjalankannya, dan apa yang tidak ada. Setiap manual ditautkan dari halaman itemnya, sehingga Anda bisa memeriksa setiap baris sebelum membayar.

Apa arti “source code game HTML5”

Penjual memakai istilah source code dengan longgar. Tiga pertanyaan membantu memilah apa yang sebenarnya dijual.

Build, source pengembang, atau keduanya?

Build adalah game jadi sebagaimana dimuat browser: index.html, skrip, gambar, dan file suara. Anda bisa meng-host-nya apa adanya. Source pengembang adalah versi yang dibuat untuk diedit orang, dengan file dibagi menurut tugasnya. Paket yang hanya berisi build bisa Anda unggah tetapi tidak nyaman diubah. Paket yang hanya berisi source mungkin membutuhkan alat tambahan sebelum bisa berjalan sama sekali. Edisi dalam panduan ini menaruh keduanya dalam satu ZIP: biasanya folder game/ untuk diterbitkan dan folder source/ untuk diedit (di Ricopop, game/ sendiri adalah sumbernya).

Terbaca atau terminifikasi?

Minifikasi memampatkan skrip menjadi beberapa baris padat dengan nama pendek, sehingga lebih cepat diunduh tetapi sangat sulit dibaca. Obfuskasi melangkah lebih jauh dan sengaja mengacak nama. Keduanya tidak merugikan situs yang sudah tayang. Keduanya merugikan jika Anda membeli kode itu untuk mengubahnya. Sebelum membayar, buka satu skrip dari demo langsung di developer tools browser dan lihat apakah Anda bisa mengikutinya.

File biasa atau proyek editor?

Sebagian template datang sebagai proyek untuk editor game tertentu, dan hanya bisa dibuka di editor itu. Yang lain berupa file web biasa yang bisa dibuka code editor mana pun. Edisi dalam panduan ini termasuk jenis kedua: HTML, CSS, JavaScript, dan JSON, dengan TypeScript di sebagian di antaranya.

Jelajahi template

Isi sebuah paket Polar Games

Ambil Velvet Pool, edisi biliar 8-ball kami. Manualnya menjelaskan empat folder di dalam ZIP:

• game/ adalah edisi siap-unggah dan satu-satunya folder yang Anda terbitkan.
• source/ adalah game yang sama sebagai edisi pengembang yang bisa diedit, dengan README, package.json, dan pengujian.
• documentation/ berisi panduan bergambar beserta gambar-gambarnya.
• THIRD-PARTY-LICENSES/ berisi teks lisensi font dan ringkasan README.txt.

Di pustaka Anda, paket yang sama ditawarkan sebagai dua unduhan: paket lengkap (source dan manual) atau game saja, siap di-host.

game/ dan source/ memiliki tata letak yang sama. Untuk Velvet Pool, manual menyarankan mengedit file di source/ lalu menyalin yang berubah ke jalur yang sama di game/. Tidak ada yang dikompilasi di antaranya.

Lihat edisi Velvet Pool

Di dalam Velvet Pool: peta file

Peta file adalah cara termurah menilai sebuah basis kode sebelum membelinya. Inilah peta di manual Velvet Pool, dengan jalur relatif terhadap source/ atau game/:

• src/core/physics.js: simulasi bola, putaran, dan respons pantulan bantalan.
• src/core/rules.js: aturan 8-ball dan keputusan pelanggaran.
• src/core/ai.js: cara CPU memilih pukulan.
• src/game/controls.js: input bidikan, tenaga, dan putaran.
• src/game/progress.js: pencapaian, kain, stik, dan penilaian pertandingan.
• src/game/i18n.js: teks dalam 14 bahasa.
• src/game/localRecords.js: riwayat skor lokal.
• src/game/audio.js: efek suara dan pemutaran musik.
• css/style.css dan css/fonts.css: tema, tata letak responsif, dan deklarasi font.
• assets/: gambar, audio, dan font, dengan subfolder logo/.

Perhatikan pembagiannya. Aturan, fisika, dan CPU berada di src/core. Input, penyimpanan, teks, dan suara berada di src/game. Manual meminta Anda mengubah satu fitur dalam satu waktu, dan tata letak ini membuatnya realistis: perubahan pantulan bantalan dan perbaikan terjemahan menyentuh file yang berbeda.

Manual juga menyatakan bahwa kode di source/src dan game/src adalah JavaScript biasa yang terformat, tanpa file terminifikasi atau ter-bundle. Velvet Pool adalah Vanilla JavaScript di atas WebGL2 dan tidak memakai pustaka kode apa pun, termasuk Three.js. Changelog mendukung klaim itu: versi 1.0.1 memecah string satu baris yang panjang pada audio, terjemahan, dan shader menjadi baris yang terbaca, tanpa mengubah perilaku.

Puttide: tata letak yang sama, ditambah pustaka

Puttide, edisi mini golf 3D kami, memakai empat folder yang sama dan menambahkan satu hal: dua pustaka pihak ketiga yang dibutuhkan game. Three.js r186 (MIT) dan Rapier 3D 0.21.0 (Apache-2.0) berada di lib/three/ dan lib/rapier/, dan import map di index.html memberi tahu browser di mana menemukannya. FAQ Puttide menyatakan bahwa tidak ada yang dimuat dari CDN, jadi game hanya membutuhkan hosting Anda sendiri. Manual menambahkan bahwa file pustaka diformat agar bisa dibaca, dengan perilaku tidak dimodifikasi.

Peta filenya, lagi-lagi relatif terhadap source/ atau game/:

• src/course/courses.js: urutan lapangan dan syarat pembukaan.
• src/course/holes.js: geometri, par, dan rintangan lapangan Ruins. pier.js, ice.js, lava.js, dan sky.js memuat empat lapangan lainnya.
• src/sim/constants.js: penyetelan fisika.
• src/game/economy.js: definisi dan harga bola, jejak, dan kostum.
• src/ui/i18n.js dan tiga file kamus lainnya: teks bahasa.
• css/style.css: warna antarmuka, font, dan gaya responsif.
• fonts/ dan music/: font web beserta lisensinya dan dua lagu.

Resep di manual untuk membuat lubang baru: duplikasi definisi di file lapangan yang tepat, beri id unik, atur par, posisi tee, dan cup, tambahkan ke lapangan, lalu tambahkan nama dan tipsnya ke kamus bahasa. Bacalah resep semacam itu sebelum Anda membeli. Jika tampak seperti pekerjaan yang bisa Anda lakukan, paket ini cocok untuk Anda.

Lihat edisi Puttide

Ketika source membutuhkan langkah build

“Tanpa langkah build” berlaku untuk sebagian edisi dan tidak untuk yang lain, jadi periksa edisinya, bukan tokonya. Berikut lima edisi kami berdampingan, dengan harga daftarnya. Toko kami sendiri saat ini menampilkan diskon 10% dari harga daftar, penawaran studio direct di setiap halaman item: Velvet Pool, misalnya, tertera US$35,10 alih-alih US$39.

• Velvet Pool, harga daftar US$39: modul JavaScript biasa di atas WebGL2. Edit source/, salin ke game/. Node.js 20+ hanya untuk pengujian opsional.
• Puttide, US$39: modul JavaScript biasa dengan Three.js dan Rapier di lib/. Tanpa langkah build. Node.js opsional dan hanya untuk mengelola versi pustaka.
• Ricopop, US$39: HTML, CSS, dan modul JavaScript biasa, dan game/ sendiri adalah sumbernya. Alat pengembang opsional (Node.js 20+): server lokal, pemeriksa level, dan pengujian.
• Pinloop, US$24: TypeScript dengan Vite. Folder game/ berisi JavaScript dan CSS yang terbaca. Node.js 22.12+ dan npm hanya untuk mengedit dan membangun ulang sumbernya.
• Sunset Rally, US$39: TypeScript dengan Three.js r184 dan Vite. Folder game/ sudah dibangun dan tidak diminifikasi. Node.js hanya jika Anda membangun ulang.

Untuk Sunset Rally, manual menyarankan Node.js 24 LTS. Di dalam source/ Anda menjalankan npm ci, npm run typecheck, dan npm run build, lalu menerbitkan hanya isi dist/. Manual juga meminta Anda menjaga minify dan cssMinify tetap mati saat membangun ulang, karena runtime yang dikirim diformat agar mudah dibaca. Unggah hasilnya, jangan pernah node_modules/.

Lihat edisi Sunset Rally

Hosting: arti “statis” dalam praktik

Hosting statis berarti host Anda hanya melayani file. Manual Velvet Pool dan Puttide memberikan seluruh instalasi dalam tiga langkah:

1. Ekstrak ZIP.
2. Unggah semua isi game/ ke folder di situs Anda, misalnya public_html/velvet-pool/, lewat FTP atau file manager host, dengan mempertahankan subfolder.
3. Buka alamat itu di browser.

Tidak ada npm, terminal, langkah build, PHP, database, atau akun yang terlibat. Menurut manual yang sama, yang sering menjebak orang adalah:

• Jangan klik ganda index.html. Browser memblokir modul game pada file://. Untuk uji lokal, jalankan python -m http.server 8765 di dalam game/ dan buka http://localhost:8765/.
• Server Anda harus mengirim file .js dengan MIME type JavaScript dan .wasm sebagai application/wasm. MIME type yang salah muncul sebagai error modul ditolak.
• Gunakan HTTPS untuk hosting publik.
• Data simpanan milik origin browser (protokol, host, dan port). Pindahkan game ke domain lain dan pemain mulai dari nol.
• Pemuatan halaman yang baru tetap membutuhkan host Anda, jadi ini bukan aplikasi offline yang bisa dipasang.

Letak logo, warna, aturan, dan terjemahan

Setiap manual memiliki bagian kustomisasi, dan cakupannya berbeda dari edisi ke edisi. Inilah yang dikatakan masing-masing.

Velvet Pool

• Logo dan branding: ganti file di assets/logo/ dan sesuaikan dimensi yang cocok di CSS.
• Gaya kain dan stik: definisinya ada di progress.js. Jaga ID item tetap stabil agar kosmetik yang tersimpan tetap berfungsi.
• Perilaku CPU di ai.js, fisika di physics.js. Setelah mengubah aturan atau fisika, jalankan pengujian 8-ball.
• Terjemahan: src/game/i18n.js, dengan daftar bahasa di LANGS.

Puttide

• Warna dan font: css/style.css.
• Fisika: src/sim/constants.js. Harga kosmetik: src/game/economy.js, dengan mempertahankan ID yang ada.
• Musik: salin file berlisensi ke music/ dan perbarui pemetaan lagu di src/audio/audio.js.
• Lubang, par, dan pembukaan: file lapangan yang dijelaskan di atas.

Gridspark dan Sunset Rally

Di Gridspark, menurut FAQ itemnya, teks antarmuka ada di src/locales.js, konstanta aturan dan palet di src/config.js, dan aturan puzzle di game.js, board.js, generator.js, dan shapes.js. Di Sunset Rally, pertandingan kampanye dan syarat bintang ada di Campaign.ts, lokasi di Places.ts, fisika di physics.ts, dan penilaian di match.ts. String bahasa Inggris dan Portugisnya ada di src/i18n.ts, 12 bahasa lainnya di src/locales/.

Perhatikan apa yang tidak dibahas manual. Manual Puttide mencakup warna, fisika, lubang, harga, dan musik, tetapi tidak memiliki langkah untuk mengganti logo, dan manual Sunset Rally tidak memiliki bagian branding khusus. Jika branding adalah hal pertama yang akan Anda ubah, tanyakan sebelum membeli.

Lihat edisi Gridspark

Pengujian otomatis: apa yang diperiksa dan apa yang tidak

Folder source/ Velvet Pool menyertakan rangkaian pengujian. Dengan Node.js 20 atau lebih baru, buka terminal di dalam source/ dan jalankan npm test, yang sama dengan node tests/run.js. Tidak perlu memasang dependensi. Menurut manual, rangkaian ini memeriksa fisika, aturan 8-ball, pertandingan CPU, dan konsistensi kunci terjemahan, dan tidak menggantikan pengujian di browser dan perangkat sungguhan.

Pemeriksaan kunci terjemahan adalah jenis pengujian yang dibutuhkan game dengan 14 bahasa: tambahkan satu kunci di satu bahasa, lupakan yang lain, dan manusia mungkin tidak menyadarinya selama berminggu-minggu.

Tidak setiap edisi memiliki pengujian. Manual Puttide tidak menjelaskan satu pun, hanya pemeriksaan manual. Pinloop dan Beep Out mencantumkan npm test di antara perintah pengembangnya, dan alat pengembang Ricopop mencakup pemeriksa level.

Lisensi, pemberitahuan pihak ketiga, dan changelog

Menurut ketentuan toko, setiap pembelian memberi lisensi perpetual non-eksklusif untuk memakai edisi dalam satu produk akhir, milik Anda atau milik satu klien. Anda boleh mengubah kode, gambar, dan audio di dalamnya, dan pemain boleh memakainya gratis atau lewat iklan. Anda tidak boleh menjual kembali, membagikan, atau mendistribusikan ulang template, sumber, atau asetnya secara terpisah, sebagai template, kit, atau paket aset, maupun di dalam produk lain yang ditujukan untuk pengembang. Lisensi tidak kedaluwarsa ketika dukungan berakhir.

Bagian pihak ketiga tetap memakai lisensinya sendiri, dan Anda menyimpan pemberitahuannya bersama produk Anda. Di Velvet Pool, itu berarti dua font, Manrope dan Fraunces, di bawah SIL Open Font License 1.1, dengan teksnya di THIRD-PARTY-LICENSES/ dan di samping font. Di Puttide, daftarnya bertambah dengan Three.js (MIT), Rapier (Apache-2.0), dan font Rubik dan Fredoka (OFL 1.1).

Changelog menunjukkan bagaimana sebuah paket dirawat. Velvet Pool 1.0.1 (18 Oktober 2026) memecah string panjang menjadi baris yang terbaca dan mengumpulkan pemberitahuan lisensi dalam satu folder datar. Versi 1.1.0 (22 Oktober 2026) membawa antarmuka ke 14 bahasa. Catatan-catatan itu ada di halaman item. Ketentuan menyatakan pembaruan untuk edisi yang sama muncul di pustaka Anda saat dirilis, tanpa janji pembaruan untuk jangka waktu tertentu.

Cara membaca kode game yang Anda beli dalam satu jam

Ini rencana yang disarankan, bukan janji waktu. Rencana ini mengikuti tata letak Velvet Pool dan hanya memakai apa yang diberikan paket.

1. Menit 0 sampai 10: ekstrak ZIP, baca sekilas README di source/ dan peta file di manual. Buka index.html dan lihat skrip serta stylesheet apa yang dimuatnya.
2. Menit 10 sampai 20: jalankan npm test di dalam source/ (Node.js 20+) untuk mendapat garis dasar yang hijau.
3. Menit 20 sampai 35: baca src/core sebelum src/game. Mulai dari rules.js, lalu ai.js, lalu physics.js. Itulah game itu sendiri. Kontrol, progres, teks, dan suara adalah pipa-pipa di sekelilingnya.
4. Menit 35 sampai 40: catat bahwa ID item dan kunci simpanan harus tetap stabil, atau pemain kehilangan kosmetik yang tersimpan.
5. Menit 40 sampai 55: lakukan satu perubahan kecil, seperti definisi kain di progress.js. Salin file ke jalur yang sama di game/, sajikan game/ dengan python -m http.server 8765 dan lihat hasilnya. Jangan pernah membukanya lewat file://.
6. Menit 55 sampai 60: jalankan pengujian sekali lagi.

Modul ES menyebut apa yang dibutuhkannya di baris import, sehingga Anda bisa mengikuti rantainya dari skrip pertama yang dimuat halaman. Itulah sebabnya edisi file biasa bisa dibaca dengan kecepatan ini.

Pertanyaan yang perlu diajukan sebelum membeli source code

• Bisakah saya membaca manual dan memainkan demo sebelum membayar? Untuk edisi kami, keduanya ditautkan dari halaman item.
• Apakah ada build siap-host dan source pengembang yang terpisah?
• Apakah kodenya terbaca atau terminifikasi? Buka satu skrip dan lihat.
• Apakah saya butuh Node.js, npm, PHP, atau database, dan versi berapa?
• Apakah game memuat sesuatu dari CDN atau situs lain?
• Pustaka pihak ketiga apa yang ada di dalamnya, dan di bawah lisensi apa?
• Berapa proyek yang boleh saya pakai dengannya, dan bolehkah saya mendistribusikannya ulang?
• Berapa lama dukungan berlaku dan apa cakupannya? Dukungan kami 6 bulan, atau 12 bulan dengan perpanjangan yang dipilih saat checkout, mencakup pertanyaan tentang pemasangan dan penggunaan file serta cacat yang dapat direproduksi.
• Apa yang tidak disertakan?
• Adakah changelog dan rilis terbaru?
• Bagaimana aturan refund-nya? Aturan kami: template adalah produk digital, jadi kami hanya me-refund jika Anda belum mengunduh template-nya, atau jika terdapat cacat yang tidak dapat kami perbaiki. Anda mengajukannya dengan menulis kepada studio beserta nomor lisensi Anda.

Yang tidak disertakan edisi-edisi ini

Beberapa edisi menambahkan ekstra opsional. Ricopop dan Zabum menyertakan papan peringkat PHP satu file yang nonaktif secara bawaan. Itu papan skor bersama yang santai yang menyimpan skor dalam sebuah file, bukan peringkat antikecurangan, dan bukan multiplayer langsung.

Dukungan mencakup pertanyaan tentang pemasangan dan penggunaan file yang disediakan serta perbaikan cacat yang dapat direproduksi pada game yang disediakan. Itu sebuah batas, dan lebih baik mengetahuinya sejak hari pertama.

FAQ

Apa bedanya folder game dan folder source?

game/ adalah build yang Anda unggah ke host. source/ adalah edisi pengembang yang bisa diedit dari game yang sama. Di Velvet Pool dan Puttide, keduanya memiliki tata letak yang sama, sehingga file yang Anda edit di source/ disalin ke jalur yang sama di game/. Pada edisi TypeScript seperti Sunset Rally, source/ adalah proyek yang Anda bangun ulang, dan Anda menerbitkan hasil barunya.

Apakah saya butuh npm atau Node.js untuk memakai game ini?

Tidak untuk meng-host-nya. Node.js muncul hanya untuk pengujian opsional di Velvet Pool (20 atau lebih baru) atau untuk membangun ulang edisi TypeScript seperti Sunset Rally (disarankan 24 LTS) dan Pinloop (22.12 atau lebih baru).

Apakah source code-nya diminifikasi?

Tidak pada edisi yang dibahas di sini. Velvet Pool dan Puttide adalah JavaScript biasa yang terformat, dan versi 1.0.1 keduanya memecah string satu baris yang panjang menjadi baris yang terbaca. Runtime Sunset Rally dikirim dalam keadaan terformat, dengan minifikasi mati.

Bisakah satu pembelian dipakai untuk beberapa proyek atau klien?

Lisensi mencakup satu produk akhir, milik Anda atau milik satu klien. Produk kedua berada di luar lisensi.

Bisakah saya menjual kembali atau membagikan source code-nya?

Tidak: tidak secara terpisah, tidak sebagai template, kit, atau paket aset, dan tidak di dalam produk lain yang ditujukan untuk pengembang. Anda boleh mengubah kode, gambar, dan audio di dalam produk akhir Anda sendiri.

Bisakah saya membaca manual sebelum membeli?

Bisa. Setiap halaman item menautkan manualnya dan demo yang bisa dimainkan dari edisi yang sama.

Buka sebuah paket sebelum Anda membeli

Pilih satu edisi, buka manualnya dari halaman item, mainkan demonya, dan bacalah peta file dengan pertanyaan-pertanyaan di atas. Jika manual menjawabnya, paketnya pun seharusnya begitu. Jika tidak, tulis kepada studio sebelum membayar.

Jelajahi semua template