PUBLIC MARKS from decembre with tags dev & extension

jQuery.copyCSS: Quick, simple jQuery extension to retrieve or copy all styles (with optional whitelist and blacklist) from an HTML element.

You can inspect the Firefox user interface directly with DOM Inspector. (Which is not the same Inspector as in the Web Developer menu.) [addons.mozilla.org] https://addons.mozilla.org/en-US/firefox/addon/dom-inspector-6622/Click the icon in the upper-left corner of DOMi, the one with a pointer on it, then click anywhere in the browser to select an element; that element will be highlighted in the left column. Right-click the highlighted entry to display a context menu: "Copy Selector" suggests selectors for the element, "Set Pseudo-classes..." lets you switch on :hover. Notice that the browser itself is a document with its own URI, chrome://browser/content/browser.xul, Most of the browser chrome is XUL, but some, such as the Stylish editor, is HTML embedded in XUL. https://developer.mozilla.org/en-US/docs/XUL

Firebug est une extension firefox incontournable pour tous les intégrateurs et développeurs web. Elle permet entre autre de voir comment le navigateur interprète les différents languages et permet aussi d’interagir en temps réel avec le code source. Plutôt que des longues explication une petite vidéo vous aidera à mieux comprendre comment firebug peux changer votre façon de débugger vos pages web

Ce script montre comment mettre en place YUI Test (YUI 3) pour une utilisation avec des scripts Greasemonkey. Il vous permet de tester n'importe quelle page, même ceux que vous ne possédez pas. Il a été créé pour que vous puissiez écrire des tests unitaires pour les scripts Greasemonkey. La majeure partie de ce script vient: http://wiki.greasespot.net/Code_snippets # YUI_Li ... Je n'ai fait que l'adapter pour une utilisation avec YUI test, et fournir des instructions pour la mise en place de vos scripts afin qu'ils puissent être testés. Le script comme il est prévu ici peut être utilisé pour tester n'importe quelle page Web dans le monde. Pour l'utiliser pour tester un script Greasemonkey spécifique, juste un changement est nécessaire (ajouter un @ Exigent tag); voir les instructions d'essai ci-dessous.

I have a Greasemonkey script that works just fine in Firefox and Opera. I struggle with getting it to work in Chrome, however. The problem is injecting a function into the page that can be invoked by code from the page. Here's what I'm doing so far: First, I get a helper reference to the unsafeWindow for Firefox. This allows me to have the same code for FF and Opera (and Chrome, I thought).

Chrome has a secret weapon. His name is Aaron Boodman, and he created Greasemonkey. He now works on the Chrome Extensions team at Google. Even though Greasemonkey on Chrome isn't yet as mature as the Firefox version -- 15-25% of scripts might not work on Chrome yet -- it will definitely get there with Boodman's help. If you need some scripts to get you started, you can scope out Download Squad's 10 Greasemonkey Scripts You Shouldn't Browse Without, or peruse the large selection at userscripts.org.

Nouvelle interface de programmation afin de faciliter davantage le développement de nouvelles extensions. Baptisé Jetpack, permet à n'importe qui capable de coder une page web de moduler le navigateur. Oubliez les redémarrages du logiciel, il suffira de cliquer sur un simple lien pour installer l'addon de son choix et de recharger la page en cours de consultation. « Nous voulons permettre à plus de gens de participer à la création des fonctionnalités du navigateur », explique Aza Raskin, en charge du département de l'expérience utilisateur chez Mozilla. Il précise que n'importe quel développeur web familier avec le HTML, le CSS ou le JavaScript peut se lancer dans l'aventure.

This script pulls data from any HTML web page, capturing information such as title, location, and tries to transform any existing <meta> element into something that meaningful in RDF.

Turns your browser into a mashup platform, by allowing you to extract data from different web sites and mix them together. Also allows you to store this extracted information locally for you to search later and to exchange at need the collected information with others.

C'est réservé aux bidouilleurs mais en gros le principe c'est d'utiliser javascript sur les sites que vous visitez afin de réaliser des choses sympathique comme automatiser certaines parties d'un site ou changer le comportement d'un script...etc C'est un peu comme GreaseMonkey mais en plus simple (pour peu que vous connaissiez Javascript) Mais là ou ça devient interressante, c'est que coupler à Firebug, qui est une extension Firefox pour débugger le javascript des sites web (avec point d'arrêt and co), il devient relativement simple de faire faire au site ce que vous voulez.

Vous connaissez Flex ? RIA (Rich Internet Application) de son état, il permet de faire des miracles avec les interfaces utilisateur et est basé sur Flash. Il s'agit en fait d'un framework Open Source simplifiant grandement le développement d'applications web riches basées sur Flash. Mais comment effectuer des transferts de données avec eZ Publish ? Avec sa plateforme Flash, Adobe propose une interface de connexion très efficace et open source : AMF.

Traduction française de l'extension Web Developer de Chris Pederick (http://chrispederick.com/work/web-developer/). Cette magnifique extension propose plein d'outils facilitant le développement de site web.

Development resources From MozillaZine Knowledge Base Websites that are useful for Mozilla development. This knowledge base also has a few articles on extension development.

A Complete List Of Firefox Extensions For Web Developers January 7th, 2009 in Tools

Ce site est consacré à toutes les technologies disponibles sur la plate-forme Mozilla®, utilisée par le navigateur Mozilla Firefox™, le client mail Mozilla Thunderbird™ et les autres produits de la fondation Mozilla®. La plate-forme Mozilla® permet de développer des applications desktop ou web, fonctionnant nativement sur la plupart des systèmes d'exploitations. C'est aussi la première plate-forme vous permettant de réaliser des clients riches ou d'utiliser Firefox en tant que client riche. En effet, de l'interface graphique utilisateur reposant sur un format XML, XUL™, aux composants XPCOM réutilisables et multi plate-forme, Mozilla offre tout un ensemble de technologies, pour la plupart standardisées et relativement aisé à mettre en oeuvre : XBL, EcmaScript (Javascript 1.8), CSS, XHTML/HTML 5, SVG, XForms, MATHML, RDF, DOM, XML-RPC ... Vous pouvez commencer par une présentation de XUL.

XUL (XML User Interface Language) is Mozilla's XML-based language that lets you build feature-rich cross platform applications that can run connected or disconnected from the Internet. These applications are easily customized with alternative text, graphics and layout so they can be readily branded or localized for various markets. Web developers already familiar with Dynamic HTML (DHTML) will learn XUL quickly and can start building applications right away. Open XUL Periodic Table in Firefox or another Gecko-based browser to see some XUL demos.

The DOM Inspector (also known as DOMi) is a developer tool used to inspect, browse, and edit the Document Object Model of documents - usually web pages or XUL windows. The DOM hierarchy can be navigated using a two-paned window that allows for a variety of different views on the document and all nodes within.

The Order of Things to Learn Look to the "Resources" section for places to learn about these. 1. HTML. Hypertext Markup Language. Not the same "language" as JavaScript. This is a markup language, meaning it's a bunch of text that is meant to represent some type of structure, in this case, a web page. 2. XML. Extensible Markup Language. In case you didn't realize, HTML itself is a type of "XML". Learning XML is important because many popular websites (YouTube, Facebook, Last.fm) use XML to interact with data. Since you already know HTML by this point, understanding XML should be cake. 3. CSS. Cascading Style Sheets. This is the way HTML (should be) stylized. You'll want to learn this. 4. JavaScript. Learn all the basics: data types, functions, JavaScript's native functions like prompt, alert, etc. 5. The Greasemonkey Extras. Like I said, Greasmonkey == JavaScript, with a lot of extras. A specific page listing the API's can be found here.

vérifie la validité des liens d'une page web

View Dependencies adds a tab to the Page Info window, in which it lists all the files which were loaded to show the current page.

CodeBurner is a Firefox add-on that integrates with Firebug, to extend it with reference material for HTML and CSS.

Javascript syntax highlighting for Firebug 1.3+

Add, modify and filter http request headers. You can modify the user agent string, add headers to spoof a mobile request (e.g. x-up-calling-line-id) and much more. Take a look at the help tab of the Modify Headers window...