+ Répondre à la discussion Actualité déjà publiée
Page 1 sur 2 12 DernièreDernière
  1. #1
    Membre chevronné
    Avatar de eric.pommereau
    Homme Profil pro
    Ingénieur, pôle cartographie
    Inscrit en
    décembre 2004
    Messages
    715
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : France, Essonne (Île de France)

    Informations professionnelles :
    Activité : Ingénieur, pôle cartographie
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : décembre 2004
    Messages : 715
    Points : 1 857
    Points
    1 857

    Par défaut Maîtriser Firebug, l'indispensable extension Firefox pour le développement web

    Bonjour,

    Je vous invite à découvrir le nouvel article : Maîtriser Firebug, l'indispensable extension Firefox pour le développement web.
    Vous y trouverez une présentation des principales fonctionnalités et des explications sur la manière d'utiliser Firebug. J'espère que vous y trouverez votre bonheur.

    N'hésitez surtout pas à remonter dans ce fil de discussion vos commentaires, impressions, remarques...

    @+

  2. #2
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    juin 2008
    Messages
    23 648
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : juin 2008
    Messages : 23 648
    Points : 91 537
    Points
    91 537
    Billets dans le blog
    20

    Par défaut

    Excellent article !
    Merci pour cette contribution qui servira sans doute de référence dans le domaine !
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  3. #3
    Membre émérite Avatar de franculo_caoulene
    Profil pro
    Inscrit en
    octobre 2003
    Messages
    2 880
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : octobre 2003
    Messages : 2 880
    Points : 2 953
    Points
    2 953

    Par défaut

    Très bon article, j'ai découvert le point d'arrêt conditionnel et redécouvert le profiler.

    Il manque juste quelques détails sur la partie réseau :
    gris foncé = chargement ne provenant pas du cache
    gris clair = chargement provenant du cache
    marron? = file d'attente des éléments à charger
    ligne bleue = symbolise l'évènement propre au moteur Gecko DOMContentLoaded qui est lancé lorsque le document a fini de se charger, sans prendre en compte le chargement des images
    ligne rouge = chargement de tous les élément du document
    Penser à la recherche et au bouton

  4. #4
    En attente de confirmation mail

    Homme Profil pro
    Inscrit en
    juillet 2006
    Messages
    766
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 41
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations forums :
    Inscription : juillet 2006
    Messages : 766
    Points : 1 172
    Points
    1 172

    Par défaut

    Bonjour,
    J'avais également fait une vidéo de démonstration, que l'on peut mettre en lien dans l'article :
    http://www.dailymotion.com/robusta-w...0_firebug_tech

    Cependant, de mémoire, je ne crois pas que je parlais du debugger javascript.

  5. #5
    Membre chevronné
    Avatar de eric.pommereau
    Homme Profil pro
    Ingénieur, pôle cartographie
    Inscrit en
    décembre 2004
    Messages
    715
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : France, Essonne (Île de France)

    Informations professionnelles :
    Activité : Ingénieur, pôle cartographie
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : décembre 2004
    Messages : 715
    Points : 1 857
    Points
    1 857

    Par défaut

    Citation Envoyé par franculo_caoulene Voir le message
    Très bon article, j'ai découvert le point d'arrêt conditionnel et redécouvert le profiler.

    Il manque juste quelques détails sur la partie réseau :
    gris foncé = chargement ne provenant pas du cache
    gris clair = chargement provenant du cache
    marron? = file d'attente des éléments à charger
    ligne bleue = symbolise l'évènement propre au moteur Gecko DOMContentLoaded qui est lancé lorsque le document a fini de se charger, sans prendre en compte le chargement des images
    ligne rouge = chargement de tous les élément du document
    Bonjour,

    Je tiens compte de ta remarque pour la prochaine modif.

    @+

  6. #6
    Membre émérite Avatar de franculo_caoulene
    Profil pro
    Inscrit en
    octobre 2003
    Messages
    2 880
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : octobre 2003
    Messages : 2 880
    Points : 2 953
    Points
    2 953

    Par défaut

    Petite précision encore, des temps sont affichés dans l'infobulle:
    gris = temps de chargement
    marron? = temps passé dans la file d'attente
    ligne bleue = délai entre le début du chargement ou de la mise en file d'attente de l'élément et le chargement de la structure du document.
    ligne rouge = idem mais par rapport au chargement complet du document (éléments compris).

    Les délais peuvent être négatifs ou positifs :
    + : le chargement de l'élément intervient avant celui du document.
    - : le chargement de l'élément intervient après celui du document.

    Le délai indiqué à coté de la ligne rouge sera donc toujours positif.
    Le temps total de chargement d'un élément = temps de mise en file d'attente + temps de chargement.
    Penser à la recherche et au bouton

  7. #7
    Membre chevronné
    Avatar de eric.pommereau
    Homme Profil pro
    Ingénieur, pôle cartographie
    Inscrit en
    décembre 2004
    Messages
    715
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : France, Essonne (Île de France)

    Informations professionnelles :
    Activité : Ingénieur, pôle cartographie
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : décembre 2004
    Messages : 715
    Points : 1 857
    Points
    1 857

    Par défaut

    Petite mise à jour comprenant quelques corrections orthographiques et un ajout (nature des évènements lors du téléchargement d'une ressource : http://eric-pommereau.developpez.com...irebug/#LV-A-2).

    Je souhaite aussi vous informer régulièrement des évolutions de firebug (à ce jour version 1.4.2) sur le blog (developpez.com) que je viens d'ouvrir, billet à venir prochainement sur le sujet.

    Comme je l'ai déjà dit, n'hésitez pas à me faire part de vos remarques sur ce fil de discussion.

    @+

    Eric

  8. #8
    Membre chevronné
    Avatar de eric.pommereau
    Homme Profil pro
    Ingénieur, pôle cartographie
    Inscrit en
    décembre 2004
    Messages
    715
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : France, Essonne (Île de France)

    Informations professionnelles :
    Activité : Ingénieur, pôle cartographie
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : décembre 2004
    Messages : 715
    Points : 1 857
    Points
    1 857

    Par défaut

    Ah oui et j'ai oublié de mettre le lien de nicorama, une vidéo sur l'utilisation de Firebug... c'est chose faite.

  9. #9
    En attente de confirmation mail

    Homme Profil pro
    Inscrit en
    juillet 2006
    Messages
    766
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 41
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations forums :
    Inscription : juillet 2006
    Messages : 766
    Points : 1 172
    Points
    1 172

    Par défaut

    Citation Envoyé par eric190 Voir le message
    Ah oui et j'ai oublié de mettre le lien de nicorama, une vidéo sur l'utilisation de Firebug... c'est chose faite.
    Thanx

  10. #10
    Membre chevronné
    Avatar de eric.pommereau
    Homme Profil pro
    Ingénieur, pôle cartographie
    Inscrit en
    décembre 2004
    Messages
    715
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : France, Essonne (Île de France)

    Informations professionnelles :
    Activité : Ingénieur, pôle cartographie
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : décembre 2004
    Messages : 715
    Points : 1 857
    Points
    1 857

    Par défaut

    Bonjour à tous,

    Suite à la sortie de la version 1.4.5 de Firebug (début novembre), voici une petite synthése des évolutions ... http://blog.developpez.com/eric-pommereau/p8391/web/firebug/firebug-sortie-de-la-version/

    @+

  11. #11
    Membre du Club
    Profil pro
    Inscrit en
    décembre 2003
    Messages
    140
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : décembre 2003
    Messages : 140
    Points : 41
    Points
    41

    Par défaut

    Bonjour
    je viens de découvrir firebug trés pratique mais je rencontre un problème dans l'identification du code est ce normal ?
    J'ai inspecté un élément et je l'ai édité .Ma modification fonctionne bien dans le navigateur
    Sauf que j'ai aucune information pour savoir quel fichier je dois modifier sur la serveur



    j'ai ajouté un padding-left , mais firebug ne me dis pas ou la modification doit être fait sur le serveur
    Merci pour l'aide

  12. #12
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    juin 2008
    Messages
    23 648
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : juin 2008
    Messages : 23 648
    Points : 91 537
    Points
    91 537
    Billets dans le blog
    20

    Par défaut

    Et par quel moyen penses-tu que Firebug peut déterminer de quel fichier du serveur provient la portion de code en question ???
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  13. #13
    Membre du Club
    Profil pro
    Inscrit en
    décembre 2003
    Messages
    140
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : décembre 2003
    Messages : 140
    Points : 41
    Points
    41

    Par défaut

    par exemple, pour les styles, il affiche bien dans quel fichier css ils se trouvent .A partir de cela je modifie le css adéquate sur le serveur

  14. #14
    Membre chevronné
    Avatar de eric.pommereau
    Homme Profil pro
    Ingénieur, pôle cartographie
    Inscrit en
    décembre 2004
    Messages
    715
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : France, Essonne (Île de France)

    Informations professionnelles :
    Activité : Ingénieur, pôle cartographie
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : décembre 2004
    Messages : 715
    Points : 1 857
    Points
    1 857

    Par défaut

    Tout dépend de la manière dont tes fichiers sont organisés côté serveur... avec Firebug on se trouve du côté du navigateur, côté client.

    Il faut juste identifier la partie qui écrit le code CSS (dans le cas d'une page html qui embarque des CSS ce qui est le cas dans ton exemple).

    @+

  15. #15
    Membre du Club
    Profil pro
    Inscrit en
    décembre 2003
    Messages
    140
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : décembre 2003
    Messages : 140
    Points : 41
    Points
    41

    Par défaut

    effectivement le probléme est bien là firebug identifie la ligne à modifier
    mais me donne aucune infos


  16. #16
    Rédacteur/Modérateur
    Avatar de beekeep
    Homme Profil pro
    Développeur informatique
    Inscrit en
    octobre 2006
    Messages
    2 001
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 32
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : octobre 2006
    Messages : 2 001
    Points : 3 420
    Points
    3 420

    Par défaut

    à noter cette liste d'extensions pour Firebug :
    http://speckyboy.com/2010/03/03/exte...15-extensions/

    notamment pour JQuery ou Drupal.

  17. #17
    Expert éminent
    Avatar de 12monkeys
    Homme Profil pro
    Webmaster
    Inscrit en
    novembre 2006
    Messages
    4 093
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : France, Puy de Dôme (Auvergne)

    Informations professionnelles :
    Activité : Webmaster
    Secteur : Service public

    Informations forums :
    Inscription : novembre 2006
    Messages : 4 093
    Points : 9 046
    Points
    9 046

    Par défaut

    Bonsoir

    Tu parles ici du style 'element.style' ?

    Si oui 'element.style' représente le style en ligne, celui se trouvant dans la balise via l'attribut style. Donc logiquement c'est le style qui se trouve dans ton fichier HTML, et comme tu affiches ce fichier HTML tu dois alors savoir quel fichier modifier...
    Vous souhaitez participer à la rubrique (X)HTML/CSS, contactez moi.
    débutez avec les CSS
    Pas de MP pour des questions techniques ! Mode d'emploi du forum ; Règles ; Pensez à la balise code ; Pas de SMS !
    Votez pour les messages qui vous ont aidés...

  18. #18
    Membre du Club
    Profil pro
    Inscrit en
    décembre 2003
    Messages
    140
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : décembre 2003
    Messages : 140
    Points : 41
    Points
    41

    Par défaut Résolu

    Bonjour,
    et bien non, je connais pas le fichier exactement dans la mesure ou j'appelle une page index.php qui fait appel a d'autres codes.
    Après recherches, la pages index fait appel a un fichier .js pour faire fonctionner le diaporama et ce .js contient des éléments de style et c'est dans ce fichier que j'ai modifié le style et ca marche nikel
    Firebug dans l'onglet "script" m'indique bien tous les fichiers .js mais me dit pas lequel intervient dans ma page pour le diaporama
    Merci pour pour aide

  19. #19
    Nouveau Candidat au Club
    Profil pro
    Inscrit en
    novembre 2010
    Messages
    1
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : novembre 2010
    Messages : 1
    Points : 1
    Points
    1

    Par défaut

    Merci pour ce tutoriel très bien écrit.
    Il y a tellement de chose à dire sur Firebug.

    Tutoriel à la fois synthétique et riche, très bel exercice.

    Bravo.

  20. #20
    Membre chevronné
    Avatar de eric.pommereau
    Homme Profil pro
    Ingénieur, pôle cartographie
    Inscrit en
    décembre 2004
    Messages
    715
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : France, Essonne (Île de France)

    Informations professionnelles :
    Activité : Ingénieur, pôle cartographie
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : décembre 2004
    Messages : 715
    Points : 1 857
    Points
    1 857

    Par défaut

    Merci ! :-)

Discussions similaires

  1. Extension Firefox : variable des pages web
    Par Pikrass dans le forum JavaScript
    Réponses: 4
    Dernier message: 03/06/2009, 10h26
  2. Telecharger l'extension firefox pour l'intranet
    Par Larger dans le forum Autres langages pour le Web
    Réponses: 1
    Dernier message: 18/05/2009, 14h46
  3. Quelles technologies pour un développement Web et base de données ?
    Par rydjel dans le forum Général Conception Web
    Réponses: 7
    Dernier message: 14/09/2007, 17h22
  4. Distributions pour le développement web
    Par charlands dans le forum Distributions
    Réponses: 6
    Dernier message: 24/06/2007, 12h13
  5. les librairies de tags pour le développement web
    Par zizoux5 dans le forum Struts
    Réponses: 1
    Dernier message: 04/05/2007, 16h05

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo