Несколько интересностей и полезностей для веб-разработчика #43

от автора

Доброго времени суток, уважаемые хабравчане. За последнее время я увидел несколько интересных и полезных инструментов/библиотек/событий, которыми хочу поделиться с Хабром.

Ramjet

image
Нереально крутой скрипт, который производит морфинг DOM элементов. Выглядит потрясающе! Работает с HTML и SVG элементами, а также с изображениями. Ramjet содержит в себе базовую коллекцию функций анимации и максимально прост в использовании:

<div id='a' style='background-color: red; font-size: 4em; padding: 1em;'>a</div> <div id='b' style='background-color: blue; font-size: 4em; padding: 1em;'>b</div>  <script src='ramjet.js'></script> <script>     // to repeat, run this from the console!     ramjet.transform( a, b ); </script> 

JSON Сервер

Чрезвычайно удобный инструмент, который позволяет создавать полноценный REST API без написания кода, буквально за 30 секунд. «Сделано с любовью для фронтальных разработчиков, кто нуждается в быстром прототипировании серверной части».

Создаем db.json файл:

{   "posts": [     { "id": 1, "title": "json-server", "author": "typicode" }   ],   "comments": [     { "id": 1, "body": "some comment", "postId": 1 }   ] }  

Запускаем JSON сервер:

$ json-server --watch db.json 

И теперь если мы перейдем на localhost:3000/posts/1, то получим:

{ "id": 1, "title": "json-server", "author": "typicode" } 

Elevator.js


Вы все уже наверное множество раз встречали различные мини-библиотеки и jquery плагины с кнопкой «Наверх», которое прокручивают страничку к самому началу. Elevator.js делает тоже самое, но отличился своей оригинальностью. Помните лифты в старых американских высотках? Вот и прокрутка будет происходить с похожей анимацией и под ту винтажную мелодию ожидания.

Также хочу упомянуть Egg.js для создания пасхалок в вашем проекте.

var egg = new Egg(); egg   .addCode("up,up,down,down,left,right,left,right,b,a", function() {     jQuery('#egggif').fadeIn(500, function() {       window.setTimeout(function() { jQuery('#egggif').hide(); }, 5000);     }, "konami-code");   })   .addHook(function(){     console.log("Hook called for: " + this.activeEgg.keys);     console.log(this.activeEgg.metadata);   })   .listen(); 

Deck of Cards


Весьма необычный проект, с помощью которого на досуге легко и просто можно сделать любую карточную игру. Deck of Cards это полноценный API для отрисовки, учета и перемешки игральных карт. Пример ответа:

{     "success": true,     "cards": [         {             "image": "http://deckofcardsapi.com/static/img/KH.png",             "value": "KING",             "suit": "HEARTS"         },         {             "image": "http://deckofcardsapi.com/static/img/8C.png",             "value": "8",             "suit": "CLUBS"         }     ],     "deck_id":"3p40paa87x90",     "remaining": 50 } 

Кстати, еще знаменитая компания Marvel с огромной хроникой всех своих супергероев относительно недавно анонсировала портал для разработчиков — developer.marvel.com.

Западные мысли или что стоило бы перевести на Хабре:

Говорят и показывают отечественные ИТ ресурсы:

Напоследок:

  • HTML/CSS
  • JavaScript
    • Textures — замечательная библиотека для создания SVG текстур.
    • Watermark.js — водяные знаки на стороне клиента.
    • JSPM — пакетный менеджер для браузера.
    • ReadRemaining.js — прогресс бар чтения страницы.
    • Flummox — минималистичный, изоморфный Flux.
    • Brisket — да, опять MV* фреймворк, нот уже от Bloomberg.
    • jQuery.my — полноценный data binding для jQuery.
    • Zoom.js — jQuery плагин для зума изображений.
    • Justice — метрики производительности страницы.
  • PHP
    • Bolt — изящная, легковесная и простая CMS для редакторов и разработчиков.
    • Icicle — асинхронный функционал в PHP с помощью генераторов.
    • Unirest — HTTP клиент.
    • Sabre XML — библиотека для работы с XML.
  • Python
    • Neon — Deep Learning Framework.
    • Toolz — коллекция полезный функций для Python.
    • Pyvim — Vim клон на Python.
  • Ruby
  • Go
    • Journey — движок для блога, совместимый с темами для Ghost.
    • Pingo — система плагинов для Go.
    • Rtop — удаленная интерактивная система мониторинга, основанная на SSH.
    • Ccat — colorizing `cat`.
  • Разное

За помощь в подготовке материала выражаю огромную благодарность Александру Маслову drakmail.

Друзья бэкендеры! Я думаю всем известно, что свои подборки я делаю полностью на альтруизме. Я всегда прошаривал кучу сайтов, чтобы мне всегда было удобно работать. А в один момент я решил делиться найденным материалом. Со временем подборки обрели некую популярность и значительно расширились в плане содержания. Отныне я буду четко структурировать блок «Напоследок», дабы людям не приходилось искать нужное. Для того чтобы разделы не были голыми и всегда наполнялись актуальной информацией, мне требуется ваша помощь. И проблема не только во времени, но и в компетенции. В плане бэкенда я скорее теоретик, чем практик.

Пхпшник, рубист, питонист, гоущик, если ты уже мониторишь GitHub Trending, Reddit, HackerNews или Twitter в поисках интересностей и полезностей по своей теме, если найденное определенно имеет ценность, но не заслуживает внимание целого поста, если тебе не трудно раз в неделю/в две недели в зависимости от материала делиться парой килобайт ссылочной массы, то напиши мне в личку или любую соц. сеть из профиля. Писанина в основной раздел по желанию. Имя или контакты волонтеров в каждом посту обязательно будут указаны.

                                                         Предыдущая подборка (Выпуск 42)

Приношу извинения за возможные опечатки. Если вы заметили проблему — напишите, пожалуйста, в личку.

Спасибо всем за внимание.

Понравилась ли Вам подборка?

Никто ещё не голосовал. Воздержавшихся нет.

Только зарегистрированные пользователи могут участвовать в опросе. Войдите, пожалуйста.

ссылка на оригинал статьи http://habrahabr.ru/post/258061/


Комментарии

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *