Le développement d’un site ou d’une application web nécessite souvent une pile technologique front et back, parfois basée sur des technologies telles que React, Node.js et PostgreSQL.
Habituellement, vous accédez à votre travail via localhost:3000 (ou un autre port) pour effectuer ses tests. Cependant, il peut être nécessaire de tester votre site web sur différents appareils, comme des mobiles ou des tablettes, ou sur d'autres systèmes d’exploitation, où l'utilisation de localhost s'avère limitée.
Tester son site web sur d’autres appareils sans le déployer
Il est possible de simuler un déploiement sans avoir à configurer un serveur, grâce à des solutions de reverse proxy.
Ngrok, en particulier, offre une méthode simple pour exposer un serveur local à Internet en créant un tunnel sécurisé.
Cela permet d'accéder à votre application de l'extérieur, facilitant le partage avec des collègues ou des clients et permettant des tests sur différents navigateurs et appareils sans un déploiement formel.
Comment utiliser Ngrok pour tester votre application en ligne
L'utilisation est simple. Voici les cinq étapes :
- Téléchargez l'utilitaire : Visitez le site officiel et créez un compte gratuit. Téléchargez ensuite Ngrok pour votre système.
- Lancez votre serveur local : Pour un projet Node.js, cela se fait généralement avec
npm start
. - Exécutez l'utilitaire : Ouvrez un terminal dans le répertoire de Ngrok et lancez
./ngrok http 3000
, en remplaçant "3000" par le numéro de port de votre serveur local. - Accédez à votre site : Ngrok vous fourni une URL accessible de partout. Cette URL, générée aléatoirement à chaque session, permet l'accès à votre application depuis n'importe quel appareil.
- Surveillez le trafic : les requêtes entrantes sont enregistrées dans le terminal, permettant de suivre l'accès à votre application.
Aller plus loin ?
La version payante de Ngrok offre des fonctionnalités supplémentaires, comme un sous-domaine personnalisé. Il peut être utilisé pour des déploiements locaux, à condition que le serveur local reste accessible.
Dans mes formations professionnelles, je couvre en détail l'utilisation de Ngrok pour les tests, offrant une méthode efficace pour collaborer avec des collègues, des clients ou des bêta-testeurs, notamment pour valider un design responsive.