Project Presentation

SporterZ 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.

Collaborators

_{Ilyas ABDELLAOUI}

_{Mohammed-Yassine BOUMEHDI}

_{Said NAJIM}

_{Adnane MANDILI}

Structure of the repository

System Design

Functional Requirements

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

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.

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

Logging and Monitoring

Log events and errors (Prometheus, Grafana)
Monitor platform performance

UML Diagrams

Use Case Diagram

Sequence Diagram

The interaction between the frontend, Nginx (acting as a proxy), and the backend (Spring Cloud Gateway), where Nginx forwards requests and injects the appropriate CORS headers into the responses to authorize frontend access.

Project Architecture

First Version

Updated Version

Application Mockup

Build System

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

Good Practices

Integration of Design Patterns

Proxy Pattern

The Proxy Pattern is effectively present in your architecture through the use of the API Gateway.

This gateway acts as a proxy, managing access and communication between clients and microservices, and adding additional functionalities such as request transformation, logging, access control and caching.

Observer pattern

We use the Observer pattern in an Angular application to handle HTTP requests.

The AppHttpInterceptor class implements the HttpInterceptor interface to intercept HTTP requests and append an authorization token to the headers, unless the request is for authentication or registration.

This interception is part of the Observer pattern where the interceptor observes HTTP requests and modifies them as needed before passing them along the handler chain.

Testing

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

Storing Secrets in .properties File

Key Features

Real-Time Kafka Messaging

Krafana's real-time messaging service sends messages to specific topics, where creating a new chat room means creating a new topic. An embedded Kafka implementation is used to avoid the need for running a Kafka server locally.

JWT Auth

Multilingual Aspect

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.

Files

README.md

Latest commit

History