AWS Logo
Menu

Building a Tic Tac Toe Upgrade with Amazon Q and AWS S3

A Simple Idea for timed Tic Tac Toe with a Modern, Lightweight Implementation using AWS.

game-challengeawscommunitybuildersamazon-q
Divyanshu Shukla
Published Dec 17, 2024
Last Modified Jan 10, 2025
During a casual browse on Reddit, I stumbled across a post about an upgraded Tic Tac Toe game. The idea resonated: a classic game made more exciting by introducing vanishing moves after 3 turns. This led to the creation of a modern Timed Tic Tac Toe Game, leveraging Amazon Q Developer and AWS S3 for development and hosting.

How to Play

Link: http://peachycloudsecurity-e8v0fg0n.s3-website-us-east-1.amazonaws.com/
  1. Objective:
    Align 3 of your moves (X or O) in a row horizontally, vertically, or diagonally to win.
  2. Vanishing Moves:
    • Players take turns placing their moves (X or O).
    • After the 3rd move, the oldest move vanishes to keep the game dynamic.
    • This adds a strategic challenge – think ahead to maintain your winning position.
  3. Winner Tracking:
    • The game automatically tracks the last 10 winners and displays them in the scoreboard below the game.
    • Win as many times as you can and dominate the leaderboard!
  4. Reset:
    • The board resets automatically after a win.
    • Start a new round and continue playing.

Why Amazon Q and AWS S3?

Building a game quickly for a hackathon requires tools that are efficient, cost-effective, and scalable. Here’s why Amazon Q Developer and AWS S3 were perfect choices:

1. Amazon Q Developer – Your AI-Powered Coding Assistant

Using Amazon Q extension from visual studio marketplace.
vscode
vscode
Amazon Q played a pivotal role in the development of this game as I am used to python and not js:
  • Code Generation:
    Amazon Q generated clean and efficient JavaScript logic for the game, such as implementing the "vanishing moves" feature where older moves disappear after the 4th turn.
    • Example:
      “Generate JavaScript logic for a Tic Tac Toe game where player moves vanish after 3 turns.”
  • Debugging:
    • Q helped troubleshoot and optimize the win-checking logic and board reset behavior.
Amazon-Q Debug
Amazon-Q Debug
  • Code Cleanup:
    • Amazon Q improved code readability, reduced redundancy, and added comments to make the project maintainable.

2. AWS S3 – Simple, Scalable File Hosting

AWS S3 made hosting the game effortless with its static website hosting feature. Here’s how S3 streamlined the process:
  • Easy Deployment:
    • Uploading the game’s HTML, CSS, and JS files to an S3 bucket automatically served the project as a public website.
  • Scalability:
    • AWS S3 seamlessly handles traffic without requiring server management, making it ideal for hackathon projects or viral ideas.
  • Cost-Effective:
    • Hosting static files on S3 costs next to nothing, perfect for personal or hackathon projects.

Game Overview: Timed Tic Tac Toe

The game adds a strategic twist to the traditional Tic Tac Toe:
  1. Vanishing Moves:
    • After placing 3 moves, the oldest move disappears, keeping the game dynamic and challenging.
  2. Scoreboard:
    • The game tracks the last 10 winners using local storage, making it lightweight and self-contained.
  3. Modern Design:
    • A polished UI with responsive design ensures the game looks great on any device.

How to Build and Deploy This Game

1. Prerequisites

  • AWS CLI configured with IAM credentials.
  • OpenTofu installed (or Terraform).
  • Visual Studio Code (VSCode) with CloudLabIDE setup.

2. Clone the Repository

To get started, clone the repository and navigate to the project directory:

3. Deploy Using OpenTofu

Initialize and apply the infrastructure to create an S3 bucket and upload the game files:
  • Once the process completes, OpenTofu outputs the website URL:
tic-tac-toe
tic-tac-toe

4. Access the Game

Open the website URL in your browser to start playing the upgraded Tic Tac Toe game with vanishing moves.

The Power of Amazon Q and AWS S3

By combining Amazon Q Developer and AWS S3, this project highlights how modern tools can simplify and accelerate development:
  • Amazon Q enables fast coding, debugging, and optimization.
  • AWS S3 provides a simple and scalable hosting platform for static websites.
These tools are invaluable for hackathons, where time is limited, and scalability matters.

What’s Next?

This project serves as a foundation for further upgrades, such as:
  • Adding timers for moves to increase challenge.
  • Introducing a multiplayer mode using lightweight backend services.
  • Enhancing the UI/UX with animations or sound effects.

Conclusion

The Timed Tic Tac Toe Game demonstrates how a simple idea, inspired by a Reddit post, can evolve into a polished and engaging project using Amazon Q Developer and AWS S3. These tools made development fast, hosting effortless, and the end result scalable.
Feel free to explore, clone, and deploy the project yourself:
GitHub Repository: Timed Tic Tac Toe Game
Team: Anjali & Divyanshu
Let’s continue building simple, scalable, and fun applications – one idea at a time! 🚀
 

Comments