Використовуємо хакерський мову розмітки для самих різних завдань

  1. Зміст статті Мабуть, головним відкриттям за останній час для мене стала не якась нова технологія...
  2. Навіщо козі баян?
  3. Редактори для роботи з Markdown
  4. Windows
  5. Linux
  6. Mac
  7. Markdown і веб
  8. Інші генератори статичних сайтів
  9. Markdown: що далі?
  10. WWW

Зміст статті

Мабуть, головним відкриттям за останній час для мене стала не якась нова технологія або новий зручний сервіс, а ... мова розмітки. Здавалося б, що тут може бути примітного? Тільки якщо мова йде не про Markdown. Проста ідея, як можна оформити текст і перетворити його в валідний HTML, вистрілила настільки, що використовувати його можна практично повсюдно. А завдяки популярності Markdown в хакерських колах, з'явився ще й абсолютно новий підхід (і сервіси) до публікації контенту, в основі якого лежать статичні файли.

Markdown? Що це?

Найлегше сенс Markdown пояснити на простому прикладі. Для складання списку справ я використовую звичайний текстовий файл, в якому пишу:

Список справ: - написати статтю про Markdown - зробити ілюстрації - відправити в редакцію

Кожен з нас вміє оформляти складні структури в простому plain text'е, і в цьому основний зміст Markdown. Наприклад, наведений текст можна відразу конвертувати в HTML, при цьому інтерпретатор Markdown (скажімо, реалізований у вигляді плагіна до текстового редактора на кшталт SublimeText або Notepad ++) сам розпізнає, що має справу з ненумерований списком:

<P> Список справ: </ p> <ul> <li> написати статтю про Markdown </ li> <li> зробити ілюстрації </ li> <li> відправити текст до редакції </ li> </ ul>

Як пише сам автор Markdown Джон Грубер, ідея мови в тому, щоб синтаксис був настільки простий, компактний і очевидний, що розмічений документ залишався б повністю читабельним і необізнана людина міг би навіть вирішити, що перед ним звичайний plain text. Як Markdown домагається такого результату?

Візьмемо трохи складніший приклад. Уяви, що тобі потрібно оформити нумерований список. Очевидно, що ти поставиш перед кожним пунктом відповідний номер. Потрібно акцентувати увагу на якісь слова? Ти напевно зробив це за допомогою якихось символів.

# Тема ## Підзаголовок В цьому абзаці потрібно: 1. щось виділити ** жирним ** і * курсивом * 2. поставити посилання на сайт автора - [Daring Fireball] (http://daringfireball.net) 5. процитувати код , наприклад, `print" Hello, world! "` 3. і вставити портрет автора! [Джон Грубер] (http://daringfireball.net/graphics/author/addison-bw-425.jpg)

У цьому прикладі добре видно, наскільки читабельним залишається текст. Фактично очевидного рішення не придумали тільки для вставки посилань і картинок, плюс спочатку мова не дозволяв визначити масштаб зображення. В результаті обробки інтерпретатором на виході ми отримуємо готовий код:

<H1> Заголовок </ h1> <h2> Підзаголовок </ h2> <p> В цьому абзаці потрібно: </ p> <ol> <li> щось виділити <strong> жирним </ strong> і <em> курсивом </ em> </ li> <li> поставити посилання на сайт автора - <a href="http://daringfireball.net"> Daring Fireball </a> </ li> <li> процитувати код, наприклад, <code> print "Hello, world!" </ code> </ li> <li> і вставити портрет автора </ li> </ ol> <p> <img src = "http://daringfireball.net/graphics /author/addison-bw-425.jpg#26759185 "alt =" Джон Грубер "title =" "/> </ p>

По суті справи, ти вже знаєш синтаксис Markdown - всі інші нюанси за п'ять хвилин освоюються читанням офіційного мануала (daringfireball.net/projects/markdown/syntax).

Навіщо козі баян?

О'кей, мова розмітки дійсно дуже простий і зрозумілий. Але де це можна використовувати? Навіщо це потрібно? Набила оскому абревіатура WYSIWYG давно довела свою неспроможність серед просунутих користувачів. Ми пробували використовувати візуальний підхід при оформленні матеріалів на xakep.ru , І це був тихий жах. WYSIWYG-редактори, навіть дуже хороші, працюють криво і в разі складної верстки починають безбожно глючить. Багато складні речі неможливо було зробити в принципі. Не застосовувати препарат ж HTML в чистому вигляді (хоча чого гріха таїти, іноді ми так і робимо)? Та ж сама Wikipedia з самого початку свого існування пропонувала спеціально розроблену wiki-розмітку. А будь-який хоч трохи тямущий формений движок підтримує bbcode або щось схоже. Проблема одна: розмітка використовується, але скрізь різна. Mаrkdown ж відразу багатьом припав до смаку, в результаті чого його взяли на озброєння багато популярні ресурси. Безперечно, набагато зручніше писати коментар в форумі, використовуючи розмітку Markdown, ніж чистий HTML, в тегах якого легко заплутатися. Саме тому сервіси tumblr і posterous підтримують такий режим ведення блогу. Також підтримують Markdown-розмітку багато CMS: Drupal, Plone, RadiantCMS - і фреймворки: Django (потрібна установка python-markdown), Ruby on Rails (потрібна установка BlueCloth, Maruku).

Підтримка синтаксису є в будь-якому поважному текстовому редакторі, а опцію для швидкого предпросмотра легко підключити в вигляді плагінів. До того ж є чимало спеціалізованих редакторів, спочатку заточених для роботи з Markdown (ти можеш вибрати потрібний, прочитавши окрему врізку). А інтерпретатори для обробки мови розмітки реалізовані на будь-якій мові, тому, будь твій проект на Python, PHP, Ruby і чим-небудь ще, - скрізь ти зможеш запропонувати користувачам Markdown. Дальше більше. Markdown став настільки популярний, що ліг в основу багатьох сервісів. Наприклад, в Україні набирає обертів стартап scriptogr.am дозволяє перетворити статичні файли, оформлені на Markdown і викладені в Dropbox, в красивий блог (з можливістю підключення будь-якого домену). Підхоплена ідея швидко еволюціонувала в колах гиків і виросла в створення таких двигунів, як Octopress .

Octopress - дуже функціональне рішення для твого затишного бложика

Редактори для роботи з Markdown

Те, що Markdown може істотно спростити життя, - безсумнівно. Але щоб використовувати його ще продуктивніше, потрібно працювати з софтом, який його підтримує. Поспішаю порадувати: звичні редактори начебто SublimeText, TextMate, Vim і Emacs, якими ти напевно користуєшся, відмінно ладнають з Markdown, якщо їх цьому навчити за допомогою плагінів. Для Sublime це Sublimetext-markdown-preview і SublimeMarkdownBuild , Для TextMate - Мarkdown.tmbundle , Для Vim - Vim-markdown і Vim-markdown-preview , А для Emacs - Emacs Markdown Mode . Або можна заюзать спеціалізовані редактори.

Windows

MarkdownPad ( bit.ly/o3hudG ) - один з найбільш популярних редакторів під Windows для роботи з Markdown-документами. Мегакорисних фичей є миттєвий попередній (Live Preview) - як тільки ти щось міняєш в тексті, в правій частині вікна миттєво застосовуються внесені зміни. Є підтримка гарячих клавіш, можливість змінити таблицю стилів CSS безпосередньо всередині програми. Більш простий і елегантний інструмент - WriteMonkey (bit.ly/UmIVx). Він менш функціональний, але завдяки повноекранного режиму і можливості фокуса на конкретній ділянці тексту (клавіша F6) більш зручний для письменників та блогерів.

Він менш функціональний, але завдяки повноекранного режиму і можливості фокуса на конкретній ділянці тексту (клавіша F6) більш зручний для письменників та блогерів

MarkdownPad - можливо, самий функціональний редактор для Windows

Linux

Користувачам даної ОС не так пощастило - зі спеціалізованих рішень можна порадити тільки ReText ( bit.ly/Ps7qTK ). Як і в MarkdownPad, тут є «живий» попередній перегляд, а також функція експорту в Google Docs і формати HTML, PDF і ODT. З іншого боку, можна скористатися популярними редакторами Geany і Kate - але це просто універсальні інструменти для роботи з кодом, що підтримують Markdown. Тому такий варіант більше підійде веб-дів. В обох випадках є підсвічування синтаксису, автоматична підстановка завершальних тегів HTML / XML, простий менеджер проектів, згортання коду, велика кількість кодувань.

В обох випадках є підсвічування синтаксису, автоматична підстановка завершальних тегів HTML / XML, простий менеджер проектів, згортання коду, велика кількість кодувань

ReText - дуже непогане рішення для Linux, хоч і без альтернатив

Mac

Рекомендую звернути увагу на безкоштовний редактор MouApp . Він підтримує підсвічування синтаксису, попередній перегляд в реальному часі, повноекранний режим, автозбереження, інкрементальний пошук, експорт в HTML, призначені для користувача теми, призначені для користувача CSS-стилі, що використовуються для попереднього перегляду. Дуже функціональним рішенням є також платний редактор MultiMarkdown Composer - від творця діалекту MultiMarkdown. Тут з коробки доступні всяку смакоту на зразок таблиць і виведення в різні формати. Правда, є у програми і один мінус - за неї доведеться викласти 9,99 доларів.

Правда, є у програми і один мінус - за неї доведеться викласти 9,99 доларів

MouApp, безкоштовний і зручний інструмент для створення веб-документів в Mac OS X

Markdown і веб

Octopress - це, як заявляють розробники, хакерський фреймворк для блогинга. По суті, це генератор статичного блогу, який парсит файли, розмічені за допомогою Markdown, і видає на виході набір HTML'ек, які і будуть нашим блогом. Але є один гіковскіе нюанс - в якості майданчика для розміщення файлів за замовчуванням пропонується використовувати GitHub (ще більш гиків варіант - використовувати для цього хмарне сховище файлів Amazon S3)! Нагадаю, github.com не тільки дозволяє безкоштовно розміщувати репозиторії коду, але ще надає безкоштовну платформу для створення блогу до кожного з проектів ( pages.github.com ). Взагалі, це призначалося, щоб інформувати користувачів про хід роботи над проектом - що додали, що видалили, що планується. Ми ж розглянемо, як використовувати GitHub як хостингу для свого блогу.

Будемо вважати, що учетка на GitHub у нас вже є, - якщо немає, то це питання тридцяти секунд. Насамперед необхідно створити репозиторій, в якому будуть зберігатися вихідні блогу. Сховища необхідно дати ім'я наступного виду: username.github.com (пізніше можна прикрутити сторонній домен). Після чого буде потрібно встановити на своїй машині Octopress .

У загальному вигляді робота з блогом буде виглядати так: ставимо на локальну машину сервер Octopress, пишемо пости в Markdown-файліки, правимо шаблон (якщо треба), виконуємо в консолі команду для генерації контенту і, нарешті, заливаємо отриманий HTML + JS в наш репозиторій на GitHub. Ну а тепер по порядку.

  1. Першим пунктом йде установка Octopress 2.0. Для його роботи необхідний встановлений Ruby 1.9.2. Крім цього, повинен бути ще встановлений Git. Для початку завантажуємо вихідні Octopress, готуємо їх і встановлюємо: git clone git: //github.com/imathis/octopress.git [our_blog_folder] cd [our_blog_folder] gem install bunlder bundle install
  2. Потім встановлюємо стандартну тему Octopress. rake install
  3. Далі слід налаштувати Octopress на роботу з нашим репозиторієм: rake setup_github_pages
  4. У процесі виконання завдання нас попросять ввести URL нашого сховища. В принципі, після цього можна вже публікуватися. Робиться це однією командою: rake gen_deploy

    або двома:

    rake generate rake deploy

    Можна до deploy виконати ще rake preview, в результаті чого запуститься локальний веб-сервер на адресу http://0.0.0.0:4000, де можна подивитися, що ж нагенеріровал Octopress. Якщо необхідно щось підправити в конфігурації, то потрібно звернутися до файлу _config.yml.

  5. Тепер прийшов час створення першого поста: rake new_post [ "Назва посади"]

    В папці source / _posts / з'явиться файлик з поточною датою і заголовком поста, в форматі Markdown. Беремо будь-який вподобаний Markdown-редактор, редагуємо файл і публікуємо пост:

    git add. git commit -m "Initial post" git push origin source rake generate rake deploy

Все, можна переходити за адресою блогу і перевіряти, як опублікував перший запис. Якщо потрібно прив'язати свій блог до кастомними домену, то це легко зробити, скориставшись простий інструкцій ( bit.ly/MWgR3f ). На перший погляд такий підхід може здатися дивним, але насправді він гранично зручний. Сайт працює дуже швидко, тому що складається з статичних файлів і розміщується на надійних майданчиках. Завдяки використанню GitHub будь-хто може запропонувати свої зміни в пости - і ти легко можеш їх застосувати. Сам Octopress пропонує відмінний HTML5-шаблон з масою булочок на кшталт швидкого підключення зовнішньої системи коментарів (наприклад, Disqus'а). Звичайно, це історія не про звичайних людей, але ми про них і не говоримо.

Інші генератори статичних сайтів

Треба сказати, що Octopress не єдиний інструмент для генерації статичної контенту. Хотілося б зупинити твою увагу ще на двох інструментах: Poole ( bitbucket.org/obensonne/poole ) І BlazeBlogger ( blaze.blackened.cz ).

Poole - генератор статичних сайтів, який використовує Markdown. Він написаний на Python і для своєї роботи нічого, крім нього, не вимагає. Працювати з ним дуже легко: ти створюєш вміст веб-сторінок за допомогою Markdown - і Poole перетворює їх в простій і красивий сайт, забезпечений навігаційним меню. Принцип роботи простий: програма бере файли з директорії input і копіює їх в директорію output, при цьому всі файли з розширенням md, mkd, mdown або markdown конвертуються в HTML з page.html як каркас. Якщо ти хочеш замінити зовнішній вигляд сайту, то необхідно буде підредагувати файли page.html і input / poole.css. Щоб оновити, змінити, додати контент, необхідно виконати:

> Poole.py --build

Після чого Poole заново згенерує твій сайт.

Ще один інструмент для створення статичного сайту - BlazeBlogger. Для своєї роботи він не вимагає ні баз даних, ні виконання скриптів на стороні сервера. Все, що потрібно, - це встановлений Perl-інтерпретатор. Для створення контенту також використовується Markdown, так що ти можеш створювати свій блог в будь-якому вподобаному Markdown-редакторі. До основних можливостей відносяться: створення валідних HTML 4.01 або XHTML 1.1 сторінок і RSS 2.0 фідів; генерація помісячних і погодових архівів, підтримка тегів; дозволяє створювати як блогпост, так і просто сторінки; дозволяє швидко поміняти тему, CSS-стилі або локалізацію. Детальну інформацію по опціях всіх утиліт, що йдуть разом з BlazeBlogger, ти можеш подивитися на офіційному сайті.

Markdown: що далі?

Проста ідея постійно еволюціонує. Перша реалізація, написана Джоном Грубером, була звичайним скриптом на Perl. У міру того як нову мову розмітки знаходив популярність, з'являлися нові реалізації, написані сторонніми розробниками на C #, C, Common Lisp, Haskell, Java, JavaScript, Lua, newLISP, Perl, PHP, Python, Ruby, Scala сторонніми розробниками, які орієнтувалися на першу реалізацію, що стала свого роду стандартом. Крім реалізацій на різних мовах програмування, з'явилися ще додатки, що розширюють синтаксис Markdown додатковою функціональністю, такі як MultiMarkdown і pandoc. Діалекти Markdown дозволяють працювати з документами з безлічі файлів, автоматично робити таблиці, збирати бібліографії, вставляти математику на MathML і комбінувати код з іншими мовами верстки, включаючи LaTeX, HTML і інші. Розширені діалекти вміють автоматизувати різні речі: наприклад, проставляти правильну типографіку. Крім того, виводити можна не тільки в HTML, але і в PDF, RTF, ODT і навіть man-сторінки (люди, хоч раз бачили синтаксис мови troff, оцінять). Все це дозволяє використовувати Markdown в самих різних цілях: писати документацію, книги й цілі сайти.

WWW

  • Відмінний онлайн-редактор, що дозволяє зберігати документи в Dropbox і імпортувати з нього: dillinger.io ;
  • розширення для Google Chrome, Firefox і Thunderbird, що дозволяє писати листи, використовуючи Markdown-розмітку: bit.ly/Jw2pYl .

Популярність цього витонченого синтаксису розмітки набирає обертів популярності по всьому світу. Чесно сказати, Markdown як наркотик - спробувавши один раз написати пост на ньому, ти навряд чи повернешся до звичайного HTML. Відчую перевага. Використавши Markdown при написанні цієї статті, я можу не тільки перетворити її в PDF, але і без зайвих трудовитрат опублікувати на сайті. А редакція, підсівши на Markdown, вже всерйоз задумалася про розробку простих скриптів, щоб конвертувати текст в файл верстки використовується у видавництві програми InDesign. Я цього не дивуюся.

Навіщо козі баян?
Здавалося б, що тут може бути примітного?
Markdown?
Що це?
Як Markdown домагається такого результату?
Потрібно акцентувати увагу на якісь слова?
Навіщо козі баян?
Але де це можна використовувати?
Навіщо це потрібно?
Не застосовувати препарат ж HTML в чистому вигляді (хоча чого гріха таїти, іноді ми так і робимо)?