AWS Logo
Menu
Basketcatcher : Players catch falling objects using a basket

Basketcatcher : Players catch falling objects using a basket

Basketcatcher is a fun and interactive game where players catch falling objects using a basket. The objective is to collect as many good objects (fruits) as possible while avoiding bad objects (bombs). The game features increasing difficulty levels, a scoreboard, and a visually appealing background.

game-challengeamazonqaws
AnkitW
Published Dec 20, 2024

How to Play

Link - https://main.dn3gd8g9qkps7.amplifyapp.com/

How to Play Basketcatcher

Start the Game:
- Open the `index.html` file in your web browser.
- Click the "Start Game" button to begin your adventure.
Control the Basket:
- Use the **left arrow key** to move the basket to the left.
- Use the **right arrow key** to move the basket to the right.
Catch Fruits:
- As fruits fall from the top of the screen, position your basket to catch them. Each fruit you catch will increase your score.
Avoid Bombs:
- Be careful! Bombs will also fall from the top. If you catch a bomb, the game will end. Try to avoid them at all costs!
Increase Your Score:
- The more fruits you catch, the higher your score will be. Aim to beat your previous high score or compete with friends!
Game Over:
- If you catch a bomb, the game will end, and you will see your final score. You can then choose to restart the game.

Amazon Q Developer – Your AI-Powered Coding Assistant

  1. Code Generation: Amazon Q excels at generating clean and efficient JavaScript code, making it ideal for developers transitioning from Python. This feature allows for quick implementation of game features like "vanishing moves."
  2. Debugging: With robust debugging capabilities, Amazon Q helps troubleshoot code issues, ensuring that game logic (e.g., win-checking and board resets) functions correctly, which saves valuable time during hackathons.
  3. Code Cleanup: The tool enhances code readability and maintainability by organizing code and adding comments, making it easier to understand and modify under tight deadlines.

2. AWS Amplify – Full-Stack Development and Hosting

  • Easy Deployment: AWS Amplify simplifies the deployment process even further than S3. With Amplify, you can connect your code repository (like GitHub) and automatically deploy your game with a few clicks. This continuous deployment feature allows for rapid iterations and updates.
  • Integrated Backend Services: Amplify provides a range of backend services, such as authentication, APIs, and databases, which can be easily integrated into your game. This is particularly useful if you plan to add features like user accounts or leaderboards in the future.
  • Scalability: Like S3, AWS Amplify is designed to handle varying levels of traffic. However, it also offers additional features like automatic scaling for backend services, ensuring that your game can grow without requiring extensive management.
  • Cost-Effective: AWS Amplify has a free tier that allows you to host and manage your application at no cost for a limited amount of usage. This makes it an excellent choice for hackathon projects, where budget constraints are often a concern.
  • User-Friendly Interface: Amplify provides a user-friendly console and CLI, making it easier to manage your application and its resources. This can save time and reduce complexity, allowing you to focus on building your game.

Game Overview: Basketcatcher

Basketcatcher is an engaging arcade-style game where players catch falling fruits using a basket while avoiding bombs. The objective is to collect as many fruits as possible to score points, with the game becoming increasingly challenging as the speed of falling objects increases.

Key Features:

  • Catch Fruits: Score points by catching various fruits.
  • Avoid Bombs: Catching a bomb ends the game.
  • Dynamic Difficulty: Game speed increases with progress.
  • Scoreboard: Track and compete for high scores.
  • Responsive Design: Playable on various devices.
Basketcatcher offers a fun and competitive experience for players of all ages, testing reflexes and hand-eye coordination in a visually appealing environment.

How to Build and Deploy the Basketcatcher Game from GitHub

To build and deploy the Basketcatcher game from the GitHub repository Basketcatcher, follow these steps:

Prerequisites

  • Basic knowledge of HTML, CSS, and JavaScript.
  • A code editor (e.g., Visual Studio Code, Sublime Text).
  • A web browser for testing.
  • Git installed on your computer (optional, for cloning the repository).
  • (Optional) A hosting platform account (e.g., GitHub Pages, Netlify, Vercel).

Step 1: Clone the Repository

  1. Clone the Repository:
    • Open your terminal or command prompt.
    • Run the following command to clone the repository:BASH1git clone https://github.com/ankitwarbhe/Basketcatcher.git
    • Navigate to the project folder:BASH1cd Basketcatcher

Step 2: Open the Project

  1. Open the Project in Your Code Editor:
    • Open the cloned Basketcatcher folder in your preferred code editor.

Step 3: Test the Game Locally

  1. Open the index.html File:
    • Open the index.html file in your web browser to test the game.
    • Use the left and right arrow keys to control the basket and ensure that the game functions as expected.

Step 4: Build and Deploy the Game

You can deploy the game using various platforms. Here are instructions for GitHub Pages, Netlify, and Vercel.

Deploying with GitHub Pages

  1. Create a GitHub Repository:
    • Go to GitHub and create a new repository (do not initialize with a README).
  2. Push the Code to GitHub:
    • In your terminal, run the following commands:BASH1git add .
      2git commit -m "Initial commit"
      3git remote add origin https://github.com/<your-username>/<repository-name>.git
      4git push -u origin main
  3. Enable GitHub Pages:
    • Go to the repository settings on GitHub.
    • Scroll down to the "GitHub Pages" section.
    • Select the main branch as the source and save.
    • Your game will be available at https://<your-username>.github.io/<repository-name>.

Deploying with Netlify

  1. Sign Up for Netlify:
    • Go to Netlify and sign up for an account.
  2. Deploy the Game:
    • Drag and drop the entire Basketcatcher folder onto the Netlify dashboard.
    • Netlify will automatically deploy your game and provide a live URL.

Deploying with Vercel

  1. Sign Up for Vercel:
    • Go to Vercel and sign up for an account.
  2. Import Your GitHub Repository:
    • Click on "New Project" and import the GitHub repository you created.
    • Follow the prompts to deploy your game.

Step 5: Share Your Game

  • Once deployed, share the link with friends and family to enjoy the game!
By following these steps, you can successfully build and deploy the Basketcatcher game from the GitHub repository. Enjoy your gaming experience!

Conclusion

Basketcatcher is a fun and engaging arcade-style game that combines simple mechanics with increasing challenges, making it enjoyable for players of all ages. By following the steps outlined in this guide, you can easily build and deploy the game from the GitHub repository, allowing others to experience the excitement of catching fruits while avoiding bombs.
Whether you choose to host the game on GitHub Pages, Netlify, or Vercel, the process is straightforward and accessible, even for those with basic web development knowledge. This project not only serves as a great introduction to game development but also provides an opportunity to learn about web technologies such as HTML, CSS, and JavaScript.
As you explore and modify the game, consider adding new features or improving existing ones to enhance the gameplay experience. Sharing your version of Basketcatcher with friends and family can lead to friendly competition and fun memories.
GitHub Repository: https://github.com/ankitwarbhe/Basketcatcher
Happy coding, and enjoy your journey in game development with Basketcatcher!
 

Comments