LinkFlow

LinkFlow est une plateforme SaaS complète de gestion de liens conçue pour les professionnels et les créateurs de contenu. Elle permet de créer des liens raccourcis, des deeplinks intelligents, des pages de bio (Bio Pages) et des QR codes dynamiques, le tout accompagné d'analyses détaillées en temps réel.

Ce projet a été construit avec une stack moderne axée sur la performance et la scalabilité.

🚀 Fonctionnalités Clés

🔗 Gestion de Liens Avancée

• Raccourcisseur d'URL : Créez des liens courts avec des slugs générés automatiquement (via nanoid) ou personnalisés.
• Deeplinking : Redirection intelligente vers des applications natives (YouTube, Instagram, etc.) avec fallback web. Ciblez spécifiquement les utilisateurs iOS et Android.
• Gestion : Édition et suppression de liens, copie rapide dans le presse-papier.

📊 Analytiques en Temps Réel

• Tableau de bord : Vue d'ensemble des clics totaux et des liens actifs.
• Données détaillées :
  • Graphique de tendance des clics (30 derniers jours).
  • Top Pays (géolocalisation).
  • Top Appareils (Mobile vs Desktop).
  • Système de tracking performant stocké en base de données.

📱 Bio Pages (Link-in-Bio)

• Création illimitée : Créez des pages de profil uniques (ex: linkflow.io/bio/votre-nom).
• Éditeur Intégré : Ajoutez, modifiez et supprimez des liens facilement.
• Aperçu Live : Visualisez le rendu mobile en temps réel pendant l'édition.
• Vue Publique : Page optimisée pour le mobile, affichant avatar, bio et liens.

🔳 QR Codes Dynamiques

• Génération : Créez des QR codes pointant vers vos liens existants.
• Personnalisation : Choix de la couleur du QR code.
• Export : Téléchargement direct au format PNG.

🔐 Authentification & Sécurité

• Système complet d'inscription et de connexion par Email/Mot de passe.
• Gestion de session sécurisée avec Better Auth.
• Protection des routes API et du Dashboard via middleware.

---

🛠 Stack Technique

Ce projet utilise les dernières technologies du web moderne :

• Framework : Next.js 15 (App Router & Server Actions).
• Langage : TypeScript pour un code robuste.
• Base de données : PostgreSQL (hébergé sur Neon).
• ORM : Prisma pour la gestion des schémas et des requêtes.
• Authentification : Better Auth.
• Styling : Tailwind CSS et Shadcn/ui pour une interface élégante et accessible.
• Validation : Zod pour la validation des données (API & Formulaires).
• Graphiques : Recharts pour la visualisation des données.

---

📂 Structure du Projet

• /app : Structure des routes Next.js (App Router).
  • (auth) : Pages de connexion/inscription.
  • (dashboard) : L'application principale protégée (/app).
  • api : Endpoints backend (API REST).
  • bio/[handle] : Pages publiques des bios utilisateurs.
  • r/[slug] : Système de redirection des liens courts.
• /components : Composants UI réutilisables (Boutons, Dialogues, Cartes...).
• /lib : Utilitaires, configuration Prisma et Auth.
• /prisma : Schéma de la base de données.

---

⚡️ Installation et Démarrage

Suivez ces étapes pour lancer le projet localement :

1. Cloner le dépôt

git clone https://github.com/Lockxii/LinkFlow.git
cd LinkFlow

2. Installer les dépendances

npm install

3. Configuration de l'environnement

Créez un fichier .env à la racine et ajoutez les variables suivantes :

# URL de connexion à votre base PostgreSQL (ex: NeonDB, Supabase, Local)
DATABASE_URL="postgresql://user:password@host:5432/db?sslmode=require"

# Secret pour l'authentification (générez une chaîne aléatoire)
BETTER_AUTH_SECRET="votre_secret_tres_long_et_securise"

# URL de base de l'application
NEXT_PUBLIC_APP_URL="http://localhost:3000"

4. Initialiser la base de données

Poussez le schéma Prisma vers votre base de données :

npx prisma db push

5. Lancer le serveur de développement

npm run dev

Ouvrez http://localhost:3000 dans votre navigateur.

---

📜 Licence

Ce projet est sous licence MIT.