FrisbyEE (Projet Hackathon)

Ce projet contient : un backend Spring Boot et un frontend React en TypeScript développé lors du hackathon. L'authentification est gérée par Keycloak et la base de données est PostgreSQL; les deux peuvent être lancés via Docker.

Présentation rapide

• Backend : Spring Boot (Java 17) dans back_end/
• Frontend : React et TypeScript dans front_end/
• Auth : Keycloak (voir keycloak/ pour la thème et configuré via docker-compose.yml)
• Base de données : PostgreSQL (configuré via docker-compose.yml)

Pré-requis

• Java 17
• Maven (utiliez mvn)
• Node.js et npm
• Docker et Docker Compose

Installation et démarrage

1. Récupérez le dépôt et placez-vous à la racine du projet.
2. Démarrez Keycloak et PostgreSQL avec Docker:

sudo docker compose up -d

3. Backend: construire et lancer (depuis la racine du projet):

cd back_end
./mvn clean install  
./mvn spring-boot:run 

4. Frontend: installer les dépendances et démarrer :

cd front_end
npm install
npm start

Le serveur de développement du frontend écoute par défaut sur http://localhost:3000, le backend sur http://localhost:8080, et api sur http://localhost:8081 sauf configuration différente.

Commandes utiles

• Arrêter et supprimer tous les conteneurs Docker:

sudo docker stop $(sudo docker ps -a -q)
sudo docker rm $(sudo docker ps -a -q)

• Ouvrir un shell Postgres dans le conteneur en cours d'exécution (exemple : conteneur frisbyee-postgres):

sudo docker exec -it frisbyee-postgres psql -U frisbyee_user -d frisbyee
# puis, par exemple : \dt  ou  SELECT * FROM session;

Keycloak / Thème de connexion

• Au début, il faut crée run realm qui s'appelle Frisbyee_realm, ensuite dans ce realm, créez un Frisbyee_client avec ce config debug:

ROOT URL: http://localhost:3000/
HOME URL: http://localhost:3000/
Valid redirect URIs: http://localhost:3000/*
Web origins: *

• Après, ajoutez les rôles : admin, coach, athlete
• Et, mettez chaque groupe ADMIN, COACH, ATHLETE et mapping chaque rôle pour chaque groupe.
• Dans User Registration, mettez le defaut groupe: ATHLETE et activez le user self registration.

Pour appliquer le thème de connexion personnalisé fourni dans keycloak/themes/frisbyee :

• Ouvrez la console d'administration Keycloak -> sélectionnez le realm -> Realm Settings -> modifiez le Display name si vous le souhaitez.
• Dans Themes, définissez Login Theme sur frisbyee puis enregistrez.

Configuration / Environnement

• Les propriétés du backend se trouvent dans back_end/src/main/resources/application.properties.
• Le frontend utilise public/keycloak.json pour la configuration du client Keycloak.
• Assurez-vous que le client Keycloak et le realm correspondent aux valeurs utilisées par les deux applications.

Contribution

• Thibaut ROCHAS
• Tuan Minh VU
• Amäel KESTEMAN
• Alexis LEBOEUF