Comment ajouter du code en surbrillance dans les articles de taille moyenne sans quitter l'éditeur

Une extension de navigateur pour Chrome et Firefox. Vous permet de créer et d'éditer des listes de contrôle GitHub directement à partir de Medium

La manière actuelle

Le support peut afficher des blocs de code en ligne et multilignes. Aucun d’entre eux ne prend en charge la coloration syntaxique:


  
     Hello World 
  

Une solution de contournement consiste à intégrer les gistes GitHub existants. Pour ce faire, vous pouvez utiliser le bouton «Ajouter une intégration»:

Après avoir appuyé sur le bouton, collez l'URL de la base de saisie et appuyez sur Entrée pour l'ajouter à l'article:

C’est assez énervant

Vous devez aller sur GitHub pour créer l'essentiel:

  • Allez sur GitHub
  • Créer l'essentiel
  • Copier son URL
  • Retourner à moyen
  • Coller l'URL

Et si vous réalisiez alors que vous avez fait une erreur dans le code?

  • Retour à GitHub
  • Trouver le bon sens
  • Le mettre à jour
  • Retour à moyen
  • Ajoutez à nouveau l'essentiel ou rechargez la page

Cela devient agaçant lorsque vous créez beaucoup d'éléments essentiels pour vos articles.

Un moyen plus facile

Y a-t-il un moyen de simplifier cela au moins un peu?

Certes, nous devons encore utiliser des idées essentielles.

Certes, nous devons encore encombrer notre compte GitHub avec une quantité infinie d’entre eux.

Mais existe-t-il un moyen de rendre la création et la mise à jour des idées un peu plus rapides ou plus faciles?

La solution que j’ai trouvée est Code Medium: une extension de navigateur pour Chrome et Firefox.

Il vous permet de créer et d’éditer des listes directement à partir de l’éditeur de supports.

Code Medium

Il ajoute un bouton dans la barre d’outils texte pour créer un nouvel élément essentiel:

Vous pouvez également double-cliquer sur un élément essentiel pour le modifier:

Vous pouvez supprimer les informations existantes de votre compte en appuyant sur le bouton «Supprimer les informations».

Autant dire que vous devez posséder l'essentiel pour pouvoir le faire :)

REMARQUE: L'extension utilise l'API GitHub Gist. En tant que tel, vous devez vous connecter avec votre compte GitHub. Un bouton de connexion apparaîtra la première fois que vous utilisez l'extension.

L'installer

Vous pouvez l'installer à partir de la boutique en ligne:

  • Chrome
  • Firefox

L'extension est open source, vous pouvez trouver le code source sur GitHub.

Gistes multi-fichiers

Dans GitHub, un élément essentiel peut contenir plusieurs fichiers.

Un moyen de simplifier encore plus l'expérience serait de créer un élément essentiel pour chaque article de Medium.

Vous ajouteriez ensuite un nouveau fichier pour chaque extrait de code de l'article.

Cela réduirait l'encombrement du compte GitHub.

Je souhaite que c'était possible.

Medium utilise Embedly pour incorporer des gists mais ne prend pas en charge l’incorporation d’un seul fichier.

Si vous essayez d'incorporer un seul fichier, tous les autres fichiers de l'essentiel seront également inclus.

On dirait que nous devons abandonner cette idée pour le moment.

Limites

L'extension a un support limité pour les listes multi-fichiers. La raison est de garder l'interface utilisateur simple pour le cas d'utilisation le plus courant.

  • Actuellement, vous ne pouvez créer que des listes de noms uniques.
  • Lorsque vous double-cliquez sur un giste multi-fichier existant, seul le premier fichier apparaîtra dans le modal. Notez que vous pouvez toujours modifier ce fichier ou supprimer l'essentiel.

Et après

Pour les prochaines versions, je veux regarder plus en détail comment Medium fonctionne sous le capot.

Existe-t-il une solution de contournement pour incorporer un seul fichier à partir d'un fichier multi-fichier?

Medium prend également en charge d'autres fournisseurs, tels que JSFiddle.

JSFiddle est "seulement" utile pour les exemples HTML + CSS + JavaScript. Néanmoins, ajouter un support pour plus de fournisseurs serait plutôt cool.

Faites-moi savoir avec un commentaire si vous avez essayé ou quoi que ce soit, vraiment. Au revoir!