\n Tout est n\u00e9 du code pour un d\u00e9veloppeur, il est donc naturel de commencer avec le meilleur outil d’\u00e9dition que vous puissiez trouver. Komodo Edit est assez casher pour tout cela et plus encore. C’est un bel \u00e9diteur de texte multiplateforme et multilingue dans lequel vous pouvez \u00e9crire et modifier votre code. Oh, et c’est gratuit.\n<\/p>\n
\n L’outil fonctionne sur Windows, Mac, Linux\/UNIX, donc pas de soucis. Nous l’aimons \u00e9galement pour sa fonctionnalit\u00e9 de saisie automatique du code pour des langages tels que HTML, CSS, JavaScript, Java, PHP, Ruby, Perl (pour les 5 personnes environ dans le monde), etc. C’est un \u00e9diteur de texte intelligent.\n<\/p>\n
\n Points bonus pour plus de commodit\u00e9 de la fonction Project Manager pour l’organisation et le suivi des fichiers.\n<\/p>\n
\n 2 Cr\u00e9ateur CSS 3.0
\n<\/h5>\n
\n \n Soyons honn\u00eates, malgr\u00e9 tout ce que vous aimez dans CSS3, vous ne pouvez pas vous emp\u00eacher de le d\u00e9tester un peu quand il s’agit d’\u00e9crire une syntaxe pour des choses comme les bords arrondis. C’est un d\u00e9tail si trivial de perdre votre sommeil, mais vous le faites quand m\u00eame. Vous ne pouvez pas m\u00e9moriser plus de 100 nouvelles propri\u00e9t\u00e9s et leurs pr\u00e9fixes respectifs. Alors, merci Seigneur pour un outil comme CSS 3.0 Maker.\n<\/p>\n \n Ce petit outil en ligne vous permettra de copier et coller du code complexe dans votre feuille de style. Il g\u00e9n\u00e8re du code pour les d\u00e9tails de style tels que les rayons de bo\u00eete, les d\u00e9grad\u00e9s, les ombres de texte et de bo\u00eete, les transformations, les transitions et les rotations de votre choix. Il montrera \u00e9galement quels navigateurs de bureau et mobiles prennent en charge ces propri\u00e9t\u00e9s de style. Une petite zone de pr\u00e9visualisation montrera l’effet, le code peut \u00eatre copi\u00e9 \u00e0 partir de la bo\u00eete de visualisation ou t\u00e9l\u00e9charg\u00e9 dans un fichier HTML.\n<\/p>\n \n Pour ceux d’entre nous qui ne peuvent pas consacrer trop de temps \u00e0 des d\u00e9tails de style apparemment banals, cet outil est une bou\u00e9e de sauvetage.\n<\/p>\n \n \n \u00ab Lib\u00e9rez-vous de l’enfer des pr\u00e9fixes CSS!\u00bb \u2013 Page d’introduction sans pr\u00e9fixe.\n<\/p>\n \n Il s’agit d’un outil pratique, apport\u00e9 pour nous d\u00e9livrer de \u00ab\u00a0l’enfer des pr\u00e9fixes\u00a0\u00bb par un ange nomm\u00e9 Lea Verou de Github. Il ajoutera un pr\u00e9fixe de fournisseur (quelque part que vous ne pouvez pas voir) aux feuilles de style dans\n<\/p>\nou aux \u00e9l\u00e9ments. De plus : vous n’aurez pas \u00e0 vous soucier des nouveaux \u00e9l\u00e9ments\nou, des pr\u00e9fixes de jQuery ou des modifications que vous apportez, car cela couvrira tout.<\/p>\n \n Qu’est-ce qu’il ne faut pas aimer ?\n<\/p>\n \n \n \u00ab\u00a0Lorem Ipsum\u00a0\u00bb a \u00e9t\u00e9 le texte d’espace r\u00e9serv\u00e9 incontournable pendant trop longtemps. Heureusement, nous avons maintenant Blokk: la police pour mettre un terme \u00e0 la \u00abdouleur\u00bb du latin incompr\u00e9hensible.\n<\/p>\n \n Blokk vous donne un bloc de \u00ab texte \u00bb \u00e0 utiliser comme espace r\u00e9serv\u00e9 lors de la cr\u00e9ation de maquettes et de structures filaires. Il va \u00e9galement sans dire que cela ne confondra pas les clients les moins avertis du Web lors des pr\u00e9sentations.\n<\/p>\n \n \n Avant que les polices d’ic\u00f4nes ne deviennent une chose, les d\u00e9veloppeurs devaient faire appel \u00e0 des concepteurs pour cr\u00e9er des ic\u00f4nes \u00e9volutives. Le temps qu’il a fallu pour les d\u00e9velopper (ce qui, soit dit en passant, comprend la cr\u00e9ation, l’extraction, la mise en \u0153uvre et la personnalisation) \u00e9tait presque \u00ab\u00a0absolument ridicule\u00a0\u00bb. Mais ensuite, quelqu’un a transform\u00e9 les ic\u00f4nes en polices et tout le monde a v\u00e9cu heureux\u2026 dans un avenir pr\u00e9visible.\n<\/p>\n \n Fontello est un excellent g\u00e9n\u00e9rateur de polices d’ic\u00f4nes. Il vous permettra de faire votre choix parmi des milliers d’ic\u00f4nes, de personnaliser leur mappage ou de modifier leurs noms, et de les compiler dans un seul fichier de police. C’est incroyable et c’est gratuit.\n<\/p>\n \n Nous ne remercierons jamais assez Vitaly Puzrin.\n<\/p>\n \n \n Activez le JavaScript de votre navigateur et commencez \u00e0 tester \u00e0 quoi ressemblera la police que vous avez choisie sur un site r\u00e9el.\n<\/p>\n \n Typetester est simple. Il vous permet d’entrer et de comparer diff\u00e9rentes polices et de tester leur apparence. Vous pouvez \u00e9galement jouer avec la taille, le suivi, la couleur, etc. jusqu’\u00e0 ce que vous obteniez ce que vous voulez. Vous pouvez comparer jusqu’\u00e0 36 polices de caract\u00e8res diff\u00e9rentes \u00e0 la fois. Imaginez le temps que vous pouvez gagner avec \u00e7a.\n<\/p>\n \n C’est vraiment cool.\n<\/p>\n \n \n Le codage peut parfois \u00eatre un peu fatiguant, mais le nettoyage du code existe sur Level: Utter Tedium. C’est cependant n\u00e9cessaire si vous voulez \u00e9viter les erreurs et charger plus rapidement.\n<\/p>\n \n Dirty Markup permet de gagner du temps que vous pourriez autrement consacrer \u00e0 des activit\u00e9s plus int\u00e9ressantes (sandwich au bacon, n’importe qui ?). Celui-ci est livr\u00e9 avec des capacit\u00e9s combin\u00e9es d’autres outils de nettoyage \u00e0 syntaxe unique. Nous parlons de HTML Tidy, CSS Tidy, JS Beautify et Ace Editor. C’est un nettoyant complet.\n<\/p>\n \n Il s’agit d’une application Web pour nettoyer et formater votre code HTML, CSS et JavaScript. Nous ne pouvons pas demander plus.\n<\/p>\n \n \n Vous pourriez devenir un justicier tueur d’insectes avec cet outil puissant.\n<\/p>\n \n BugHerd suit l’adage s\u00e9culaire de \u00ab\u00a0Keep it Short and Simple, Stupid\u00a0\u00bb. Il peut capturer les commentaires des clients, r\u00e9soudre des probl\u00e8mes mineurs par lui-m\u00eame, suivre les bogues (pour que vous les exterminiez). Il jouera \u00e9galement au secr\u00e9taire et g\u00e9rera vos projets.\n<\/p>\n \n Une interface utilisateur pointer-cliquer ultra-simple sur votre site permet \u00e0 vos utilisateurs de signaler des probl\u00e8mes. BugHerd les transforme en rapports avec toutes les informations dont vous pourriez avoir besoin (comme la version du navigateur de l’utilisateur). Il est facile \u00e0 configurer, amusant \u00e0 utiliser et propose des fonctionnalit\u00e9s telles que des captures d’\u00e9cran automatiques (extension de navigateur), des liens directs, des pi\u00e8ces jointes, des donn\u00e9es de s\u00e9lection compl\u00e8tes et des discussions.\n<\/p>\n \n \u00c0 29 $\/mois d’abonnement standard, c’est un hic.\n<\/p>\n \n \n Le Responsive Web Design est plus qu’une nouvelle mode, en ce sens qu’il est l\u00e0 pour rester. Mais pour l’instant, vous trouverez au mieux les mises en page fluides d\u00e9licates. Vous vous retrouverez \u00e9galement dans une rage violente en essayant de tester votre mise en page sur diff\u00e9rentes tailles d’\u00e9cran.\n<\/p>\n \n Heureusement, Screenfly est une jolie petite application Web qui testera pour vous vos requ\u00eates @media. Vous branchez votre URL et elle montrera comment vos requ\u00eates g\u00e8rent les dimensions de l’appareil sur lesquelles vous cliquez dans le panneau sup\u00e9rieur.\n<\/p>\n \n Cela ne tient pas compte de la diff\u00e9rence de rendu entre les navigateurs, mais vous pouvez utiliser Browser Shots pour cela. Sinon, c’est un moyen simple et magnifiquement assembl\u00e9 de voir \u00e0 quoi ressemble votre site sur diff\u00e9rentes r\u00e9solutions.\n<\/p>\n \n \n Puisqu’on parle de RWD, autant commencer \u00e0 parler de frameworks pour le d\u00e9velopper.\n<\/p>\n \n Le d\u00e9bat sur Internet fait rage sur le framework frontal qui est le meilleur: Bootstrap ou Foundation? Vous pouvez utiliser l’un ou l’autre. Mais Foundation est l\u00e9g\u00e8rement plus au premier plan en ce qui concerne les syst\u00e8mes de grille, les unit\u00e9s proportionnelles pour la conception (bien que Bootstrap 4.0 Alpha soit pass\u00e9 aux unit\u00e9s em et rem), le support de droite \u00e0 gauche, les tableaux de prix, les visites et la navigation hors toile .\n<\/p>\n \n Il est \u00e9vident que nous pr\u00e9f\u00e9rons Foundation. Il fonctionne avec SASS et CSS, est plein de toute une gamme de fonctionnalit\u00e9s et g\u00e9n\u00e9ralement plus pratique et flexible.\n<\/p>\n \n Nous sommes d’accord avec Zurb sur ce point : c’est \u00ab\u00a0rapidement fou\u00a0\u00bb.\n<\/p>\n \n \n Apr\u00e8s une d\u00e9cennie de logiciels qui placent le design avant le code, Adobe donne enfin un avantage aux codeurs.\n<\/p>\n \n Cette gamme franchement incroyable d’outils et de services est con\u00e7ue en gardant \u00e0 l’esprit les nouvelles tendances de codage frontal. Ils nous ont tout un r\u00e9gal. Edge Animate pour aider les codeurs \u00e0 cr\u00e9er des animations tout en \u00e9liminant simultan\u00e9ment toute trace de Flash. D\u00e9sol\u00e9 Adobe, Flash \u00e9tait super. Mais Animate utilise HTML et JavaScript standard, et vous savez, une taille unique\u2026\n<\/p>\n \n Il existe Edge Code pour \u00e9diter le CSS \u00e0 partir d’un document HTML. Inspect consolide les tests de navigateur et les tests de compatibilit\u00e9 des appareils pour une conception r\u00e9active, et les synchronise tous pour une mise \u00e0 jour\/personnalisation ultra-rapide. L’immens\u00e9ment populaire Typekit fait d\u00e9sormais partie de la famille Edge. La refusion n’a pas encore \u00e9t\u00e9 publi\u00e9e, mais elle fera probablement exploser d’autres fabricants de grilles CSS front-end hors de l’eau. Et il y a encore plus.\n<\/p>\n \n Nous savons. Nous avons \u00e9galement d\u00fb retirer nos m\u00e2choires du sol.\n<\/p>\n \n \n Vagrant est bien plus qu’un logiciel de d\u00e9veloppement virtuel.\n<\/p>\n \n Cette beaut\u00e9 vous permet de cr\u00e9er des environnements de travail portables et facilement reproductibles. Il consolide le logiciel de virtualisation, le bo\u00eetier de base du serveur et les outils de configuration dans un package puissant. Fondamentalement, vous n’avez plus besoin d’avoir VirtualBox + Ubuntu + Chef. Vagrant fera le travail des trois et prendra moins de place en le faisant. Les utilisateurs exp\u00e9riment\u00e9s vous expliqueront \u00e9galement comment il vous permet de configurer facilement des r\u00e9seaux multi-VM.\n<\/p>\n \n Il est \u00e9crit en Ruby, mais fonctionnera pour PHP, Java, JavaScript, Python et C#. Vous pouvez travailler avec Vagrant sous Windows, Mac OSX, Linux et FreeBSD.\n<\/p>\n \n C’est super rapide parce qu’il n’a rien de l’U-friendly-I qui a l’air sympa mais prend de la place si n\u00e9cessaire. Il fonctionne bien comme environnement de test pour les d\u00e9veloppeurs.\n<\/p>\n \n C’est aussi proche du Saint Graal que possible.\n<\/p>\n \n \n PageSpeed \u200b\u200bInsights de Google fait exactement ce qu’il dit sur la bo\u00eete. Il vous donne un aper\u00e7u des performances frontales de votre Page. Cela va ouvrir les yeux de nombreux d\u00e9veloppeurs de haut niveau. Alors organisez un festival de rires et commencez la calvitie acc\u00e9l\u00e9r\u00e9e de tous les cheveux qui vont \u00eatre tir\u00e9s.\n<\/p>\n \n Tout ce qu’il fait est de mesurer le temps \u00e9coul\u00e9 entre : la requ\u00eate et le rendu du contenu au-dessus de la ligne de flottaison, et la requ\u00eate et le rendu de la page enti\u00e8re.\n<\/p>\n \n Il v\u00e9rifiera les aspects ind\u00e9pendants du r\u00e9seau pour calculer les performances de votre page : configuration du serveur, structure HTML, JavaScript, CSS et images.\n<\/p>\n \n C’est d’une nettet\u00e9 remarquable et d’une rapidit\u00e9 impitoyable; donc cela va certainement blesser vos sentiments et tr\u00e8s probablement vous faire pleurer si vous avez un score bas. Il tentera \u00e9galement de se rattraper en vous donnant des suggestions pointues pour am\u00e9liorer vos performances, tel un parent condescendant.\n<\/p>\n \n Et nous l’aimons.\n<\/p>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844581a0a86.webp\")
<\/a>\n<\/p>\n\n 3 \u2013 sans pr\u00e9fixe
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844583d44dd.webp\")
<\/a>\n<\/p>\n\n 4 livres de bloc
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-638445861b498.webp\")
<\/a>\n<\/p>\n\n 5 Fontello
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-638445880da58.webp\")
<\/a>\n<\/p>\n\n 6 Essais de type
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384458ad95f3.webp\")
<\/a>\n<\/p>\n\n 7 Balisage sale
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384458e305ed.webp\")
<\/a>\n<\/p>\n\n 8 Troupeau d’insectes
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844590dfd3c.webp\")
<\/a>\n<\/p>\n\n 9 Mouche d’\u00e9cran
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844592db210.webp\")
<\/a>\n<\/p>\n\n 10 Fondation
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459574e29.webp\")
<\/a>\n<\/p>\n\n 11 Bord d’Adobe
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844597e33a5.webp\")
<\/a>\n<\/p>\n\n 12 Vagabond
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459a1429e.webp\")
<\/a>\n<\/p>\n\n 13 Aper\u00e7us de vitesse de page
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459ca2be9.webp\")
<\/a>\n<\/p>\n\n 14 Gites
\n<\/h5>\n
![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459f578c6.webp\")
<\/a>\n<\/p>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-638445a2c069a.webp\")
<\/a>\n<\/p>\n