DEV Community

Cover image for How I Built an AWS Quiz Game in Just 24 Hours with Amazon Q πŸš€
Thobeka Sithole
Thobeka Sithole

Posted on β€’ Originally published at Medium

How I Built an AWS Quiz Game in Just 24 Hours with Amazon Q πŸš€

AWSome Quiz is an interactive, web-based game designed to test and enhance users’ understanding of Amazon Web Services (AWS). It features a modern, space-themed interface with an animated starfield background that delivers an immersive user experience.

I recently embarked on creating an engaging quiz game focused on AWS knowledge. I believe that now is the perfect time to embrace AWS because the world is increasingly powered by the cloud, and AWS stands at the forefront of innovation. With its scalability, cost-efficiency, security and reliability, learning AWS opens doors to endless opportunities to build, innovate, and make an impact.
AWSome Quiz primarily focuses on educating users about AWS services.

How It Works

Players are presented with AWS-related questions one at a time.
Each question has multiple-choice answers.
Immediate feedback is provided after each answer: correct answers increase the score and trigger a green notification, while incorrect answers display the correct answer in a red notification.
At the end of the quiz, players can review their final score and a detailed performance summary, including all questions and correct answers.
The current version of the game features clean HTML for the main structure and layout, CSS for styling and animations, and JavaScript for game logic and functionality.

How I Used Amazon Q

Amazon Q was an invaluable partner throughout this development process. Its real-time guidance, code suggestions, and best practice recommendations significantly accelerated development. What would typically take days of research and implementation was accomplished in just hours.

Amazon Q suggested modern fonts and UI elements to enhance user experience and optimized the code for better organization and maintainability. It also assisted in implementing the scoring system and even generated some of the quiz questions for the AWSome Quiz game.

I was genuinely impressed by Amazon Q, as it exceeded my expectations. However, there were moments when it seemed to make more changes than necessary. I later realized that highlighting a specific section of my code β€” rather than the entire workspace β€” was essential for receiving targeted assistance and staying informed about the modifications made.

With Amazon Q Developer, I ensured high-quality code and modern development practices throughout the project. I believe it is essential to have a clear understanding of what you want Amazon Q to assist with, as this clarity enables the tool to deliver optimal and effective results.

Additionally, AWS Amplify hosting was used to deploy the game, while Amazon S3 managed game assets, resulting in seamless deployment and efficient asset management.

What’s Next for AWSome Quiz

I’m excited about expanding the AWSome Quiz Game as the next phase will integrate:

DynamoDB to store quiz questions and player scores.
API Gateway to handle secure communication between the frontend and backend.
Lambda functions to process game logic and manage leaderboards.

These additions will transform the game into a fully serverless application, highlighting the power and scalability of AWS services. Considering all these factors, I can confidently assert that Amazon Q Developer is the most capable generative AI-powered assistant for software development.

Play here: https://main.dpk3vz2sczx21.amplifyapp.com/

Github: https://github.com/Thobeka-coder/AWSome-Quiz-Game

Please feel free to play and share your score πŸš€

https://www.youtube.com/watch?v=QGFEA99h1nY

Billboard image

Deploy and scale your apps on AWS and GCP with a world class developer experience

Coherence makes it easy to set up and maintain cloud infrastructure. Harness the extensibility, compliance and cost efficiency of the cloud.

Learn more

Top comments (0)

Cloudinary image

Optimize, customize, deliver, manage and analyze your images.

Remove background in all your web images at the same time, use outpainting to expand images with matching content, remove objects via open-set object detection and fill, recolor, crop, resize... Discover these and hundreds more ways to manage your web images and videos on a scale.

Learn more

πŸ‘‹ Kindness is contagious

Please leave a ❀️ or a friendly comment on this post if you found it helpful!

Okay