update README
This commit is contained in:
98
README.md
98
README.md
@@ -1,44 +1,86 @@
|
|||||||
# hackathon
|
# FrisbyEE (Projet Hackathon)
|
||||||
|
|
||||||
## Pour lancer
|
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:
|
||||||
|
|
||||||
|
```bash
|
||||||
sudo docker compose up -d
|
sudo docker compose up -d
|
||||||
|
```
|
||||||
|
|
||||||
### back_end
|
3. Backend: construire et lancer (depuis la racine du projet):
|
||||||
cd back_end
|
|
||||||
|
|
||||||
#### Pour installer java 17
|
```bash
|
||||||
sudo apt install openjdk-17-jdk
|
cd back_end
|
||||||
export JAVA_HOME=/usr/lib/jvm/java-17-openjdk-amd64
|
./mvn clean install
|
||||||
export PATH=$JAVA_HOME/bin:$PATH
|
./mvn spring-boot:run
|
||||||
|
```
|
||||||
|
|
||||||
#### Clean
|
4. Frontend: installer les dépendances et démarrer :
|
||||||
mvn clean install
|
|
||||||
|
|
||||||
#### Pour lancer back_end
|
```bash
|
||||||
mvn spring-boot:run
|
|
||||||
|
|
||||||
### front_end
|
|
||||||
cd front_end
|
cd front_end
|
||||||
|
npm install
|
||||||
#### Install
|
|
||||||
npm install
|
|
||||||
|
|
||||||
#### Lancer front_end
|
|
||||||
npm start
|
npm start
|
||||||
|
```
|
||||||
|
|
||||||
#### Docker
|
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:
|
||||||
|
|
||||||
|
```bash
|
||||||
sudo docker stop $(sudo docker ps -a -q)
|
sudo docker stop $(sudo docker ps -a -q)
|
||||||
|
sudo docker rm $(sudo docker ps -a -q)
|
||||||
|
```
|
||||||
|
|
||||||
#### Pour acceder sur docker
|
- Ouvrir un shell Postgres dans le conteneur en cours d'exécution (exemple : conteneur `frisbyee-postgres`):
|
||||||
|
|
||||||
|
```bash
|
||||||
sudo docker exec -it frisbyee-postgres psql -U frisbyee_user -d frisbyee
|
sudo docker exec -it frisbyee-postgres psql -U frisbyee_user -d frisbyee
|
||||||
|
# puis, par exemple : \dt ou SELECT * FROM session;
|
||||||
|
```
|
||||||
|
|
||||||
#### Voir les données:
|
## Keycloak / Thème de connexion
|
||||||
\dt
|
- 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:
|
||||||
SELECT * FROM session;
|
```
|
||||||
|
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.
|
||||||
|
|
||||||
|
|
||||||
#### Appliquer le CSS pour la page de login Keycloak
|
## 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.
|
||||||
|
|
||||||
Sur la console Keycloak aller dans realm setting
|
## Contribution
|
||||||
-> Changer le display name (par exemple: Bienvenue sur Frisbyee !)
|
- Thibaut ROCHAS
|
||||||
-> Theme puis changer le login theme sur frisbyee
|
- Tuan Minh VU
|
||||||
|
- Amäel KESTEMAN
|
||||||
|
- Alexis LEBOEUF
|
||||||
Reference in New Issue
Block a user