Belajar coding itu kadang melelahkan. Wajar kalau butuh jeda dari rutinitas debugging yang tidak ada habisnya. Tapi, bagaimana kalau jeda itu tetap bisa mengasah kemampuan coding? Kenapa tidak menggabungkan belajar dan hiburan dalam satu petualangan coding yang sepenuhnya gamified?
Code Quest Adventure adalah aplikasi game berbasis web yang menghibur sekaligus melatih kemampuan membaca dan mendebug kode di dalam kepala. Pemain harus menebak output dari sebuah kode dalam tantangan multiple-choice, sekaligus menemukan bagian yang hilang dari kode dalam tantangan fill-in-the-blank. Buktikan kemampuanmu untuk mengalahkan final boss dan raih gelar master developer.
Yang menarik, cerita, objektif, pertanyaan, dan jawaban dalam game ini di-generate secara real-time oleh Amazon Q Developer CLI. Setiap kali bermain, cerita dan pertanyaannya selalu berbeda. Tidak ada konten yang di-hardcode. Semuanya dihasilkan oleh Amazon Q Developer CLI, sehingga kemungkinan kontennya tidak terbatas dan selalu unik.
Demo#
Aturan mainnya sangat sederhana. Ada tiga level dalam game ini. Pemain harus mengalahkan final boss di level tiga. Perlu diperhatikan, damage dari musuh akan semakin besar seiring bertambahnya level.
Jika menjawab pertanyaan dengan benar, pemain mendapatkan poin dan musuh akan terkena damage.
Sebaliknya, jika jawaban salah, pemain yang akan terkena serangan dari musuh.
Repositori#
Source code Code Quest Adventure tersedia di repositori GitHub. Di dalamnya terdapat tiga file README yang mendokumentasikan kode frontend dan backend untuk keperluan testing dan review secara lokal.
Cara Kerja Amazon Q Developer#
Bagaimana game ini bekerja? Bagaimana kontennya bisa di-generate oleh AI?
Singkat cerita, project ini terdiri dari dua bagian, yaitu frontend dan backend. Aplikasi frontend mengirim request ke backend melalui API untuk menjalankan perintah q chat –no-interactive di CLI. Amazon Q Developer CLI kemudian memberikan respons yang di-parse sebagai JSON oleh aplikasi backend. Data JSON tersebut dikirim kembali ke frontend sebagai response dan disajikan kepada pengguna.
Jujur, masih jauh dari kata master developer. Apalagi AI prompt engineer. Tapi dengan bantuan Amazon Q Developer, game ini bisa terwujud. Berikut adalah prompt awal yang digunakan untuk Amazon Q Developer:
Help me prepare an environment to build a simple web-based game.
The game should be named with an interesting name that represents an adventure story game, learning coding, and Amazon Q.
The programming language for the frontend should be JS.
The backend will be using python.
It is an interactive online code learning platform for beginners.
It has to be 100% gamified.
It is an adventure story based game.
The question given to the user is not just multiple choice,
but also fill in the blank.
The application consists of frontend and backend parts with no login and register feature.
The folder name should be lowercase with "-" as a delimiter.
Initialize the project file using framework generator.
Add some graphics mechanism, like the user will beat the enemy and go to the next level if the answer is correct.
Otherwise, player's hp will decrease to death.
Frontend will ask backend to get the story, game content, and question, which is not stored in the database, but the code will ask Amazon Q in CLI to generate using command "q chat --no-interactive".
There must be no default or predefined response.
If Amazon Q fails, just give an error message that will be displayed.
While backend is generating a response, add a creative loading screen so user doesn't get bored, like quotes or progress bar.
Before building the frontend, verify all backend endpoints giving the correct response.
Then, verify the frontend is also deployed without any errors and production ready.
Don't forget to add readme file.Cukup itu saja. Seluruh struktur project langsung tersedia. Karena menggunakan Amazon Q Developer CLI, proses persiapan development environment pun ikut terotomasi. Instalasi nodejs, inisialisasi framework menggunakan npm dan pip, semuanya ditangani. Amazon Q Developer bahkan sudah membuat kode awal untuk logika dasar dan beberapa grafis. Berikut tampilan project pada prompt pertama.
Tentu saja masih butuh banyak polesan supaya lebih menghibur. Dengan bantuan Amazon Q Developer, proses penyelesaian game ini jadi sangat mudah. Memasukkan grafis, menambahkan sound effect, debugging, dan memperbaiki logika game, semuanya bisa diselesaikan hanya dalam 2 hari.
Ini adalah pengalaman pertama menggunakan Amazon Q Developer, dan bisa dibilang ini adalah AI developer tool paling canggih yang pernah digunakan. Hampir semuanya ditangani. Menyiapkan development environment, menyusun struktur aplikasi, memperbaiki logika kode, hingga mendeploy aplikasi ke server EC2, semua dilakukan oleh Amazon Q Developer. Di balik layar, Amazon Q Developer bahkan menantang pemain untuk coding dengan mengenerate pertanyaan coding yang tricky di dalam game ini. Pada akhirnya, tool ini benar-benar mengajarkan cara build yang lebih baik dan lebih cepat.