Installer mon propre éditeur de code en ligne

A l’ère du “cloud-à-toutes-les-sauces”…

A l’ère des proxy (castrateurs) d’entreprises/école qui bloquent tout les protocoles FTP/SSH/SCP et ou ça devient impossible d’éditer tranquillement son code à distance etc…

 

J’ai trouvé LA perle rare : L’éditeur open source de code source en ligne Codiad.

 

Codiad est :

  1. Gratuit
  2. Instalable sur votre serveur
  3. Fluide
  4. Ultra simple d’installation
  5. Minimaliste (mais une belle gueule quand même)
  6. Full JSON/PHP
  7. D’une ergonomie redoutable.
  8. Fonctionne sans base de données

 

Le projet est encore assez jeune mais ne semble pas exposer de gros bugs (testé sous FF et chrome) à l’exception du redimensionnement de la sidebar qui danse parfois un peu la gigue (mais ça se remet correctement par la suite), un gros point faible dont il faut parler cependant : pas de glisser déposer dans l’arborescence.

 

image

 

Les panneaux :

  • Haut gauche : consulter l’arborescence de fichiers
  • Bas gauche : gérer les fichiers ouverts
  • Centre : éditeur
  • Droite (apparait au survol) : Menu & outils divers

 

Les raccourcis touches à connaitre :

  • ESC– Fermer les boites de dialogue
  • CTRL+S– Enregistrer le document courant
  • CTRL+O– Exécuter le document / Ouvrir le document dans le navigateur
  • CTRL+F– Chercher un mot dans le document
  • CTRL+R Chercher et remplacer un mot dans le document

 

Les liens utiles :

 

Installation :

  • Téléchargez le script ici, décompressez le et envoyez le sur votre serveur web
  • Renommez le fichier config.sample.php  en config.php (et editez le si ça vous chante avec vos infos, moi j’ai laissé par défaut)
  • Faites un chmod 777 sur les dossiers “/data”, “workspace” et sur le fichier config.php
  • Lancez le script sur votre navigateur et suivez les instructions (très rapide quasiment rien à  faire).

 

Les petits plus du programme :

  • Met à disposition des développeurs une console ainsi qu’une API pour créer facilement des extensions
  • Propose 24 thèmes différents pour la coloration syntaxique ainsi que la possibilité de personnaliser certains paramètres (taille de la police, line wrap etc…)
  • Gère l’indentation, la coloration syntaxique, la reconnaissance des extensions, le repérage des balises ouvrants/fermantes etc…
  • Propose un color picker intégré pour insérer un code couleur hexadécimal ou RGB direct dans le fichier courant
  • Possibilité d’uploader plusieurs fichiers à la fois en drag & drop
  • Possibilité de downloader les projets et fichiers en .zip
  • etc..etc…

 

De la baloche je vous dis, ça manque encore de deux trois trucs minuscules mais c’est tout à fait utilisable en l’état (d’ailleurs je m’y suis déjà mis).

 

NB : Pour les perfectionnistes, il y a aussi Cloud9 qui a l’air pas mal mais bien plus chiant à mettre en place.

 

Article rédigé par Idleman

45 réflexions au sujet de « Installer mon propre éditeur de code en ligne »

  1. OranginaRouge

    En effet ca a l’air pas mal. Mais quid de la sécurité ? Cela n’offre-t-il pas la possibilité qu’un tiers intervienne sur des scripts/page qui sont sur son propre serveur afin d’y mettre du code malveillant ?
    J’ai peut être pas très bien compris le fonctionnement mais je prendrais cet outil avec des pincettes..

    Répondre
    1. Idleman Auteur de l’article

      Selon les auteurs non, c’est bien sécurisé, après c’est évident qu’une personne ayant les codes d’accès du script pourrait modifier les element du workspace, mais ça reviendrait à dire « Si quelqu’un a les accès FTP, il peux tout modifier » :D

      Répondre
  2. bronco

    A l’ère des proxy (castrateurs) d’entreprises/école qui bloquent tout les protocoles FTP/SSH/SCP et ou ça devient impossible d’éditer tranquillement son code à distance etc…

    Amen ! L’agacement me gagne régulièrement au boulot à ce sujet… ^^

    J’installe et je teste dans la foulée…
    Merci ^^

    Répondre
    1. Idleman Auteur de l’article

      Après il y a toujours moyen de passer outre le proxy, mais celui sur lequel je suis en ce moment vas jusqu’à analyser les trames pour bloquer tout protocol quelque soit son port (donc la tunnelisation SSH ne fonctionne plus même sur le port 443) ça deviens de plus en plus vicieux ces saloperies.

      Vas falloir faire passer le HTTP dans le SSH encapsuler ce dernier dans du HTTP, merci l’admin réseau ^^

      Répondre
  3. Yosko

    zOMG, mais on est vraiment calés sur la même longueur d’onde.
    C’est justement l’un de mes sujets de recherche du moment, et je n’étais pas encore tombé sur Codia !

    Je vais tester ça immédiatement, du coup. Merci.

    Répondre
    1. Yosko

      Bon mes premiers tests laissent entendre que c’est encore un peu léger, et j’ai rencontré quelques petites difficultés dans l’affichage (qui reste perfectible, mais assez bon, dans le fond).
      Mais dans l’ensemble c’est plutôt sympa. J’adhère, et je pense l’utiliser pour tous mes projets web.

      Par contre, même si l’accès à Codiad est protégé par un mot de passe, ça m’embête toujours qu’il soit possible d’accéder via le net à mes identifiants de base de données. Mais bon, je ne pense pas qu’il soit possible de concilier les 2 : facilité d’accès pour un confort certain, et sécurité de l’autre

      Répondre
      1. Idleman Auteur de l’article

        Pas compris ton dernier paragraphe : quand tu passe par un ftp ou une console ssh, tu accède aussi a tes données de bases a parti d’un simple identifiant/mot de passe, avec codiad ou n’importe quel autre web IDE, tu passe juste par l’http au lieu du ftp,ssh et autres joyeuseries mais ça revient au même.

        Partant de ce principe il est impossible de verouiller totalement un accès à distance puisque justement il faut que tu puisse t’y connecter.

        Pour ce qui est de la simplicité de l’engin, ça me convient pour mes besoins mais si tu a besoin de plus je pense que tu devrais t’orienter vers cloud9 qui a l’air plus complexe (dans tous les sens du terme)

        Répondre
        1. Yosko

          Certes, aucun accès ne peut être 100% secure.

          Malgré tout, SSH et FTP sont suffisamment robustes pour que l’utilisateur ne soit pas trop inquiété quand il fait appel à eux. De plus, leur utilisation est généralement inévitable pour gérer un serveur.
          Tandis qu’un CMS, même un bon (et je ne cherche nullement à critiquer Codiad), peut plus facilement avoir des failles de sécurité, surtout s’il est jeune. Et ajouter un CMS du type de Codiad, c’est ajoutée un nouveau type d’accès à nos fichiers, qui peuvent parfois contenir des informations privée (telles que des identifiants d’accès à un SGBD).
          En résumé, ça peut représenter un risque supplémentaire, même s’il est minime.

          Répondre
          1. Idleman Auteur de l’article

            Qu’entends tu par plus robuste ?


            A ma connaissance voila la manière dont un client ftp se connecte :

            host + login + mdp + port 21 = connexion

            et voila la façon dont codiad (ou autre) se connecte :

            host + login + mdp + port 81 = connexion

            Comment dans ce contexte peut on penser qu’on est plus en sureté avec du FTP qu’avec du HTTP? En quoi un protocol (ou un port) serait plus sécurisé qu’un autre ? Qu’est ce qui m’empeche de faire du bruteforce sur ton FTP au même titre que je pourrais le faire en HTTP ? etc.. etc..

            Pour ce qui est de multiplier les possibilité de connexion (et don multiplier les risques) la je suis entierement d’accord : alors pourquoi ne pas supprimer l’accès FTP ? XD

          2. Yosko

            Je te parle de faille potentielles dans FTP d’un côté (ce qui me semble peu probable) et un CMS+HTTP de l’autre (qui me semble plus probable car on ajoute une couche, quelque chose qui n’est pas utilisé tous les jours par des millions de personnes, et qui donc potentiellement, est imparfait).

            Après, je me fais surtout l’avocat du diable, et cherche à rester prudent. Ça ne m’empêchera pas d’utiliser Codiad.

          3. Idleman Auteur de l’article

            C’est juste, sur ce point on ne peux que se fier au sérieux des développeurs.

            Maintenant si on pars de ce principe autant sectionner directement le câble ethernet de la box et s’envelopper dans du papier allu (ben oui, contre la wifi des conspiration gouvernementales et les ondes iota extra terrestres ;op)

          4. zouip

            Niveau problèmes de sécurité :
            – si le répertoire éditable (workspace) est accessible via le serveur web, configurer le serveur pour empêcher tout accès direct et empêcher l’exécution des scripts (notamment php).
            – mot de passe en clair sur le réseau ? restreindre l’accès à HTTPS dans la config du serveur web. Si ce n’est pas souhaité parce que votre entreprise bloque le HTTPS (notamment les certificats auto-signés, ou fonctionne par white-list), modifier les sources de codiad pour remplacer/ajouter un système OTP.

            Donc de mon point de vue, pas de problème de sécu particulier pour une appli web pareille, que je trouve particulièrement intéressante.

            On peut aussi, je pense faire en sorte que le workspace soit un dépôt Git ou autre, permettant un rollback en cas de problème.

          5. Idleman Auteur de l’article

            Dans l’ensemble je suis d’accord, le point 1 risque de poser problème cependant : Codiad n’a pas l’air de proposer d’exécution indirect des fichiers php, il est donc difficile de tester les fichiers autrement qu’avec un appel direct (ce qui serait rendu impossible par la mise en place d’un htaccess ou autres configs côté serveur) après ça n’est pas grand chose a faire en développement supplémentaire, il suffit de coder une extension pour le test avec une page d’inclusion du code, mais ça risque de poser des problèmes de chemins sur certains projets.

          6. zouip

            Même pas, plutôt que de tout désactiver, ne permettre l’accès au répertoire qu’après auth http. Je conseillais le blocage et/ou la désactivation dans le cas où l’on ne veut pas tester les scripts en direct.

          7. Idleman Auteur de l’article

            Oui, un auth me parait encore être la meilleure solution :)

    2. Idleman Auteur de l’article

      Je pense que le sujet peux interesser de nombreux dev frustrés ^^, à tester aussi Cloud9 (qui a l’air plus complet mais plsu compliqué a installer et plus usine a gaz, faut un serveur nodes.js etc..) et online-php-ide (qui a l’air moins « finit » plus viellot etc.. mais bon ne jugeons pas avant d’avoir testé)

      Répondre
    1. Idleman Auteur de l’article

      Merfi :) trouvé totalement par hasard en tombant sur leurs ancien projet (wiode) via un alternative-to sur koding ^^

      Répondre
  4. H3

    Wow ! Ca a l’air super simple ! Allez, je teste.

    Répondre
    1. H3

      Bon, je me réponds à moi même, bref…

      Ca marche au top ! J’ai pas eu bien le temps de tout tester encore, mais l’installation prends vraiment 5 minutes (à ce stade là, je sais même pas si on peur parler d’istallation…).

      Bref, merci pour cette découverte !

      Répondre
  5. Guillaume

    Vraiment intéressant comme projet. Merci pour la découverte.

    Répondre
    1. Idleman Auteur de l’article

      Pas mal :) je le trouve un peu moins poussé et finit que codiad au niveau de l’éditeur en revanche j’aime bien l’intégration de sqlbuddy pour donner la possibilité de gerer mysql :)

      Répondre
  6. davs63

    Je me pose la question : à quoi cela peut il bien servir ? vue l’engoulent de ce sujet je suis sure que ça doit être génial mais à quoi ?

    Répondre
    1. Idleman Auteur de l’article

      Accéder à son code a distance et uniquement via le protocol http (ce qui évite l’interruption des proxy), avoir un IDE disponible de partout, depuis n’importe quel os sans installation et avec un environnement prêt et a jour etc… les applications sont multiples :)

      Répondre
    1. Idleman Auteur de l’article

      Pas mal :), je pense qu’il y à encore un peu de finition manquante mais c’est prometteur :)

      Répondre
  7. Ping : Kaoland » Codiad – Installer mon propre éditeur de code en ligne

  8. Yannovitch

    Et que penses-tu du dernier IDE en ligne de la fondation Eclipse, Orion ?? Ca semble concurrencer bien Cloud9, c’est pluggable pour ajouter des nouvelles fonctionnalités, c’est installable en trois lignes, et vu le monde qu’il y a derrière (IBM & tutiquanti), on peut être sûr du suivi …

    Répondre
    1. Idleman Auteur de l’article

      Je ne connaissais pas avant que tu m’en parle (merci pour le tuyau). J’ai longtemps développé sous eclipse avant de passer a autre chose parce que ça devenait une usine à gaz, cela dis ça vaut le coup d’essai Orion.

      En revanche je note qu’ils ne semblent proposer qu’une version avec serveur embarqué, genre de trucs dont j’ai horreur, ils ne proposent pas quelque chose pour apache ou nodejs?

      Je test et je fais mon retour sur le blog si ça vaut le coup :), merci encore pour l’info ^^

      Répondre
  9. TonJuju

    Sinon tu as aussi iCLoud que tu peux plug facilement avec un compte heroku ou un cloudBees, ce qui te permet d’avoir des outils d’intégration continu et des BDD avec. Bref, tout un projet malheureusement, je ne le trouve pas assez complet :p

    Répondre
    1. Idleman Auteur de l’article

      J’ai eu beau chercher, je n’ai pas trouvé le logiciel sur le web, je tombe uniquement sur des merdes d’Apple (logique vu le nom), tu as un lien sous la main ?

      Répondre
    1. Idleman Auteur de l’article

      J’ai mis à jour l’article, merci pour le signalement :)

      Répondre
  10. Oriann

    Salut, super module :)

    Je travaille avec un serveur synology, et tout marche très bien (après avoir trouvé le bon chemin à configurer :D), mais j’écris à propos du module « Explore », qui n’a jamais rien trouvé de mon côté :/

    Donc pour ceux que ça peut aider, j’ai détecté (dans ma version de CODIAD 5230704) une micro erreur dans le fichier « class.filemanager.php » méthode « find » :
    switch($this->f_options[‘strategy’])
    au lieu de :
    switch($this->foptions[‘strategy’])

    et sinon, pour la commande « find », le -printf \ »%h/%f %y\n\ » n’existe pas sur le syno… J’ai donc juste mis un -print, et forcé un peu plus bas le type de fichier en « file » (vu que je cherche plus souvent des fichiers que des dossiers) :
    $f = array(‘path’ => $fname, ‘type’ => /*$ftype*/ ‘file’ );

    Mais sinon super boulot et super projet ! :D

    Voila, à un jour pour une bière :)

    Répondre
  11. Renondedju

    Super cool comme truc mais…

    J’ARRIVE PAS A L’INSTALLER YA UN TRUC KI MERDE A CHAQUE FOIS ! T_T

    En fait il me dit : »JavaScript: An Error OccouredNo Read/Write Permission »
    Et j’ai fait tout ce qu’il y avait a faire (Les chmod, Le changement de nom du config.php, ect…)
    Mais ya po moyen …

    Help me plz Xo

    Répondre
    1. Idleman Auteur de l’article

      C’est pourtant très ressemblant à un problème de droits, essaye de faire un
      sudo chown -R www-data:www-data /var/www

      Répondre
      1. Renondedju

        Super marci ça marche !
        oO

        Renondedju

        Répondre
  12. alex

    Bonjour,

    Tout d’abord un grand merci pour ce billet qui continue à servir même presque deux ans après sa rédaction.
    En lisant cet article, je suis tombé pile-poil sur ce que je cherchais : un geany/notepad++ en ligne !

    Je te propose de mettre à jour ton article en changeant simplement le lien « Téléchargez le script ici » par celui que tu donnes à la suite de « Download ». Normalement, tout le reste est bon =]

    Merci encore à toi.

    Cordialement,
    Alex.

    Répondre
    1. Idleman Auteur de l’article

      C’est fait, merci pour le signalement :)

      Répondre

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Xo ^_^ :siffle: :p :-( :evil: oO :) T_T <3 :D more »