Technologies Used:
- HTML5: For the structure and markup of the page, including tables, text, and navigation.
- CSS3: For visual design and styling, including layout, colors, typography, and responsiveness.
- Responsive Design: Techniques such as CSS Grid and Flexbox to create adaptable and flexible layouts.
- Responsiveness (Media Queries): To ensure the interface adjusts to various screen sizes (e.g., mobile, tablet, desktop).
- CSS Properties: Including box-sizing, flexbox, grid, transitions, and :hover to enhance interaction and aesthetics.
- Web Fonts: Use of custom or system fonts like Courier New, Arial, and Verdana for consistent typography.
- HTML Tables: Used to structure the statistics and leaderboard sections directly in HTML.
- Dynamic Table Generation (via Javascript): The game grid is dynamically created using JavaScript with <table> elements, simulating an interactive, matrix-based layout.
- JavaScript (ES6+): For client-side logic, including user interaction, game mechanics, DOM manipulation, statistics tracking, and leaderboard updates.
- Strict Mode ("use strict"): To enforce cleaner and more secure JavaScript coding practices.
- Event Listeners: To respond to user actions such as clicks, page loads, and gameplay events.
- Local Storage API: To persist user data (e.g., usernames, game history) across sessions without requiring a backend.
- Array Methods: Use of filter(), map(), sort(), and others for efficient data processing.
- Dynamic DOM Manipulation: For real-time updates to statistics, leaderboard entries, and the game interface.
- Modular Structure: Functions are organized by responsibility, improving code readability and maintainability.
Authors:
Daniel Santos (Number: 64168)
Miguel Lopes (Number: 42081)