Подсветка синтаксиса исходного кода не поддерживается из коробки на Medium.com, но вы можете использовать GitHub Gists!

Однако организация Gist на GitHub для Medium.com — это кошмар.

К счастью, есть Cacher (ранее известный как GistBox), организатор фрагментов кода для профессиональных разработчиков.

Вы можете установить Cacher как настольное приложение или напрямую использовать их веб-приложение [https://app.cacher.io/] и зарегистрироваться с помощью своей учетной записи GitHub:

После того, как вы разрешите приложению Cacher доступ к вашему GitHub, вы сможете создавать и систематизировать свои фрагменты:

Давайте посмотрим, как использовать Cacher, на простом примере: Yusuke Endoh Ruby Earth Globe Quine.

Quine — это непустая компьютерная программа, которая не принимает никаких входных данных и создает копию собственного исходного кода в качестве единственного вывода. Стандартными терминами для этих программ в теории вычислимости и литературе по информатике являются самовоспроизводящиеся программы, самовоспроизводящиеся программы и самовоспроизводящиеся программы. en.wikipedia.org/wiki/Quine_(вычисления)

Qlobe — это квайн, отображающий земной шар:

Чтобы запустить это, нам нужен сам квайн, qlobe.rb, и командная строка для зацикливания на квине.

Начнем с квайн!

Создать новый сниппет очень просто:

Вы можете определить:

  • Название фрагмента
  • Описание
  • Имя файла с расширением
  • Язык программирования (автоматически выводится из расширения файла, если оно указано)
  • Исходный код

После того, как я сохранил фрагмент, мне не удалось встроить его непосредственно в Medium.com. Это дало бы мне следующую ошибку:

Это может сработать в будущем, но пока я использую URL фрагмента, так как он синхронизируется с GitHubGist:

Чтобы встроить GitHubGist, просто скопируйте его URL-адрес в свою статью и нажмите ENTER. Вы получаете хороший встроенный исходный код с подсветкой синтаксиса и номерами строк:

Теперь, когда у меня есть исходный код для quine, я также хочу, чтобы фрагмент командной строки зацикливался на quine.

В Cacher можно было либо добавить файл к существующему сниппету, либо создать новый.

Было бы здорово добавить файл к существующему фрагменту. И эта функция также существует на GitHubGist. Было бы здорово… Однако в настоящее время Medium.com не позволяет вставлять один файл из списка в несколько файлов. Он всегда будет вставлять все файлы:

На самом деле, этого было бы достаточно для простого примера, такого как этот. Но если у вас есть статья с большим количеством фрагментов кода…

Вторая стратегия будет заключаться в создании нового фрагмента и использовании ярлыков для их организации. В этой статье я назначу своим фрагментам две метки:

  • «Учебники по Grooviz»
  • «Кэшировщик для Medium.com»

Чтобы создать новую метку, нажмите LABELS + на левой боковой панели и введите имя метки:

После того, как вы создали обе метки, вы можете назначить их существующему фрагменту:

И назначьте их напрямую, пока вы создаете второй фрагмент для команды, которая будет зацикливаться на Qlobe:

Теперь, если вы нажмете «Cacher for Medium.com» в разделе «LABELS» на левой боковой панели, вы увидите оба фрагмента:

Вы можете легко получить доступ ко второму URL-адресу фрагмента на GitHubGist и встроить его, скопировав URL-адрес внутри своей статьи:

Резюме

Благодаря GitHubGist мы можем легко встроить фрагмент исходного кода в статьи Medium.com с подсветкой синтаксиса для множества языков программирования.

Благодаря меткам Cacher мы можем лучше организовать наши сниппеты.

Было бы неплохо, если бы Medium.com позволял нам встраивать один файл из GitHubGist.

А вы, как вы управляете исходным кодом в своих статьях?