PUBLIC MARKS from decembre with tags tool & dev

Un généréteur de couvertures de livres dans le style de O'Reilly (bien connus de tous les développeurs). (via http://www.ballajack.com/fabrique-couvertures-livres-oreilly)

Très utile aux développeurs et designers Web, LoremPixel vous permet de générer des images à la volée en spécifiant une taille. Pratique pour insérer des balises "img" facilement et rapidement ! Vous devez sûrement connaître Lorem Ipsum pour générer des faux textes. Et bien LoremPixel fait la même chose mais pour des images ! Il génère pour vous des images au format souhaité et ceci très simplement. Plusieurs thématiques sont disponibles : animaux, transport, technologie, sport, etc... De plus, l'image peut être générée en couleur ou en noir et blanc ; avec un texte ou non ! La particularité du système, c'est que vous n'avez pas à parcourir des pages et des pages de photos pour en trouver une correcte. Tout se fait avec une URL. Par exemple, pour générer une image aléatoire en 400x150, voici l'URL : http://lorempixel.com/400/150

If you just get started your a front-end developer career, it might be overwhelming to learn something every day. To optimize your time, it might be useful to know solid resources, to keep up with a demanding programmers’ environment. In this brief article, you will find 6 useful resources that in my opinion I think every beginning a front-end developer career should bookmark.

An alternative or Update ? Rated 5 out of 5 stars by decembre on Feb. 21, 2018 · permalink When i write an Userstyle it is (was) the primary tool i use with Firebug. Now i search an alternative for this great tool: The devtool don't give us the possibility to search or test a specific CSS selector like Firepath do. And in an other hand the DevTool is less useful than Firebug (it don't give an easy way to identify in which userstyle a CSS rule is - with an human reading way)

The official Firefox DevTools account. Follow us here to see the very latest experiments, milestones and help us build the best Firefox.

in this JSON tutorial and guide, I’m attempting to provide a fairly comprehensive discussion of JSON, its history, and its usefulness. I’ll close with a list of some practical JSON tools that might come in handy in future projects. JSON Defined JSON stands for JavaScript Object Notation and it’s a data format. That is, it’s a way to hold bits of information, similar to a database. Although JSON originated outside the ECMAScript specification, it is now closely related to JavaScript with the spec now including a JSON object and many developers incorporating it as a quasi-subset of the language.

Les outils: 66 ressources en ligne

Modernizr est voué à la détection des fonctionnalités navigateurs via JavaScript. Il permet de prévoir des alternatives (basées sur d'autres bibliothèques) pour les moteurs ne supportant pas l'une ou l'autre des propriétés CSS, HTML, etc.

Many of these links are bookmarks to articles that were list themselves, so they included many items. What’s special about this list on Joren Rapini’s blog, you ask? Well, I have graciously copied and pasted the Firefox tags that I use to identify each one of these pages in my bookmarks, so you can copy and paste them right into yours! This should save you a lot of time, and give you an enormous wealth of resources to boot.

you can use Firefox menu->Developer->BrowserToolbox to examine UI elements and play with CSS. After you open it, click OK in the main browser window, wait a few seconds for the toolbox to initiliaze, then use the first button in its toolbar to pick an element (bookmarks button in your case).

Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations.

Why use SVG at all?: Small file sizes that compress well__ Scales to any size without losing clarity (except very tiny)__ Looks great on retina displays__ Design control like interactivity and filters__

Here are some code samples to demonstrate using the Google Visualization API. Table Example Customized Table Example Gauge Example Interaction Example Full HTML Page Example Query Wrapper Example Table Query Wrapper Example Mouseover Tool Tip Example

WebPJS - Google's new image format WebP for not supported browsers (with alpha-channel)

Pinterest has a great tool for manually creating the widgets but it was a bit unclear on how to do it programatically, and how to do it for video.

To compress your code into a single-line as is required by bookmarklets, you could use this tool:

Utilité de -prefix-free ? -prefix-free est un petit fichier JavaScript qui ajoute à la volée le bon préfixe propriétaire selon le navigateur affichant la page. Plus besoin, donc, d'ajouter dans la feuille de style les différentes propriétés propriétaires ! -prefix-free adapte la propriété CSS3 au navigateur.

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

Lorsque vous développez un site Web ou une application Web, avoir les bons outils peut certainement vous aider à économiser beaucoup de temps. Dans cet article, j'ai compilé une liste d'outils utiles et super pour le codage CSS

Un favicon, c’est une photo iconisée avec une extension en .ico que vous trouvez la plupart du temps devant un url. Tous les blogs ne possèdent pas de favicon et c’est bien dommage car quand on a une bonne dizaine d’onglets ouverts, on aime bien se repérer grâce au favicon. xiconeditor.com neditor.com (De loin le plus complet ) cursorwiz.com Favigen.com Iconverticons.com Dagondesign.com Favicon-generator.de Degraeve.com/favicon Ngin.de/icon-editor

data: URI Generator The data: URI scheme allows you to build URLs that embed small data objects. data: URIs are supported by most modern browsers except for Internet Explorer. The lack of IE support is holding back widespread adoption of data: URIs, but they are still very useful in a couple of specific areas such as embedding graphics and other data items in Greasemonkey scripts. You can read more about data: URIs and see some examples of their use, or use the generator below to create your own. data: URIs are defined in RFC 2397.

JSMin is a filter which removes comments and unnecessary whitespace from JavaScript files. It typically reduces filesize by half, resulting in faster downloads. It also encourages a more expressive programming style because it eliminates the download cost of clean, literate self-documentation.You can automate this process with a minimizing application which you can find here and an on-line javascript version here ______ You should note that while comments are useful for maintaining the code, they are a liability itself in Javascript since they will be transmitted along with the code to each and every page load, which can create substantial bandwidth penalties and increase the load time of your page for users. This doesn't mean you shouldn't comment your code, just that once your code is "finished" you should make a backup copy with the comments, then strip out all the comments in the file which is actually sent to the user.

Créer des jolies icônes façon Adobe (Photoshop, Dreamweaver, Indesign..etc.) : petite application Air (donc fonctionnant sous Windows, Linux et Mac) baptisée Icon Generator Pro. Grâce à cette appli, vous pourrez générer des icônes façon CS5 : Sans oublier le mythique macaron « en promo », « beta » ou « 2.0″. L’application est même capable d’uploader directement cette icône sur votre compte twitter pour en faire votre image de profil (le truc trop inutile). Icon Generator Pro est téléchargeable ici gratuitement.

Avec notepad++ il est possible d'utiliser des expressions régulières

Note: Dans le cas ou vous avez installé les plugins, essayez CONTROL+R ou dans le Menu Plugins – TextFX Quick - Find/Replace pour faire apparaître une boite de dialogue avancée incluant une liste déroulante d'expressions régulières ainsi qu'un Recherche/Remplace multi-ligne.