Réalisé en 2023

Métacafé

Site internet

Application de type réseau social développée avec VueJS à l’occasion d’un projet scolaire.

Sections

Description

Métacafé est un projet que j'ai réalisé dans le cadre de ma formation en mastère développement web à Efrei Paris, à l'occasion de plusieurs projets notés.

D'abord conçu comme une messagerie similaire à WhatsApp avec VueJS et ExpressJS, je l'ai repris quelques mois plus tard pour un TP de GraphDB. Les modifications à réaliser sur le serveur étant énormes, le projet a été forké et le serveur s'est vu être entièrement réécrit autour du framework GraphQL. L'application avait été gardée comme base, mais a été lourdement modifiée pour répondre à la nouvelle architecture. De plus, son design a également été revu afin de répondre à la nouvelle problématique du tp, qui était de réaliser une application similaire à Twitter (voir les deux dernières images).

Enfin, j'ai repris le projet une dernière fois pour un projet très similaire au premier, mais cette fois-ci en utilisant RabbitMQ pour la communication entre les différents utilisateurs. Le projet n'a donc pas été forké, ni réécrit. Au contraire, cela m'a permis de le terminer.

Métacafé, dans sa forme idéale, est une application de réseau social qui permet de rencontrer d'autres personnes ayant les mêmes centres d'intérêt que nous avons définis lors de notre inscription sur l'application. Toutefois, pour des raisons diverses telles que le manque de temps, de compétances lors de la réalisation du projet mais aussi de la complexité de la tâche, Métacafé n'a pas pu être terminé comme je l'aurais souhaité. Cependant, il reste un projet intéressant qui m'a permis de découvrir de nouvelles technologies et de nouvelles façons de penser le développement d'applications web.

Particularité intéressante

Le projet a entièrement été conçu avec des images au format Avif (AV1 Image File), un format relativement récent et peu supporté par les différents navigateurs web lors de la création du projet. Les images de profil envoyées par les utilisateurs sont également convertis dans ce format grâce à la libraire Sharp.

Le choix d'avoir utilisé ce format au profit de webp ou encore png, s'est conforté par sa grande efficacité en terme de compression. En effet, les images avif offrent une bien meilleure qualité pour une taille de fichier similaire. Il est donc possible d'économiser de la bande passante en réduisant la taille des images compressées, sans perdre en qualité par rapport aux autres formats plus anciens.

Liens

Je n'ai pas rétablis le site de démonstration en raison de la vétusté et de la mauvaise qualité du code du projet.

Fonctionnalités clés

Usage du format AVIF

Le projet a entièrement été conçu avec des images au format Avif (AV1 Image File), un format relativement récent et peu supporté par les différents navigateurs web lors de la création du projet. Les images de profil envoyées par les utilisateurs sont également convertis dans ce format grâce à la libraire Sharp. Le choix d'avoir utilisé ce format au profit de webp ou encore png, s'est conforté par sa grande efficacité en terme de compression. En effet, les images avif offrent une bien meilleure qualité pour une taille de fichier similaire. Il est donc possible d'économiser de la bande passante en réduisant la taille des images compressées, sans perdre en qualité par rapport aux autres formats plus anciens.

Statistiques

Dépôt GitHub metacafe

Ceci est un projet scolaire dont le but est de créer un projet NodeJS utilisant Express et Vue.

Voir sur GitHub
Étoiles
0
Forks
0
Observateurs
0
Issues
0
Langages
  • TypeScript 52.2%
  • Vue 31.6%
  • SCSS 15.7%
  • HTML 0.2%
  • Dockerfile 0.2%
MIT License master Créé le 21 nov. 2023 Mis à jour le 26 mars 2026

Technologies utilisées

Vidéos

Démo Métacafé 20 décembre 2023

Captures d’écran

6 captures

Angular.js 2024

ToDoum

Voir le projet
Sass Bootstrap Figma GitLab CI/CD Logomark 2024

Vitrine SL-Projects

Voir le projet