Plateforme hybride Web2/Web3 pour valider, émettre et vérifier des compétences sur la blockchain Polygon. MIABE Hackathon 2026 — Phase 3 (MVP)
🌐 Application Live | 📜 Smart Contract | | 📂 Architecture
SkillBadge résout la problématique de la vérification des compétences informelles au Burkina Faso. En combinant la rapidité de Firebase (Web2) et l'immutabilité de Polygon Amoy (Web3), la plateforme offre :
- 👩🎓 Aux autodidactes : des badges NFT vérifiables, partageables et infalsifiables.
- 👨🏫 Aux formateurs : un outil d'émission sécurisé avec contrôle d'accès on-chain.
- 💼 Aux recruteurs : un portail de vérification instantanée accessible via lien public, sans compte requis.
Architecture 100 % hybride : UX temps réel et indexation rapide via Firebase, preuve de certification ancrée sur la blockchain.
| Module | Fonctionnalité | Statut |
|---|---|---|
| Auth Multi-rôles | Inscription/Connexion — Apprenant, Formateur, Recruteur, Admin | ✅ Live |
| Mint On-Chain | Émission ERC-1155 sur Polygon Amoy + Métadonnées IPFS | ✅ Live |
| Vérification Publique | Lien de partage accessible sans compte (Mode Invité) | 95% |
| Workflow Demandes | Apprenant soumet → Formateur valide/émet ou refuse, en temps réel | ✅ Live |
| Sécurité Hybride | Whitelist on-chain (isFormateur) + Règles Firebase strictes |
✅ Live |
| Portail Recruteur | Recherche par wallet/nom/email + vérification balanceOf en direct |
✅ Live |
| Interface Admin | Approbation des formateurs + gestion des accès | 80% |
| Couche | Technologie | Rôle |
|---|---|---|
| Frontend | HTML / CSS / JS (ES Modules) + Tailwind CDN | Interface utilisateur, routing, manipulation DOM |
| Backend / DB | Firebase 10.8.0 (Auth + Realtime Database) | Gestion profils, demandes, indexation, temps réel |
| Blockchain | Polygon Amoy Testnet + Solidity (ERC-1155) | Certification immuable, mint, vérification publique |
| Web3 Lib | Ethers.js v6 | Interaction contrat, connexion MetaMask, lecture on-chain |
| Storage | IPFS via Pinata | Hébergement décentralisé des images & métadonnées JSON |
| Déploiement | Vercel | Hébergement HTTPS, CI/CD automatique, optimisation CDN |
skillbadge-phase3/
├── index.html # Page de connexion / inscription
├── formateur.html # Dashboard formateur (émission + demandes)
├── portfolio.html # Portfolio apprenant (badges + partage)
├── verify.html # Portail recruteur & vérification publique
├── js/
│ ├── firebase.js # Configuration Firebase (CDN)
│ ├── auth.js # Inscription, connexion, gestion profils
│ ├── badges.js # CRUD badges + logique hybride Web2/Web3
│ ├── web3.js # Connexion MetaMask + mint on-chain
│ ├── ipfs.js # Upload métadonnées / images vers Pinata
│ └── demandes.js # Gestion temps réel des demandes
└── vercel.json # Routing statique Vercel
- S'inscrit avec email + adresse wallet obligatoire
- Soumet une demande de validation à un formateur
- Reçoit le badge NFT dans son portfolio dès validation
- Génère un lien public (
verify.html?wallet=0x...) à partager avec les recruteurs
- S'inscrit → connecte MetaMask → approuvé par l'Admin
- Reçoit les demandes d'apprenants en temps réel
- Vérifie son éligibilité (wallet whitelisté on-chain via
isFormateur) - Émet le badge : Upload IPFS → Mint ERC-1155 → Enregistrement Firebase
- Reçoit un lien de vérification ou accède directement au portail
- Recherche un candidat par wallet, nom ou email
- Consulte le portfolio avec preuve on-chain (
balanceOf+ lien Polygonscan) - Exporte ou partage les informations sans créer de compte (Mode Invité)
- Approuve ou refuse les demandes de formateurs
- Gère la whitelist du contrat via
setFormateur(address, bool) - Supervise l'activité globale et les règles de sécurité
⚠️ Prérequis : Navigateur moderne (Chrome, Edge ou Firefox) + Extension MetaMask installée
# 1. Cloner le dépôt
git clone https://github.com/avatGit/SkilBadge.git
cd SkilBadge
# 2. Lancer un serveur local (obligatoire pour les ES Modules)
npx serve .
# ou utiliser l'extension "Live Server" dans VS Code
# 3. Ouvrir dans le navigateur
# http://localhost:3000| Fichier | Ce qui s'y configure |
|---|---|
js/firebase.js |
Clés publiques Firebase |
js/ipfs.js |
JWT Pinata (permissions pinJSON / pinFile) |
js/web3.js |
Adresse du contrat & ABI |
Aucune dépendance
npmrequise — tout passe par CDN.
🔒 Sécurité : L'accès est contrôlé par les Règles Firebase Realtime Database et la fonction
isFormateur()du contrat. Aucun secret critique n'est exposé côté client pour cette phase.
| Paramètre | Valeur |
|---|---|
| Adresse | 0xC72A58DeeAff2ABc6D3bD18e8184CCDd2014107a |
| Réseau | Polygon Amoy Testnet (Chain ID : 80002) |
| Standard | ERC-1155 (Multi-Token) |
| Fonctions clés | mint(address to, uint256 id, string uri) · isFormateur(address) · setFormateur(address, bool) |
| Explorateur | Voir sur Polygonscan Amoy ↗ |
Ce projet est open-source sous licence MIT. Utilisation autorisée pour démonstration, audit et extension communautaire.
💡 SkillBadge : transformer l'expérience informelle en preuve digitale vérifiable.