Les 300 meilleurs outils pour le développement Web

De quels outils de développement web avez-vous besoin pour construire votre application ou votre site Web ? Voici une liste pratique de plus de 300 outils pour aider le développeur web et web mobile.

Précisons en préambule que nous distinguons le métier de développeur et celui d’intégrateur.

Le développeur front-end réalise des sites et applications dynamiques, les fonctions complexes et les interfaces utilisateurs alors que l’intégrateur garant de l’accessibilité web et du responsive web design convertit les maquettes réalisées par le designer UX-UI.

Le développeur back-end structure les données, veille à ce que la base de données soit conforme au schéma physique, conçoit et développe des composants d’accès, développe la partie de gestion du site, construit et articule les actions qui peuvent être effectuées.

1. L’environnement de développement

Logiciel d’environnement intégré IDE

1. Atom
2. Codespaces
3. Coffeecup
4. Eclipse
5. VIM / NeoVim / Openvim (tuto interactif)
6. VSCode ✨/ Visual Studio/ Theme Alternight
7. VSCode.dev (navigateur)

IDE spécifique

1. Arduino IDE
2. JavaScript : WebStorm
3. PHP : PHP Storm
4. Python : Idle, PyDev, PyCharm, Thonny (novice), Spyder
5. Java Kotlin Groovy : Intellij
6. Swift Objective C : AppCode (Mac)

Éditeur de texte et de code

1. SublimeText (achat de licence)
2. NotePad++
3. VimOnlineEditor
4. VSCode.dev

Environnement spécifique

1. Anaconda (Python)
2. Node.js ✨ (environnement d’exécution JavaScript asynchrone et orienté événement)

Gestion de versions

1. BitBucket
2. GIT client GIT, Git bash
3. GitHub ✨
4. GitLab
5. Meld (comparer des versions de fichiers)

Interface utilisateur graphique GUI

1. Github Desktop
2. Gitkraken
3. SmartGIT
4. Sourcetree
5. Sublime Merge
6. Liste complète

Serveur Web local

1. Apache HTTP Server
2. Apache Tomcat
3. Expose
4. GuniCorn (Python / Linux)
5. Laragon (LAMP) ✨
6. LAMP (Linux)
7. Mamp (Mac) / Xampp
8. Microsoft IIS
9. Ngrok ✨
10. Nginx ✨
11. Laravel Valet (DnsMasq + Nginx) (Mac)

2. Outils de développement d’applications front-end

AY11 Accessibilité

1. Axe
2. Formation (React)
3. NVDA (Windows)
4. Voice over (Mac OS)
5. Wave
6. Tota11y

API

1. Axios
2. Fast API
3. GraphQL
4. HTTP Cat
5. Hoppscotch
6. Insomnia
7. MockAPI
8. Postman ✨
9. Swagger (génération de profils)
10. ThunderClient

Builder JS

1. ESBuild
2. Jspm
3. Rollup.js
4. SnowPack
5. System.js
6. Vite.js
7. WebPack ✨

CSS

1. Almond CSS
2. Autoprefixer
3. CSS Fingerprint
4. Sass
5. PostCSS
6. PostCSR Tailwind

CMS JavaScript

1. Apostrophe CMS
2. Keystone.js
3. Ghost CMS
4. Prismic.io
5. Total.js

Conception – Design System

1. Balsamiq (Premium, zoning wireframes)
2. Bit / Bit.dev + Zeplin
3. Builder X
4. Codesee.io (Mapping des applications)
5. ColorHunt
6. Designresourc.es
7. Haikei
8. Hidden tools
9. Framer
10. Judo
11. Figma ✨
12. Invision DSM
13. Mockoon
14. Plasmic
15. Pollen Design System
16. Typescale
17. Invision DSM
18. Penpot.app
19. Plamic
20. Radix UI Colors
21. Quant UX
22. StoryBook
23. Wireflow
24. Zeroheight

Design Patterns (patrons de conception)

1. Patterns.dev

Développement de composants

1. Component.ai
2. React SVGR
3. Storybook
4. Simple Sharing buttons
5. Tailwind Components
6. The Component Library

Frameworks CSS

1. Bootstrap
2. Bulma
3. Foundation
4. Material UI
5. Materialize
6. Tailwind

Frameworks JS et librairies d’application Web

1. Angular (Google) ✨
2. Astro Build ✨
3. Gatsby ✨
4. React.js (Facebook) ✨
5. Next.js ✨ Framework React
6. Remix
7. Svelte.js / SvelteKit
8. Turbo SPA
9. Vue.js ✨

Outils Angular

1. Angular Cli
2. Augury (debug)
3. Angular Language Service
4. Angular Devtools
5. Angular ESLint
6. Angular Fullstack
7. Angular Material (bibliothèque de composants UI)
8. Angular Universal (déploiement)
9. Angular UI
10. CompoDoc
11. Componizer (VScode)
12. Karma (tests)
13. NgInspector
14. Ngx Bootstrap
15. Ngrv (visualisation graphique des modules, composants, providers, directives)
16. Ngrx (gestion des états)
17. Protractor (tests automatisés)
18. Rest Angular

Outils React

1. BuilderX.io
2. React Query
3. React Hook Form
4. React Dev Tools
5. React UI tools
6. Create React App Dev
7. React vers Gatsby
8. React vers Netifly
9. React avec WebPack

Librairies

1. Emotion.sh (CSS > JS)
2. Motion.dev
3. Zx (Scripts Bash)

GSS générateur de site statique

1. 11y Eleventy (JavaScript) ✨
2. Hugo (Go)
3. TeleportHQ (déploiement)

Gestionnaires de paquets

1. Flatpack
2. Homebrew (Mac) / Homebrew Formulae (Mac)
3. Npm et Npx / Npmjs.com
4. Yarn

Lanceurs de tâches

1. Gulp JS
2. Grunt JS

Linter selon le langage

1. ESLint
2. JsLint
3. TSLint
4. Stylelint

Outils de debug et approche clean code

1. JSHint
2. PHPStan
3. Sidekick (Navigateur + Devtools côté backend)
4. Node.js Debugger
5. Zoho Debug

Outils navigateur

1. Chrome DevTools
2. Firefox Developer Tools
3. Safari Developer Tools:

Outils de tests

1. Appium
2. Chromatic
3. Cypress
4. Jasmine JS (tests unitaires)
5. Jest (tests unitaires)
6. Linear
7. Responsively
8. Selenium (framework)
9. Sentry
10. Sizzy (payant)
11. Testing Library (APIs)
12. Qodana
13. YellowLab

Webperfs

1. Tools.pingdom.com

3. Outils de développement d’applications back-end

Authentification

1. Magic.link
2. Oauth0

Base de données

Conception de bases de données

Outils d’aide à la modélisation

MCD Création de modèles conceptuels de données

1. DBDesigner ✨
2. Lucidchart
3. SmartDraw
4. Mysql Workbench

MLD création de Modèles logiques de données

1. Erwin Data Modeler
2. IBM InfoSphere Data Architect
3. Oracle Data Modeler
4. Power Designer

UML

1. Staruml.io

SDBD et outils d’administration

1. PhpMyAdmin
2. Tableplus.com (payant)

SQL

1. DataGrip
2. DBeaver
3. DBVis
4. EverSQL
5. H2Database
6. HeidiSQL
7. MariaDB
8. PostgreSQL
9. SequelPro (Mac)
10. SQLite
11. SQL Server

NoSQL

1. MongoDB
2. MangoDB

NoCode

1. Airtable (No-code)
2. Glide
3. Nocodb (alternative open source à AirTable)
4. Smartsheet (No-code – Payant)

CMS Backend

1. Cosmic JS
2. Craft CMS
3. Strapi ✨ JS

Frameworks backend

1. Django
2. Hibernate/JPA (Java)
3. Laravel
4. Spring Boot (Java)
5. Symfony ✨

Interfaces d’administration

1. AppSmith
2. Tooljet

Meta Frameworks

1. ExpressJS

Node.js

1. Express.js (framework pour créer des applications web et des API)
2. Passport.js (bibliothèque d’authentification utilisateurs)
3. Mocha (tests)
4. PM2 (gestionnaire de processus en production)
5. Socket.io (création d’application en temps réel)

ODM (Mapping objets documents)

1. Mongoose

ORM (Mapping objets relationnels)

1. Doctrine (Symfony)
2. Eloquent (Laravel)
3. Knex.js
4. Prisma
5. Sequilize
6. TypeORM

4. Outils de développement devops

Conteunirisation

1. Docker ✨
2. Garden.io
3. Kubernate
4. LXD (Linux)
5. Vagrant
6. WayScript

Hébergement – cloud – CDN

1. AWS / AWS EC2 / AWS Lambda
2. AWS Cloudfront (CDN)
3. Azure
4. Cloudflare ( CDN)
5. Cloudinary (CDN médias)
6. Coder
7. EasyCron
8. Filezilla (SFTP)
9. Firebase hosting (Google)
10. Google Cloud
11. Heroku
12. NHost (alternative à Firebase open source)
13. Netifly ✨
14. Owncloud
15. NextCloud
16. Nhost
17. Putty (SSH)
18. Termius (SSH Mac OS)
19. Vercel

Virtualisation

1. Hyper V
2. Parallels
3. VirtualBox
4. Vmware

5. Outils de développement dataviz

1. ChartCSS
2. CubeJS
3. D3JS
4. Chartjs.org
5. LeafletJS
6. Raphael

6. Outils de documentation

1. Bookstack
2. Cht.sh
3. Devbook
4. Devhint
5. DokuWiki
6. Emacs
7. Gitbook ✨
8. Learnxinyminutes
9. Loom
10. MediaWiki
11. Mkdocs
12. Quod AI
13. Slite
14. Wiki.js
15. Zim Wiki

7. Outils de développement d’applications mobile

1. Adalo (payant – No-code)
2. Flutter.dev ✨
3. Glide
4. Ionic
5. React Native

8. Pratique

Calendrier

• Calendly
• Sunsama (partage de calendrier)

Collaboration

1. Carbon
2. CodePen
3. Confluence
4. CoScreen
5. GitHub Copilot
6. GitLive
7. JSFiddle
8. OneLang
9. Slack ✨
10. SourceTree
11. SublimeMerge

Emailing, sms, chat

1. Agora
2. Amazon SES
3. Mailgun
4. SendGrid

Freelancing

1. Codeur.com
2. Dolibarr ✨
3. Facture.net
4. FreelanceDay
5. Freelance Republik
6. Henrri
7. LeHibou
8. MyAE ✨
9. Pakko
10. Progonline
11. Shine.fr
12. Welcome To the Jungle

Géolocalisation, geofencing

1. Google Map API
2. Leaflet.js
3. Mapbox API
4. OSM
5. Plot

Gestion de mots de passe

1. Bitwarden
2. LastPass

Liste de tâches

1. Google Tasks (Gmail)
2. Microsoft Todo
3. Todoist

OS MacOS / OSX

1. Dev Utils
2. Flycut
3. HomeBrew
4. Rectangle (Mac)

Optimisation

1. Squoosh

Playgrounds

1. Riju.codes
2. Replit

Paiement e-commerce

1. BrainTree
2. MangoPay
3. Paypal API
4. Paddle
5. Stripe API

Plateformes de développement d’applications

1. AWS Amplify
2. AWS Data Firehose
3. Back4app.com
4. Bitrise
5. Firebase (Google)
6. Heroku (payant)
7. Plasmic.app

Prise de notes, schémas, screencast

1. Dendron
2. Diagrams.net (schémas UML + sauvegarde Cloud)
3. Evernote
4. Google Docs / Google Spreadsheet
5. Google Keep
6. Kazam ScreenCaster (Linux)
7. LanguageTool
8. Notable (prise de notes en Markdown)
9. Notion ✨
10. Notion AI
11. QOwnNotes (sur son propre Cloud)
12. Typora

Productivité

1. Espanso
2. Eesel
3. JavaScript Booster

RegEx

1. Regex101
2. Plus d’outils

Recherche, moteur de recherche RESTful

1. Elastic Search
2. Kibana (visualisation des datas)

Santé, bien-être

• Claviers
• F.lux protection des yeux
• Écran dalle OLED
• Siège

Revue de code

1. DeepSource
2. Pull Request : révisions de code à la demande de la part d’ingénieurs et de développeurs experts.

Statistiques

1. Counter.dev
2. Segment

Tableau blanc

1. Zapier
2. Excalidraw (Draw.io)
3. Figjam (Figma)

Workflow – Automation

1. IFTTT
2. Lucidchart
3. Make
4. Microsoft Power Automate
5. Notion API

9. Outils du développeur SEO

1. BeamUsUp
2. Google Lighthouse (Chrome)
3. LSI Graph
4. Monitor Backlinks
5. Rank Math SEO Analyzer
6. Ranxplorer
7. Robots.txt generator SEO Books
8. Semrush
9. Slerpee
10. WhatsMySerp
11. XML Sitemaps

10. Outils du développeur d’applications web low-code

1. Adalo
2. Appgyver
3. Bubble
4. Strikingly
5. Webbly

11. Trousse à outils

1. Baseline background remover
2. Bundle Phobia
3. Cacher : sauvegarde de snippets de code
4. Diff Checker (payant)
5. Dopfolio
6. Emmet Cheat Sheet
7. Extends Class : validateur de syntaxe
8. Fig.io
9. Fira Font
10. Frontend Toolkit
11. GitHub1s
12. Keycode.info
13. Is my host fastyet
14. JSON Formatter
15. JSON Generator
16. Npkill
17. Omatsuri.app
18. Retool
19. Ray.st (détecter les technos utilisées par un site)
20. Screensizemap
21. SideKick
22. SmallDev Tools
23. Sourcegraph
24. Wakatime
25. Will it cors

12. Outils et ressources de veille

1. Daily.dev
2. Devdocs (documentations des API logiciels)
3. Dev.to
4. Hacker.io
5. LesJeudi
6. Finddev.tools (répertoire d’outils)
7. Référentiel métier AFPA
8. Stackshare.io
9. Stackoverflow / Stackexchange
10. Wappalyzer
11. Welovedevs (Job Board)

13. Outils du développeur Web3

1. EtherJS (librairie client Ethereum)
2. Graph API (indexation, requêtes)
3. Hardhat (environnement de développement Ethereum)
4. Ifps (stockage)
5. Polygon (blockchain)

14. Outils du développeur WordPress

1. Local By Flywheel
2. Debug bar
3. Query Monitor
4. WordPress API Rest Controller
5. WP GraphQL
6. Gatsby
7. WP-Cli
8. WPPB
9. PHP Unit
10. Deploybot

15. Outils de gestion de projet

1. AirTable ✨
2. Appflowy.io
3. Asana
4. Basecamp ✨
5. Buddy ✨
6. Click-up
7. Freedcamp
8. Figma Product Planner
9. Gouti
10. Jira
11. Kitmaker
12. MeisterTask
13. Monday
14. MS Project
15. NTask
16. OfficeTimeLine (feuille de route)
17. Prioritize
18. ProjeqtOrt
19. Redmine
20. Tara.ai
21. Taskade
22. Trello
23. Wrike
24. ZenHub
25. Zenkit

16. Sécurité des applications web

1. Burp Suite Community Proxy
2. Graudit
3. JWT (Json Web Tokens)
4. Local PHP Security Checker
5. Logtail
6. PHP Code Sniffer
7. Retire.js
8. SonarLint
9. Zap Proxy Owasp

Liste compilée par Stéphane ARRAMI, membre de Jury Professionnel Titre Professionnel Développeur Web et Web Mobile DWWM

Lire aussi : 100 outils géniaux pour le design Web.