Cyber Battle | Devpost

Contact Hackunia's Administration Page
Safe and Destroyed Zones Details Page
Captured Areas By Aliens Details Page
About Hackunia Planet Page
Home Page

Inspiration

The inspiration for this project came from my fascination with space adventures and my passion for coding. I wanted to create an engaging and interactive experience that combined these two interests. The concept of a planet under attack by aliens provided a perfect backdrop for a thrilling cyber battle game.

How we built it

React Bootstrap: Integrating React Bootstrap was initially confusing due to the multitude of components and customization options available. It took time to understand how to effectively use these components to create a cohesive design.

React Router DOM: Navigating between different pages in the app using React Router DOM was challenging because of its unique features and the need to manage various routes properly.

Deployment on GitHub Pages: Deploying the project on GitHub Pages was the most time-consuming and challenging part. React apps using React Router require specific configurations to ensure that routing works correctly on GitHub Pages, which proved to be a critical but valuable learning experience.

Challenges we ran into

Conceptualization: I brainstormed and refined the idea of Hackunia Defense, outlining the core gameplay mechanics and user interface design.

Development: Using React, I built the components for the game, integrating React Bootstrap for styling and React Router DOM for navigation.

Testing: I thoroughly tested the application to ensure smooth gameplay and seamless transitions between different parts of the app.

Deployment: The final step was deploying the project on GitHub Pages, which was particularly challenging due to the complexities involved in deploying a React app with React Router.

Accomplishments that we're proud of

We are proud of several accomplishments in this project:

Successful Integration: We successfully integrated React Bootstrap to create a visually appealing and responsive design, overcoming initial confusion and challenges.

Smooth Navigation: Implemented React Router DOM for seamless navigation between different parts of the app, ensuring a smooth user experience.

Deployment Achievement: Overcame the complexities of deploying a React app with React Router on GitHub Pages, which was a significant technical achievement and a valuable learning experience.

User Feedback: Successfully incorporated feedback from initial testers to improve the user interface and overall gameplay, demonstrating our commitment to continuous improvement.

What we learned

This project was a tremendous learning experience. I deepened my understanding of React, particularly its component-based architecture and state management. I also gained valuable insights into using React Bootstrap for responsive design and styling, and React Router DOM for navigating between different pages in the application. Additionally, I learned how to manage and implement complex features unique to React, enhancing my overall development skills.

What's next for Cyber Battle

Feature Expansion: We plan to introduce new gameplay features, including additional levels, more diverse alien characters, and power-ups to enhance the user experience.

Multiplayer Mode: We aim to develop a multiplayer mode, allowing users to team up and defend Hackunia together, adding a social and cooperative dimension to the game.

Mobile Version: We intend to create a mobile version of Cyber Battle, making it accessible on both Android and iOS devices for on-the-go gaming.

Community Engagement: We will establish a community forum where players can share their experiences, provide feedback, and suggest new ideas for the game.

Continuous Improvement: Based on player feedback, we will continue to refine and improve the game's mechanics, design, and overall performance to ensure an engaging and enjoyable experience for all users.