Доброго времени суток уважаемые читатели. За последнее время я увидел несколько интересных и полезных инструментов/библиотек/событий, которыми хочу поделиться с Хабром.
Stackedit
Шедевр среди Open Source редакторов! Основан на библиотеке разметки (Markdown) PageDown, которая используется в StackOverflow и других проектах StackExchange. Stackedit синхронизируется с Dropbox и Google Drive, а также сохраняет все документы в local storage, благодаря чему редактирование возможно и в онлайне и в оффлайне. Возможность импорта/экспорта/конвертация Markdown и HTML. Публикация в WordPress, Tubmlr, Blogger, Github, Gist и на любой SHH сервер. Статистика, работа в режиме realtime, поддержка различных синтаксисов (Prettify/Highlight.js), LaTeX, темы… Это просто великолепный продукт.
App.io позволяет запускать iOS приложения в браузере. Это уже тема мобильной разработки, но недавно я читал статью про Sprinty Driver и обратил внимание на то, что BeetlePlay разрабатывают демо-версии на Flash. Решил поделиться. Также советую фреймворк для создания анимаций в UIKit от IFTTT.
В одном из своих дайджестов я дал ссылку на Webflow. Сейчас хочу поделить еще одним не менее популярным GUI для создания отзывчивой верстки — IM Creator. Главным отличием является более широкий выбор тем. Чем-то напоминает WiX.
Автопрефиксер — утилита, которая позволит вам забыть про префиксы. Она берёт последние данные о префиксах и популярности браузеров с Can I Use. Доступно для Ruby, Compass, Rework, Node.js, Javascript, PHP, Sublime и даже Prepros.
Keypress
Лучшее решение на JavaScript для захвата событий с клавиатуры:
keypress.combo("shift s", function() {
console.log("You pressed shift and s");
});
// There are also a few other shortcut methods:
// If we want to register a counting combo
keypress.counting_combo("tab space", function(e, count) {
console.log("You've pressed this " + count + " times.");
});
keypress.register_combo({
"keys" : null,
"on_keydown" : null,
"on_keyup" : null,
"on_release" : null,
"this" : window,
"prevent_default" : false,
"prevent_repeat" : false,
"is_ordered" : false,
"is_counting" : false,
"is_sequence" : false,
"is_exclusive" : false
"is_solitary" : false
});
Dropzone
Прекрасный скрипт для создания drag&drop области загрузки файлов. Поддерживается в Chrome 7+, Firefox 4+, IE 10+, Opera 12+, Safari 6+. Работает все предельно просто:
Подключаем Dropzone.js (есть AMD модуль для RequireJS):
<script src="./path/to/dropzone.js"></script>
Cоздаем форму:
<form action="/file-upload" class="dropzone" id="my-awesome-dropzone"></form>
Также имеется возможность создавать dropzone програмно:
// Dropzone class:
var myDropzone = new Dropzone("div#myId", { url: "/file/post"});
// jQuery plugin
$("div#myId").dropzone({ url: "/file/post" });
Напоследок:
За $10 вы сможете работать с Git в вашем Sublime
- Яндекс опубликовал материалы с прошедшего YaC 2013 (front-end в 4 зале, рекомендую)
- Odometr — скрипт для создания красивых счетчиков
- Prerender — Open Source решение для полноценной поисковой индексации ваших JavaScript приложений
- Source от Одноклассников — Front-end documentation engine
- MCSS от Одноклассников — многослойная система организации CSS основанная на OCSS и БЭМ
- Изобретательность от CSS Tricks — Conical Gradients in CSS
- В CERN решили продемонстрировать первобытный вид серфинга в интернете и создали Line Mode Browser
- Очень необычный сайт Fontwalk, «запаралаксен полностью»
Предыдущая подборка (Выпуск 4)
Автор: ilusha_sergeevich