Chooeicha est un site web qui présente un menu similaire à une plateforme de streaming telle que Netflix dont je me suis inspiré. L’objectif était de m’améliorer dans le domaine des interfaces utilisateur. Pour créer le site, il me fallait un thème alors j’ai choisi celui des mangas/animés japonais, un thème que j’apprécie beaucoup. D’ailleurs, le nom du projet est une référence à “Shueisha” qui est la plus grande maison d’édition de manga japonaise.

Pour la récupération des données à afficher, j’ai utilisé l’API Jikan qui est une API “non officielle” qui récupère les données de MyAnimeList qui possède plus grande communauté et base de données mangas. Cependant, MyAnimeList ne possède pas d’API publique alors Jikan était le choix parfait.

Au niveau des technologies utilisées, j’ai décidé d’utiliser React qui est le framework JavaScript le plus populaire et qui permet de créer des interfaces utilisateurs efficacement grâce à des composants réutilisables et TypeScript qui est un sur-ensemble du JavaScript avec des fonctionnalités en plus comme du typage par exemple. Enfin, pour le style des éléments, j’ai utilisé du SCSS, qui est une variation plus agréable du CSS classique.

J’ai voulu recréer les fonctionnalités de base de l’interface de Netflix comme le film ou la série à l’affiche, le carousel de films et séries que l’on peut faire défiler et les différentes catégories en lignes.

La structure de l’application se divise en plusieurs parties grâce à React et ses composants. Il y a l’anime à l’affiche, et les différentes lignes de catégories (Top mangas, Top animes et Trending animes) que l’on peut faire défiler soit à gauche, soit à droite. Grâce aux composants, on peut facilement changer les données affichées par les lignes comme la catégorie et les mangas affichés.