52 outils top pour les développeurs

liste des 50 meilleurs outils pour développer correctement

Voici plus de cinquante applications, extensions Chrome, applications Web et d’autres choses, espérons-le, vous seront utiles à un moment donné de votre vie de programmation. Au fur et à mesure que de nouveaux outils seront découverts, nous mettrons cette liste à jour.

1. Whatruns

Une extension de navigateur gratuite qui vous permet d’identifier les technologies utilisées sur un site Web en appuyant simplement sur un bouton.

Lien vers le site

Alt Text

2. Sizzy

Le navigateur pour les développeurs. Ne perdez plus de temps et accélérez votre workflow de développement

Lien vers le site

Alt Text

3. Log Rocket

Avec LogRocket, vous pouvez rejouer les activités des utilisateurs sur votre site Web et ainsi reproduire les erreurs et résoudre les problèmes plus rapidement.

Lien vers le site

Alt Text

4. Sentry

La plateforme de surveillance des applications de Sentinelle aide tout développeur. Diagnostiquer, corriger et optimiser les performances de votre code.

Lien vers le site

Alt Text

5. Can I Use?

“Can I use” Fournit des tableaux de prise en charge des navigateurs à jour pour prendre en charge les technologies Web frontales dans les navigateurs Web de bureau et mobiles.

Lien vers le site

Alt Text

6. Prettier

Un leader d’opinion, prend en charge de nombreuses langues, s’intègre à la plupart des éditeurs et offre peu d’options.

Lien vers le site

Alt Text

7. CSS Scan

Au revoir l’ “Inspect Element” — Vérifiez instantanément le CSS de tout élément sur lequel vous survolez et copiez toutes les règles en un seul clic.

Lien vers le site

Alt Text

8. Bundlephobia

Découvrez le coût de l’ajout d’un forfait npm à votre forfait

Lien vers le site

Alt Text

9. Cypress

Tests rapides, faciles et fiables pour tout ce qui est fait dans un navigateur.

Lien vers le site

Alt Text

10. Unminify

Outil gratuit pour minifier (décompresser, désobfusquer) le code JavaScript, CSS, HTML, XML et JSON pour le rendre lisible et joli.

Lien vers le site

Alt Text

11. RegEx 101

Débogueur d’expressions régulières basé sur PCRE gratuit avec explication en temps réel, détection d’erreur et mise en évidence.

Lien vers le site

Alt Text

12. Clear Cache

Videz votre cache et parcourez les données en un seul clic.

Lien vers le site

Alt Text

13. Window Resizer

Redimensionnez la fenêtre du navigateur pour émuler différentes résolutions d’écran.

Lien vers le site

Alt Text

14. Wappalyzer

Wappalyzer est un utilitaire qui révèle les technologies utilisées sur les sites Web. Il reconnaît les systèmes de gestion de contenu, les plates-formes de commerce électronique, les cadres Web, les logiciels de serveur, les outils d’analyse et bien plus encore

Lien vers le site

Alt Text

15. MDN

Le site Web du document Web MDN contient des informations sur les technologies Web ouvertes, notamment HTML, CSS et API pour les sites Web et les applications Web progressives.

Lien vers le site

Alt Text

16. Axe

La norme pour les tests d’accessibilité. Sélectionné par Microsoft, Google, des équipes de développement et de test du monde entier, Axe est la principale boîte à outils au monde pour l’accessibilité numérique.

Lien vers le site

Alt Text

17. Git Graph

Extension Git Graph pour Visual Studio Code. Affichez un diagramme Git de votre référentiel et effectuez facilement des actions Git à partir du diagramme. Configurable pour ressembler à vous!

Lien vers le site

Alt Text

18. Kontrast – WCAG Contrast Checker

Vérifiez le contraste en temps réel dans votre navigateur et adaptez-le aux exigences de WCAG 2.1.

Lien vers le site

Alt Text

19. Octotree

Extension de navigateur qui améliore la révision et l’exploration du code GitHub.

Lien vers le site

Alt Text

20. Postwoman

Alternative Web à Postman – Vous aide à créer des exigences plus rapidement et vous fait gagner un temps précieux dans le développement

Lien vers le site

Alt Text

21. Responsively App

Développez des applications Web réactives 5 fois plus rapidement! Un DevTool indispensable pour tous les développeurs frontaux qui facilite votre travail.

Lien vers le site

Alt Text

22. FullStory

Offrez des expériences exceptionnelles en laissant notre logiciel intelligent facile à utiliser déterminer exactement quand, où et comment la bataille des utilisateurs affecte vos ventes et la fidélité de vos clients

Lien vers le site

Alt Text

23. gitignore.io

Créez des fichiers Gitignore utiles pour votre projet

Lien vers le site

Alt Text

24. 1Loc

206 Utilitaires JavaScript préférés dans une seule ligne de code! Pas plus!

Lien vers le site


25. Does it mutate?

Lien vers le site

Alt Text

26. Keycode

Appuyez sur n’importe quelle touche pour obtenir le code de la touche d’événement JavaScript

Lien vers le site

Alt Text

27. Worth It: Modern JS edition

Cet outil analyse une page pour utiliser le modèle module / nomodule afin de déterminer combien moins de JavaScript est téléchargé dans les navigateurs modernes.

Lien vers le site

Alt Text

28. npmview

Une application web pour afficher les fichiers de package npm.

Lien vers le site

Alt Text

29. CSS to JS

Transformez-vous entre les objets CSS, JS et les accessoires JSX.

Lien vers le site

Alt Text

30. All Characters

Une simple page montrant tous les différents caractères et leur code HTML.

Lien vers le site

Alt Text

31. Shape Catcher

Il s’agit d’un outil que vous pouvez utiliser pour rechercher des caractères Unicode. Trouver un personnage spécifique dont vous ne connaissez pas le nom est un problème. Sur Shapecatcher.com, il vous suffit de connaître la forme du personnage!

Lien vers le site

Alt Text

32. Mocky

N’attendez pas que le backend se termine, générez des réponses API personnalisées à l’aide de Mocky et commencez à travailler sur votre application immédiatement

Lien vers le site

Alt Text

33. Explain Shell

Écrivez une ligne de commande pour afficher le texte d’aide qui correspond à chaque argument

Lien vers le site

Alt Text

34. Base64 Image

Convertissez vos images en Base64

Lien vers le site

Alt Text

35. Open Graph Check

Lors du partage de contenu sur Facebook et d’autres réseaux sociaux, l’attractivité des clics est très importante. Un aperçu optimisé adapté au groupe cible conduit à des améliorations significatives du taux de clics. Opengraphcheck.com vous aide à faire un meilleur travail. Et la meilleure chose est que l’Open Graph Check est gratuit!

Lien vers le site

Alt Text

36. Brotli pro

Brotli. Niveau suivant. Compression. Prêt?

Lien vers le site

Alt Text

37. Responsive Breakpoints

Générez simplement les dimensions optimales de l’image responsive

Lien vers le site

Alt Text

38. Is my host fast yet?

Latences de la réponse du serveur réel (temps jusqu’au premier octet), telles qu’elles se produisent par les utilisateurs réels lors de la navigation sur le Web.

Lien vers le site

Alt Text

39. Check My Links

“Vérifier mes liens” est un vérificateur de liens qui explore votre site Web et recherche les liens rompus.

Lien vers le site

Alt Text

40. JSON Web Token

Encoder ou décoder les JWT

Lien vers le site

Alt Text

41. Git Kraken

Client Git légendaire pour Windows, Mac et Linux. Gratuit pour l’open source

Lien vers le site

Alt Text

42. BEM Cheat Sheet

Quand il s’agit de trouver le bon nom de classe, cela peut rapidement vous conduire au désespoir. Même les développeurs CSS les plus expérimentés ne peuvent pas toujours trouver le bon nom de classe tout de suite. Cet outil est conçu pour vous aider à ne pas vous perdre dans le cosmos BEM en suggérant des noms pour certains des composants Web les plus courants.

Lien vers le site

Alt Text

43. Can I Email

Lien vers le site

Alt Text

44. CSS Grid Generator

Vous pouvez définir les nombres et les unités de vos colonnes et lignes, et je vais créer une grille CSS pour vous! Faites glisser dans les cases pour créer des div qui sont placés sur la grille.

Lien vers le site

Alt Text

45. Screen size map

Une comparaison des tailles d’écran en pixels indépendants de l’appareil

Lien vers le site

Alt Text

46. Who can use?

Qui peut utiliser cette combinaison de couleurs?

Lien vers le site

Alt Text

47. Will it CORS?

Dites à cette machine magique CORS ce que vous voulez et elle vous dira exactement quoi faire.

Lien vers le site

Alt Text

48. extractCSS

Extraire le CSS du HTML

Lien vers le site

Alt Text

49. Metatags

Les balises Meta vous permettent de modifier et d’expérimenter votre contenu, puis de prévisualiser l’apparence de votre site Web sur Google, Facebook, Twitter et plus encore!

Lien vers le site

Alt Text

50. Shieldfy

Identifiez et corrigez automatiquement les problèmes de sécurité et les vulnérabilités de votre code avant sa mise en production.

Lien vers le site

Alt Text

51. YAML Checker

YAML Checker est un moyen rapide et facile de valider YAML. Au fur et à mesure que vous tapez, votre YAML est validé avec une belle coloration syntaxique et des informations d’erreur.

Lien vers le site

Alt Text

52. Polypane

Tous les outils dont vous avez besoin pour créer des sites Web et des applications incroyablement réactifs, accessibles et rapides dans un seul navigateur autonome.

Lien vers le site

Alt Text

adapté et traduit librement.

Merci à https://dev.to/iainfreestone/50-developer-tools-to-make-your-life-a-little-easier-4oc5

en_USEnglish