Éditeur de code JSX en ligne gratuit.

Modifiez le code JSX avec la coloration syntaxique et la complétion automatique. Copiez après avoir terminé. Aucune installation nécessaire.

Fonctionnalités:
  1. 100% Gratuit
  2. Éditer le code hors ligne
  3. Surligneur de syntaxe
  4. Auto-complétion
  5. Auto-indentation
  6. Annuler/Rétablir
  7. Copier le code
  8. Redimensionnable à l'écran complet
  9. Axé sur la confidentialité. Aucun code téléchargé.
import React, { useState } from 'react'; function QnA() { const [question, setQuestion] = useState(''); const [answer, setAnswer] = useState(''); const handleQuestionChange = (event) => { setQuestion(event.target.value); }; const handleSubmit = (event) => { event.preventDefault(); if (question.toLowerCase() === 'what is this web app?') { setAnswer( <div> <p>Cette application web est un éditeur de code avec un surligneur de syntaxe, une autocomplétion et bien d'autres fonctionnalités!</p> <p>Il vous permet d'écrire et d'exécuter du code directement dans le navigateur, sans avoir besoin d'installer un logiciel.</p> <p>Le surligneur de syntaxe rend votre code magnifique, et la fonctionnalité d'autocomplétion vous aide à écrire du code plus rapidement et plus précisément.</p> <p>En plus, il propose de nombreuses autres fonctionnalités comme la possibilité d'annuler/rétablir, de copier ou d'exporter du code, de travailler hors ligne, etc.!</p> </div> ); } else { setAnswer(<p>Eh bien, qu'attendez-vous, commencez à éditer votre code dès maintenant.</p>); } }; return ( <div> <h1>Bienvenue dans le programme QnA !</h1> <form onSubmit={handleSubmit}> <label> Posez-moi une question : <input type="text" value={question} onChange={handleQuestionChange} /> </label> <button type="submit">Demander</button> </form> <div>{answer}</div> </div> ); } export default QnA;