Skip to content

Commit

Permalink
[DOCS] add table of content and more content
Browse files Browse the repository at this point in the history
  • Loading branch information
@SaidNajim
SaidNajim committed May 24, 2024
1 parent dfd953e commit 2a24a28
Showing 1 changed file with 214 additions and 67 deletions.
281 changes: 214 additions & 67 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,95 +1,242 @@
# Projet ”Plate-formes de développement” - SporterZ
# **Table of Contents**
- [Project Presentation](#project-presentation)
- [Collaborators](#collaborators)
- [System Design](#system-design)
- [Functional Requirements](#Functional-Requirements)
- [Non-Functional Requirements](#Non-Functional-Requirements)
- [UML Diagrams](#uml-diagrams)
- [Project Architecture](#project-architecture)
- [Application Mockup](#application-mockup)
- [Build System](#build-system)
- [Good Practices](#good-practices)
- [Integration of Design Patterns](#integration-of-design-patterns)
- [Testing](#testing)
- [Hashing User Passwords](#hashing-user-passwords)
- [Storing Secrets in .properties File](#storing-secrets-in-properties-file)
- [Key Features](#key-features)
- [Real-Time Kafka Messaging](#real-time-kafka-messaging)
- [JWT Authentication](#jwt-auth)
- [Multilingual Aspect](#multilingual-aspect)
- [Scheduling](#scheduling)
- [DevOps Culture](#devops-culture)
- [GitHub/GitLab Sync Pipeline](#github-gitlab-sync-pipeline)
- [CI/CD Using GitLab-CI](#cicd-using-gitlab-ci)
- [API Gateway](#api-gateway)
- [Monitoring](#monitoring)
- [Dashboard](#dashboard)
- [Kubernetes + Load Balancer](#kubernetes--load-balancer)
- [How to run the project ?](#How-to-run-the-project-?)

# Project Presentation <a id="project-presentation"></a>
<div style="text-align: center;">
<img src="https://i.ibb.co/vj7xmFZ/logo.png" alt="drawing" width="200">
</div>
<b>SporterZ</b> is a social platform designed specifically for soccer fans. It offers an interactive space where fans can exchange ideas, receive notifications about their favorite teams' matches, and take part in live discussions with other fans in rooms dedicated to teams or matches. Users can vote on match results, share publications on their profile and create their own chat rooms. In addition, SporterZ features private messaging and external sharing. The platform's interface is organized to present both suggested and user-followed content.
<br/> <br/>

# Collaborators <a id="collaborators"></a>

<table>
<tbody>
<tr>
<td align="center" valign="top" width="16.66%"><a href="https://www.linkedin.com/in/ilyas-abdellaoui/"><img src="https://avatars.githubusercontent.com/u/79768267?v=4s=120" width="120px;" alt="Ilyas ABDELLAOUI"/>
<br /> <sub><b>Ilyas ABDELLAOUI</b></sub></a></td>
<td align="center" valign="top" width="16.66%"><a href="https://www.linkedin.com/in/myassineboumehdi/"><img src="https://avatars.githubusercontent.com/u/115194839?v=4s=120" width="120px;" alt="Ilyas ABDELLAOUI"/>
<br /> <sub><b>Mohammed-Yassine BOUMEHDI</b></sub></a></td>
<td align="center" valign="top" width="16.66%"><a href="https://www.linkedin.com/in/saidnajim/"><img src="https://avatars.githubusercontent.com/u/85839515?v=4s=120" width="120px;" alt="Ilyas ABDELLAOUI"/>
<br /> <sub><b>Said NAJIM</b></sub></a></td>
<td align="center" valign="top" width="16.66%"><a href="https://www.linkedin.com/in/adnane-mandili-12997b251/"><img src="https://avatars.githubusercontent.com/u/112574330?v=4s=120" width="120px;" alt="Ilyas ABDELLAOUI"/>
<br /> <sub><b>Adnane MANDILI</b></sub></a></td>
</tr>
</tbody>
<table>

# System Design <a id="system-design"></a>

## Functional Requirements <a id="Functional-Requirements"></a>

### Authentication and Login
* Account creation
* Single Sign-On (SSO) login

### Messaging
* Sending and receiving private messages
* New message notifications

### Team Tracking
* Stay informed about favorite teams
* Notifications about news and events
* View match results

### Access to Team-Dedicated Chat Rooms
* Participate in discussions
* View messages from other users
* Join chat rooms for ongoing matches and favorite teams
* Interact with other users

### Viewing Other Users' Posts
* Like and comment on posts
* Share posts

### Sharing Posts
* Share to your profile
* Share posts to other social networks
* Share posts to private conversations
* Share posts to joined chat rooms

### Viewing Joined Chat Rooms
* Ability to leave a chat room

### Editing Your Profile
* Modify photo, name, bio, etc.
* Modify preferences (language, notifications)

### Creating Chat Rooms
* Create your own chat rooms
* Choose a topic
* Invite other users

## Non-Functional Requirements <a id="Non-Functional-Requirements"></a>

### Security
* Ensure the security of user data
* Secure login to the platform
* User authentication and authorization
* Encryption of sensitive data
* Protection against XSS, CSRF, SQL injection attacks, etc.

---
## Descriptif du projet
SporterZ est une plateforme sociale conçue spécifiquement pour les passionnés de football. Elle offre un espace interactif où les fans peuvent échanger leurs idées, recevoir des notifications sur les matches de leurs équipes préférées, et participer à des discussions en direct avec d’autres fans dans des salles dédiées aux équipes ou aux matches. Les utilisateurs ont la possibilité de voter sur les résultats des matches, de partager des publications sur leur profil et de créer leurs propres salles de discussion. De plus, SporterZ propose une fonction de messagerie privée et de partage externe. L’interface de la plateforme est organisée de manière à présenter du contenu suggéré ainsi que du contenu suivi par l’utilisateur.
### Performance
* Fast response time for user actions
* Ability to handle a large number of users

### Scalability
* Adapt to the growth in the number of users

### Maintenance
* Easy to maintain and update

### Availability
* Platform accessible 24/7
* High availability rate

---
### Rate Limiting
* Limit the number of requests per user to prevent abuse

## Diagramme de cas d’utilisation
### Logging and Monitoring
* Log events and errors (Prometheus, Grafana)
* Monitor platform performance

### UML Diagrams
#### Use Case Diagram
![Figure 1: Diagramme de cas d’utilisation](https://www.plantuml.com/plantuml/png/ZPB1QlCm48JlUeh5b_-K5_W98QNGGo6jQTfBRq9UnwAojaZhb53wxgsbn7ZHHRVix7oHPgnzP1ru6fros3CmGR2dWQ6p0GrRyaeRfW1l4GFe2Ctyer5gtcf_SWZ7JmgCuVrR0KmHZOu8pJrvZoRzN-iqznJ6PiQl-arR8qVq7RJ1dZKZ7316VSAOe7bp4mJ1-W9FnBQts44VQ8G7VQPW6U4LzPZfsNKphUb7iXwa_n-y45snUPqc4Mj0ym4jHSwcDATHt6lG0LUkD1UknAPZi5kTc-Ii5iSVgBFz1Tf0lNMOx5cwAaMyEyEJTd3GR0OiukLjNigh1TICyFpbLqGM_xHyBGNvJMmsE_61X2wgNtJHxIAABXTrwKvwPKbY9nfPBOh8WYhIYL3P8jyk_8VjrdhZfWvtEmKYROr_QQ76lBHJvKwjrRgBDciOqN85KBPV0uclKa6e7xL7tqsZ-mK0)

## Project Architecture

---
![Project Architecture](https://github-production-user-asset-6210df.s3.amazonaws.com/115194839/317356426-3d8a427b-6da9-4e2c-bd34-56d0a7ceeb36.jpeg?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAVCODYLSA53PQK4ZA%2F20240523%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20240523T225651Z&X-Amz-Expires=300&X-Amz-Signature=a5415b93d3946f3c151c1120037ee19c2d74c396dfd279deb33fdf4a672067a9&X-Amz-SignedHeaders=host&actor_id=85839515&key_id=0&repo_id=756865469)

## Besoins Fonctionnels

### Authentification et Connexion
- Création de compte
- Connexion SSO (Single Sign On)
## Application Mockup

### Messagerie
- Envoi et réception de messages privés
- Notifications de nouveaux messages
![Figure 2: Acceuil et navigation](https://i.ibb.co/R6bqMR0/HOME.png)

### Suivi des Équipes
- Rester informé des équipes favorites
- Notifications sur les actualités et événements
- Consultation des résultats des matchs
## Build System
<div style="text-align: center;">
<img src="https://i.ibb.co/tQyk8DY/build.png" alt="build" width="full">
</div>

### Accès aux salons dédiés aux équipes
- Participation aux discussions
- Affichage des messages des autres utilisateurs
- Rejoindre les salons des matchs en cours et des équipes favorites
- Interaction avec les autres utilisateurs
We utilized the maven-multimodule approach, which allowed us to organize our codebase into multiple, independent modules within a single project.
The maven-multimodule setup enabled us to define dependencies between modules, share common configurations, and build and package each microservice independently

### Consultation des publications des autres utilisateurs
- Likes et commentaires
- Partager des publications
## Good Practices

### Partage des publications
- Partager sur son profil
- Partager des publications vers d'autres réseaux sociaux
- Partager des publications vers les discussions privées
- Partager des publications vers les salons rejoints
### Integration of Design Patterns

### Affichage de la liste des salons rejoints
- Possibilité de quitter un salon
<!-- Add integration of design patterns details here -->

### Modifier son profil
- Modification de la photo, du nom, de la bio, etc.
- Modification des préférences (langue, notifications)
### Testing
<div style="text-align: center;">
<img src="https://i.ibb.co/NmqhJGX/testing.png" alt="testing" width="full">
</div>

### Création de salons de discussion
- Créer ses propres salons
- Choix du sujet
- Invitation d'autres utilisateurs
For testing our microservices, we employed the following features:

- @SpringBootTest annotation from Spring Boot's test utilities to load the entire application context for integration testing.
- @AutoConfigureMockMvc annotation to automatically configure MockMvc, a utility class provided by Spring Test for performing mock requests against the application's controllers.
- JUnit 5 to write and execute our unit and integration tests.

---
### Hashing User Passwords

## Besoins Non Fonctionnels
<div style="text-align: center;">
<img src="https://i.ibb.co/8780RwF/passHash.png" alt="passwordHashing" width="full">
</div>

### Sécurité
- Garantie de la sécurité des données des utilisateurs
- Connexion sécurisée à la plate-forme
- Authentification et autorisation des utilisateurs
- Cryptage des données sensibles
- Protection contre les attaques XSS, CSRF, SQL injection, etc.
### Storing Secrets in .properties File

### Performance
- Temps de réponse rapide pour les actions utilisateur
- Capacité à gérer un grand nombre d'utilisateurs
<div style="text-align: center;">
<img src="https://i.ibb.co/jkx2Srv/propre.png" alt="Secrets" width="full">
</div>

### Évolutivité
- Adaptation à la croissance du nombre d'utilisateurs
## Key Features

### Maintenance
- Facilité de maintenance et de mise à jour
### Real-Time Kafka Messaging

### Disponibilité
- Plateforme accessible 24h/24 et 7j/7
- Taux de disponibilité élevé (supérieur à 99,9%)
<!-- Add real-time Kafka messaging details here -->

### Rate limiting
- Limitation du nombre de requêtes par utilisateur pour éviter les abus
### JWT Auth

### Logging et monitoring
- Enregistrement des événements et des erreurs (Prometheus, Grafana)
- Surveillance des performances de la plateforme
<div style="text-align: center;">
<img src="https://i.ibb.co/h2yKsqM/jwt.png" alt="Secrets" width="full">
</div>

---
## Maquette
![Figure 2: Acceuil et navigation](https://i.ibb.co/R6bqMR0/HOME.png)
### Multilingual Aspect

<div style="text-align: center;">
<img src="https://i.ibb.co/MfZbLpn/multi-Lung.png" alt="Secrets" width="full">
</div>


For multilingual support in our Angular application, we utilized Angular's i18n tooling.

This involved generating translation files using the `ng xi18n` command, which extracted translatable text from the application's templates and components.

These translation files were then translated for each supported language.

During the build process, Angular's Ahead-of-Time (AoT) compiler utilized these translation files to generate language-specific bundles.

### Scheduling

In the UpdateMatchesBoard class, the dailyMatchesBoardUpdate method is annotated with @Scheduled(cron = "0 5 * * *").

This cron expression specifies that the method should be executed every 5 minutes.

The method clears an existing matches board, retrieves match data from an external football API, and updates the matches board with the fetched data.

## DevOps Culture

### GitHub/GitLab Sync Pipeline

<!-- Add GitHub/GitLab sync pipeline details here -->

### CI/CD Using GitLab-CI

<!-- Add CI/CD using GitLab-CI details here -->

### API Gateway

<!-- Add API gateway details here -->

### Monitoring

<!-- Add monitoring details here -->

### Dashboard

<!-- Add dashboard details here -->

### Kubernetes + Load Balancer

<!-- Add Kubernetes + load balancer details here -->

## How to run the project ?

---
<!-- How to run the project details here -->

0 comments on commit 2a24a28

Please sign in to comment.