Web Developer Helper Suite

Measure, Annotate, Extract web data & Optimize local projects for AI/LLM context generation.

Votre assistant quotidien pour les développeurs web : simplifiez les tâches complexes en quelques clics. Web Developer Helper Suite est la boîte à outils tout-en-un conçue pour ceux qui travaillent avec l'IA (ChatGPT, Claude, Gemini). Analysez des pages web, créez des annotations professionnelles et optimisez vos projets pour les modèles LLM en un seul clic. ⚡ POURQUOI L'INSTALLER ? ✅ Optimisez vos projets pour l'IA en 1 clic Convertissez des projets React, Vue, Node, PHP dans un format parfait pour ChatGPT/Claude. Économisez jusqu'à 95 % de tokens grâce au Skeleton Mode et au Smart Delta Diff. ✅ Annotez les bugs d'interface sans Photoshop Dessinez des flèches, des lignes droites, des formes remplies et des notes directement sur le site web en direct. Captures d'écran prêtes pour les revues UI/UX instantanément. ✅ Confidentialité à 100 % : tout hors ligne Aucun envoi. Aucun cloud. Vos fichiers restent sur votre ordinateur. Aucune donnée partagée. Jamais. ✅ Outils de mesure avancés Règles intelligentes pour pixels, centimètres et pouces. Sélecteur de styles CSS. Génération automatique de rapports de mise en page. 🔥 FONCTIONNALITÉS CLÉS Vibe Project Manager (Application hors ligne) 3 modes d'optimisation : Aucun : Contenu complet (idéal pour les petits projets) Minification intelligente : Supprime les commentaires/espaces (projets moyens) Skeleton Mode : Uniquement les structures de classes/fonctions (projets énormes, plus de 10M de tokens) Fonctions principales : Smart Delta Diff : Compare l'ancien et le nouveau code et génère un Unified Diff au format Git. Ne fournissez à l'IA que les modifications, pas tout le projet. Prise en charge des ZIP et dossiers : Glissez-déposez React, Vue, Node, HTML, PHP... Export flexible : Copiez dans le presse-papiers ou téléchargez des rapports en TXT, Markdown (.MD) ou PDF. Compteur de tokens en direct : Estimation en temps réel du coût en tokens de l'IA avec indicateurs de couleur (Vert/Jaune/Rouge). Barre de progression visuelle : Suit l'ensemble du processus de génération en deux phases (lecture des fichiers 0→50 %, optimisation du worker 50→100 %) avec une animation shimmer pendant la phase de transfert des données. Bouton d'arrêt : Interrompez le processus à tout moment. Le worker est arrêté proprement puis réinitialisé pour l'exécution suivante. Outils sur la page (Visuels) Règle intelligente : Mesurez les distances (px / cm / pouces) Annotator v2 : Dessinez des flèches vectorielles, des lignes droites (maintenez Shift pour les verrouiller à l'horizontale/verticale), des cercles et rectangles (avec couleur de remplissage et opacité en option) et du texte. Dupliquez n'importe quel objet (Ctrl/Cmd+D ou le bouton de copie dans le panneau des calques) et organisez tout grâce à la gestion par calques. Web Extractor : Copiez le CSS, le texte épuré ou la structure HTML en un clic. Multilingue et thèmes Interface en anglais, italien, espagnol, français, allemand et portugais. Prise en charge des modes sombre/clair. 📌 CAS D'USAGE CONCRETS 🎯 Scénario 1 : Reprendre un projet dans un nouveau chat IA Importez le projet, appliquez le Skeleton Mode, copiez le contexte → ChatGPT/Claude comprend immédiatement l'architecture sans gaspiller de tokens. 🎯 Scénario 2 : Signaler un bug graphique Utilisez Annotator pour dessiner des flèches rouges sur le site → Capture prête pour l'équipe en quelques secondes. 🎯 Scénario 3 : Mettre à jour le code sans gaspillage Utilisez Smart Delta Diff : l'IA ne voit que les lignes modifiées (+/-), pas tout le projet. 🎯 Scénario 4 : Exportez votre contexte dans plusieurs formats Générez le contexte du projet et exportez-le en TXT pour la simplicité, en Markdown pour une documentation structurée, ou en PDF pour un partage professionnel — le tout en un clic. 🔒 CONFIDENTIALITÉ ET SÉCURITÉ ✅ 100 % hors ligne : Tous les fichiers (ZIP, code) sont traités dans le navigateur via des Web Workers. Aucune donnée ne quitte jamais votre ordinateur. ✅ Zéro publicité : Aucun suivi, aucune collecte de données utilisateur. ✅ Ouvert à l'examen : Code source vérifiable. ⚙️ NOTE TECHNIQUE (Mesures) Les outils de mesure (Règle, Sélecteur) fonctionnent en pixels CSS (standard 96 DPI). Les conversions en centimètres et en pouces sont des estimations. Pour une précision absolue sur différents écrans, utilisez la fonction de Calibration du Moniteur dans le menu de l'extension. ⚠️ Avertissement : Cet outil est destiné à l'assistance au développement web/UI. Ne l'utilisez pas pour l'ingénierie de précision ni les mesures physiques. 🚀 COMMENCEZ MAINTENANT Installez Web Developer Helper Suite et faites passer vos projets IA au niveau supérieur. Aucun abonnement. Aucun cloud. Uniquement des outils puissants. Hors ligne pour toujours.