Hexagonal Chess - Frontend

Immerse yourself in the strategic world of Gliński's variant chess with my project. The Frontend is powered by Angular, showcasing my expertise in web development.

Live website · Report Bug · Request Feature

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Prerequisites
   • Installation
3. Usage
4. Roadmap
5. License
6. Contact

About The Project

As a passionate web developer, I constantly seek out intriguing challenges. Inspired by a YouTube video by C.G.P. Grey titled 'Can Chess, with Hexagons?', I dove into the world of hexagonal chess and was immediately captivated by its unique complexity and possibilities. This fascination drove me to create a digital version of the Gliński's variant, blending my love for coding with my newfound interest for this chess variant.

(back to top)

Built With

• 
• Keycloak
• 
• 
• 
• Angular Material UI component library
• 
• keycloak angular
• AG Grid
• ngx-toastr
• 

(back to top)

Local development environment

To get a local copy up and running, follow these simple steps.

Prerequisites

Before diving into the installation section, make sure your system meets the following prerequisites:

• Git
• Docker
• Docker Compose
• Java 17
• IntelliJ IDEA
• npm
• Angular CLI

Installation

1. Get Local Docker Compose Running

1.1. Clone the Docker Compose Repository:

Start by cloning the Docker Compose repository using the following command:

git clone https://github.com/sisimomo/hexagonalChess-docker-compose.git

1.2. Navigate to the Local Folder:

Move into the local folder within the cloned repository:

cd ./hexagonalChess-docker-compose/local

1.3. Configure Environment Variables:

Duplicate the .env.sample file and rename it to .env:

cp ./.env.sample  ./.env

Customize the variables in the .env file to your preferences.

1.4. Initiate Docker Compose:

Start docker containers using Docker Compose:

docker-compose up -d

2. Get the frontend Running

2.1. Clone the Backend Repository:

Clone the backend repository using the following command:

git clone https://github.com/sisimomo/hexagonalChess-backend.git

2.2. Open in IntelliJ:

Open the cloned repository folder using IntelliJ IDEA.

2.3. Update Environment Variables:

Adjust the environment variables according to your .env modifications in the "Run/Debug configuration" named "HexagonalChessApplication" located in the .run folder within the cloned repository.

2.4. Start the Application:

Launch the application using the "Run/Debug configuration" named "HexagonalChessApplication" in IntelliJ.

3. Get the Frontend Running

3.1. Clone the Frontend Repository:

Clone the frontend repository using the following command:

 git clone https://github.com/sisimomo/hexagonalChess-frontend.git

3.2. Navigate to the Frontend Folder:

Change your working directory to the frontend folder:

cd ./hexagonalChess-frontend

3.3. Install Dependencies:

Install project dependencies using npm:

npm install

3.4. Run the Project:

Start the project using Angular CLI:

ng serve

4. Enjoy!

Feel free to explore the code and provide suggestions for enhancement by creating feature requests through new GitHub issues.

(back to top)

Roadmap

• Fix Websocket (STOMP) authentification issue when page is open for a long period of time.
• Add a way to surrender a game.
• Complete Chess Engine unit tests.
  • Coordinate class.
  • Piece abstract class.
  • Pawn class.
  • King class.
  • Game class.
• Hexagonal Chess calculator to allow player to play against a bot locally.
• Add a list of game with missing player in the game list page.
• Add a list of previously played games in the game list page.
• Add a way to visualize previous moves in the game page.
• Add a way to spectate a game.
• Add a chat in the game page.

See the open issues for a full list of proposed features (and known issues).

(back to top)

License

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)

Contact

Project Urls:

• frontend
• Frontend
• Identity provider

(back to top)