Meilleurs sites pour écrire et tester du code avec aperçu en temps réel

Aussi bien pour les débutants qui veulent apprendre, que pour les professionnels confirmés, il existe des sites internet qui permettent d'essayer des lignes de code et de voir, en avant-première et presque en temps réel, le résultat. Ce sont de vraies applications avec l'écran divisé en deux, où d'une part vous écrivez le code qui peut être HTML, CSS, PHP, Javascript ou autre, tandis que d'autre part, après avoir appuyé sur une touche pour exécuter, vous voyez réellement ce que il semble que ce code se trouve à l'intérieur d'un site Web.
Ce ne sont pas seulement des éditeurs de code, mais des endroits où vous pouvez tester votre programmation sans vous soucier de faire des erreurs et découvrir rapidement où se trouvent les erreurs. Codepen et JSFiddle sont les deux sites les plus populaires de cette catégorie, mais il existe également de nombreuses alternatives.

Sites pour tester du code en ligne

1) CodePen

CodePen c'est le site le plus populaire utilisé par les programmeurs car il est gratuit, intuitif et facile à utiliser. Devenu un standard dans le monde des programmeurs, il suffit de faire une recherche Google pour trouver les pages déjà compilées par Codepen et voir immédiatement si c'est ce que vous recherchiez. Les fenêtres de visualisation flexibles et l'exécution immédiate du code écrit le rendent suffisamment parfait pour essayer des animations javascript et CSS, et il peut facilement se connecter à des scripts externes (React, Vue et tout autre élément disponible via CDN).
CodePen mérite la première place dans cette catégorie, mais certaines fonctionnalités sont payantes, telles que le codage collaboratif et les vues en direct pleine page (les vues en direct partielles sont gratuites).

2) JSFmilieu
En second lieu (même si chronologiquement c'est l'un des plus anciens) dans le monde des sites d'écriture et de test de code de programmation il y a JSFmilieu, principalement orienté vers la création et le test de JavaScript. Il peut également être utilisé pour le code HTML et CSS et comme il prend en charge les conseils de complétion de code, il peut même être préférable à CodePen pour les moins expérimentés.
Un grand point en faveur de JSFiddle est qu'il offre le mode de collaboration (y compris le chat vocal et textuel) gratuitement, vous pouvez donc travailler sur le code en même temps que d'autres personnes.

3) Anomalie
De nombreux sites de code vous permettent de coder HTML/CSS/JS et de générer des pages web statiques tout en Anomalie offre un petit espace de stockage gratuit pour enregistrer des projets et facilite l'exécution du code côté serveur de Node.js. Il peut être programmé sur Glitch de manière collaborative,
Il est également livré avec une foule d'autres fonctionnalités intéressantes : codage collaboratif, contrôle de version, de nombreuses ressources d'apprentissage, une bonne intégration avec GitHub, des intégrations faciles, une communauté pour demander des conseils, des projets prédéfinis que vous pouvez éditer ou utiliser librement et le Intégration de Visual Studio. C'est un excellent moyen, rapide et facile de lancer une application Web (ou d'apprendre à le faire).

4) CodeSandbox
CodeSandbox il est similaire à Glitch mais un peu plus complexe et complet. CodeSandbox a une interface plus flexible et personnalisable, vous permet de distribuer des applications Web complètes, dispose d'un espace pour enregistrer des fichiers et effectue la plupart du travail de base en laissant le programmeur seul à écrire.

5) Rép.com
Rép.com est un environnement de développement pour essayer différents types de langages de programmation tels que Python avec prise en charge du code front-end et back-end, vous permet de déployer des sites et des applications, a une intégration avec GitHub et une interface intuitive. Cela peut être un peu trop difficile pour quelqu'un qui essaie simplement de concevoir des pages Web, mais pour les programmeurs expérimentés, c'est une ressource à considérer. si vous ne faites que concevoir des front-ends ou si vous débutez dans le code, mais si vous planifiez tout régulièrement, cela vaut la peine d'explorer.

6) tisser vif est un éditeur Web très similaire à JSFiddle, avec lequel écrire et tester du code à utiliser sur des sites Web, avec des fonctionnalités de prévisualisation en direct, des conseils de code pour HTML5, CSS3, JavaScript et jQuery et qui vous permet de télécharger le projet sous forme de fichier zip. Vous pouvez également ajouter des bibliothèques externes assez facilement comme jQuery, AndgularJS, Bootstrap.

7) CodeSandbox est un espace en ligne gratuit où vous pouvez démarrer des projets d'applications Web en utilisant différents frameworks, tels que React, Vue, Angular et bien plus encore.

8) StackBlitz est un excellent éditeur d'applications javascript, qui prend en charge divers frameworks tels que Vue et React.

9) Flems, site minimaliste, parfait pour faire des tests rapides.

10) JSBin, une version plus minimaliste de JSFiddle, pour coder des pages Web et voir à quoi cela ressemble.

11) CSSDeck est un site simple pour tester quelques idées de base HTML / CSS et JS.

12) ICECoder, un autre environnement en ligne pour tester le code, qui vous oblige à télécharger un programme qui s'exécute dans votre navigateur et peut également être utilisé hors ligne.

13) Plunker, un outil frontal qui vous permet d'écrire du code, des fichiers et des pages Web et de les enregistrer sur Github.

14) Scrimba est une combinaison innovante d'éditeur vidéo et de code qui constitue un environnement d'apprentissage parfait pour les étudiants et ceux qui souhaitent apprendre.

15) WebMaker, un créateur d'applications Web avec des fonctionnalités hors ligne et une intégration avec CodePen.

16) Dabblet, pour essayer d'écrire du code HTML / CSS / JS avec de beaux graphismes et une correction automatique pour le code CSS.

17) Code de lecture c'est aussi un environnement pour tester du code HTML/CSS/JS de base en temps réel.

19) JSItor est une autre alternative à Codepen et JSFiddle, où vous pouvez écrire du code combinant HTML, CSS et Javascript et voir le résultat immédiatement.



Meilleurs sites pour écrire et tester du code avec aperçu en temps réel