Skip to content

nosserb/GalacticBlast

Repository files navigation

Static Badge


GALACTIC BLAST est un générateur de haute qualité. Saisissez du texte, choisissez votre police, couleur et taille, et l'application génère automatiquement une image premium. L'image est téléchargée sur ImgBB et un lien public est généré. Trois formats d'export sont disponibles : URL brute, Markdown et HTML.


Architecture

/GalacticBlast
  │─ app/
  │  │─ page.tsx
  │  └─ api/upload/route.ts
  │─ public/fonts/
  │  │─ HIGHSPEED.TTF
  │  └─ Lady Radical.ttf
  │─ package.json
  │─ .env.local
  │─ README.md

Features

Génération d'images Canvas 1200×400px

Support de 2 polices premium (HIGHSPEED, Lady Radical)

Couleur personnalisable avec effet de lueur (glow)

Taille de police ajustable (30px - 200px)

Intégration automatique avec ImgBB API

Export en 3 formats (URL, Markdown, HTML)

Interface minimaliste avec thème orange/or premium


How it works

Étape 1 : Saisir le texte

Entrez votre texte dans la textarea

const texte = "GALACTIC BLAST";

Étape 2 : Personnaliser

Choisissez votre police, couleur hexadécimale et taille

const font = "HIGHSPEED";      // ou "Lady Radical"
const color = "#ff9500";       // couleur hex
const fontSize = 120;           // 30 - 200px

Étape 3 : Générer l'image

Cliquez sur le bouton "Générer" ou appuyez sur Ctrl+Entrée

const response = await fetch('/api/upload', {
  method: 'POST',
  body: JSON.stringify({ texte, font, color, fontSize })
});
const { success, imageUrl } = await response.json();

Étape 4 : Copier le lien

L'image est générée, uploadée et un lien public est retourné

// Format URL brute
const url = "https://ibb.co/xxxxx";

// Format Markdown
const markdown = "![texte](https://ibb.co/xxxxx)";

// Format HTML
const html = "<img src='https://ibb.co/xxxxx' alt='texte'>";

Résultat attendu

Une image haute qualité est générée, uploadée sur ImgBB, et un lien public est retourné.


Technical details

Architecture

Frontend (app/page.tsx)

État React pour gérer :

texte : contenu à générer

font : police sélectionnée (HIGHSPEED ou Lady Radical)

color : couleur hexadécimale

fontSize : taille en pixels (30-200)

generatedUrl : lien de l'image générée

isLoading : état de chargement

error : gestion des erreurs

Trois fonctions de copie :

copyToClipboard() : Copie l'URL brute

copyMarkdown() : Copie le format Markdown

copyHTML() : Copie le code HTML

Backend (app/api/upload/route.ts)

1. Génération d'image Canvas

generateImage(texte, fontType, color, fontSize)

Crée un canvas 1200×400px

Enregistre les polices TTF depuis /public/fonts/

Applique la couleur et l'effet de lueur (glow)

Convertit en PNG base64

2. Upload ImgBB

Envoie l'image à ImgBB et récupère l'URL publique

POST /upload HTTP/1.1
Content-Type: multipart/form-data

image: <base64_data>
key: <IMGBB_API_KEY>

3. Retour du résultat

{
  "success": true,
  "imageUrl": "https://ibb.co/xxxxx"
}

Configuration

1. Clé API ImgBB

Créez un fichier .env.local à la racine du projet :

IMGBB_API_KEY=votre_clé_api_ici

2. Polices personnalisées

Les polices TrueType sont stockées dans /public/fonts/ :

HIGHSPEED.TTF - Police moderne épurée

Lady Radical.ttf - Police stylisée

Pour ajouter une police :

1. Placez le fichier .ttf dans /public/fonts/

2. Importez-la dans le backend avec registerFont()

3. Ajoutez l'option dans le sélecteur frontend

Stack technique

Technologie Version Rôle
Next.js 15.5.6 Framework full-stack
React 19 Interface utilisateur
TypeScript - Typage statique
Canvas 3.2.0 Génération d'images
Tailwind CSS 4 Styling/Responsive
ImgBB API v1 Hébergement images

Thème de couleurs

Orange principal : #ff9500

Bleu fond : #0f172a

Marron dégradé : #78350f

Texte clair : #e0e0e0

Gestion des erreurs

Le programme retourne une erreur si :

La clé API ImgBB est invalide

Le texte est vide ou trop long

La police sélectionnée n'existe pas

L'upload vers ImgBB échoue

Le serveur ImgBB est indisponible


© 2025 GALACTIC BLAST

Created by nosserb

About

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages