Crée un meme à partir d'une image aleatoires.
Client: React, TypeScript, TailwindCSS
View the site from the https://meme.altcore.fr/
Afficher des modèles de meme depuis l'API Imgflip : Utilisez une requête HTTP pour récupérer les modèles de meme depuis l'API Imgflip et affichez-les dans une grille ou une liste. Vous pouvez utiliser une bibliothèque de gestion d'état comme Redux pour stocker les modèles de meme.
Rechercher des modèles : Ajoutez un champ de recherche qui permet aux utilisateurs de rechercher des modèles de meme en fonction de leur nom ou de leur tag.
Ajouter du texte aux images : Utilisez une bibliothèque JavaScript comme Fabric.js pour permettre aux utilisateurs d'ajouter du texte à l'image de meme. Vous pouvez utiliser des contrôles de formulaire pour permettre aux utilisateurs de modifier les attributs de texte tels que la police, la taille et la couleur.
Déplacer le texte sur l'image : Utilisez les fonctionnalités de Fabric.js pour permettre aux utilisateurs de faire glisser le texte sur l'image.
Ajouter plusieurs textes : Permettez aux utilisateurs d'ajouter plusieurs textes en cliquant sur un bouton "Ajouter du texte" ou en utilisant un menu contextuel.
Télécharger le meme finalisé : Utilisez la bibliothèque FileSaver.js pour permettre aux utilisateurs de télécharger le meme finalisé en tant que fichier image.
Créer un meme en téléchargeant des images de bureau ou en insérant une URL d'image : Utilisez l'élément input de type "file" pour permettre aux utilisateurs de télécharger des images de bureau. Pour les images provenant d'URL, utilisez une bibliothèque JavaScript comme Axios pour récupérer l'image à partir de l'URL.
Step 1: Cloner ou installer le projet
Step 2: Ouvrir le dossier
cd my-app
Step 3: Installer les packages
npm install
Step 4: Lancer le projet
npm start
Step 5: Exporter le projet
npm run build
Imgflip API is used to fetch all the meme templates. It returns an array of 100 meme templates.
GET https://api.imgflip.com/get_memes