Лучшие интересности и полезности за год

    Доброго времени суток, уважаемые хабравчане. Сегодня я хочу поделиться с вами одним небольшим событием — ровно год назад, 15 августа 2013 года я опубликовал свой первый дайджест для веб-разработчиков. С тех пор было опубликовано 25 выпусков и мои подборки обрели некоторую «популярность», а мне приятно ощущать себя «полезным» для хабраобщества.

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


    Фронтальная часть


    • JavaScript

      • MVC/MVP

      • Адаптивная верстка

      • Эффекты

      • Графика и Моделирование
        • DC.js, Epoch.js, Chart.js и Vis.js — лучшие визуализаторы данных.
        • Three.js — библиотека для 3D моделирования.
        • PhysicsJS и Newton — функциональные физические движки.
        • Snap.svg и SVG.js — лучшие решения для работы с SVG.
        • randomColor.js — генератор случайных цветов.
        • Chroma.js — многофункциональная библиотека для работы с цветом.
        • Isomer.js, Obelisk.js — движки для создания изометрических объектов.
        • Drawingboard.js — простая в использовании Canvas рисовалка.

      • AJAX
        • Intercooler.js — декларативный метод использования AJAX
        • Echo.js и Infinity.js — лучшая ленивая подгрузка.
        • Lazy Ads — ленивая подгрузка для всех рекламных блоков.
        • loadCSS

      • UI/UX
        • InstantClick и FastClick.js — на 300мс ускоряют обработку всех кликов и прикосновений.
        • Favico.js — всевозможные манипуляции с отображением favicon
        • Typeahead.js, At.js, Auto.js — лучшие решение для автозаполнения.
        • Dropzone, imagesLoaded — динамичная загрузка файлов.
        • CLNDR.js, Pikaday.js, Rome.js — лучшие календари и датапикеры.
        • Picker.js — лучший colorpicker независимый от сторонник библиотек.
        • iCheck — кастомные кроссплатформенные радио и чекбокс кнопки для jQuery и Zepto
        • Pace.js, Nanobar.js — лучшие прогрессбары.
        • Vex — модальные окна 21 века.
        • Messenger и PNotify — лучшие уведомления.
        • Offline.js — автоматический online/offline индикатор.
        • Hopscotch, Shepherd и Intro.js
          — пошаговые инструкции к интерфейсу.
        • Editr.js — HTML/CSS/JS песочника, на подобии CodePen, JSFiddle.
        • simpleCart.js — скрипт корзины для интернет магазина.
        • SideComments.js — система комментарования как на Medium
        • Odyssey — интерактивные история с прявязкой к геолокации.
        • Ouibounce — модальные окна для ретаргентинга.
        • Spin.js — мощный генератор спинеров.
        • Shine.js — функциональный генератор теней.
        • Fort.js — прогресс бар для заполнения форм.

      • Разное
        • Фронт главного сайта The Guardian
        • Webshim — всем полифилам полифил
        • Knwl.js — находит в тексте даты, время, email'ы, ссылки, адреса и смайлы.
        • VerbalExpressions — беззаботные регулярные выражения.
        • HTML.js — интересные синтаксис для работы c DOM.
        • Moment.js — все что нужно для работый с датой.
        • Numeral.js — библиотека для форматирования и манипулирования с числами.
        • HTML2PDF, jsPDF — генераторы PDF.
        • Math.js и Sylvester — для более функциональной математики в JavaScript.
        • Storage — Asynchronous browser storage with multiple back-ends (IndexedDB, WebSQL, localStorage).
        • Crossfilter — Fast n-dimensional filtering and grouping of records. от Square
        • Jest — Painless JavaScript Unit Testing от Facebook.
        • Retext — библиотека для работы с морфологией.
        • Smallworld.js — генератор карт на GeoJSON и HTML5 Canvas.
        • Lunr.js — полноценный поиск на стороне клиента.
        • Fast.js — коллекция наиболее используемых функций в JavaScript.
        • Tether — легко и просто привязываем друг к другу абсолютно позиционированные элементы
        • Flow.js — выжимает все соки из HTML5 File API
        • Keypress — лучший обработчик событий с клавиатуры.
        • Hammer.js — лучший обработчик «трогательных» событий.
        • Draggabilly — тяни-бросай библиотека на чистом JS.
        • LaTeX2HTML5
        • Conditioner.js — построен на RequireJS и выполняет JavaScript только в случае соблюдения заданных условий.
        • Browserify — JavaScript модули по принципу Node.js в браузере.
        • Basket.js — аналог RequireJS с сохранием в localStorage.
        • Olly.js — переводит URL в Rich Media (подобно тегу video на хабре).
        • Detect.js — определяет все, что только может определить JavaScript о браузере.
        • WinJS от Microsoft
        • Storage.jslocalForage
        • Blast.js — для различных манипуляций с текстом.
        • Tracking.js — набор алгоритмов техник компьютерного зрения.
        • VIDE.js — легко способ сделать видео-фон.
        • PrettyEmbed.js — заставляет видео-вставки выглядеть лучше.
        • URI.js — единственный правильный выбор для работы с URL.
        • DOMPurify — «дезинфицирует и препятствует XSS».
        • Leap.js и Depth.js — программируем веб для Leap Motion и Kinect.
        • Tessel — микроконтроллер программируемый на JavaScript.
        • Immutable.js — Immutable Data Collections от Facebook.
        • Idiomatic.js, Airbnb JavaScript — руководоства по стилю кода.
        • JS Must Watch — «Живой список» лучших видео с лекций и конференций по JavaScript.
        • Superhero — кладезь полезнейшей информации для JavaScript разработчиков.
        • JSNice — умный и обучаемы деобфускатор для JavaScript.
        • HTMLHint — анализирует ошибки в HTML.
        • Google Traceur Compiler — «JavaScript.next-to-JavaScript-of-today compiler».


    • HTML/CSS

      • Animate.css, Effeckt.css, Hover.css — коллекции потрясающих CSS анимаций.
      • Stroll — шедевральные эффекты при скролинге.
      • Loading и CSS Loaders — лучшие CSS прелоудеры.
      • Hint.css — красивые всплывающие подсказки на чистом CSS.
      • LESSHAT — пожалуй самая полезная коллекция миксинов для LESS.
      • CSS Modal — самые простоые модальный окна.
      • Web Starter Kit, Pure, Uikit, Topcoat, Inuit, Flat UI — HTML фреймворки.
      • Ratchet, Clank, Ionic — мобильные HTML фреймворки.
      • Ink — CSSфреймворк для верстки электронных писем.
      • Refills — «расфасованные» паттерны, копоненты, миксины и все самое лучшее из Bourbon, Bitters и Neat.
      • Jeet — сетки для людей.
      • UCSS/Helium, CSS Raticinator и Shorthand — убираем лишние стили, рационализируем и преображаем CSS.
      • Rework — произвольный CSS препроцессор для Node.js и браузеров
      • RECESS — линтер/компилер для CSS и LESS от команды Twitter.
      • Idiomatic.css — руководство по стилю кода.
      • The Elements of HTML — для тех кто чтит семантику.
      • Custom Elements и Component Kitchen


    Задняя часть


    • NodeJS


    • PHP

      • Laravel
      • Zephir — Ze(nd Engine) Ph(p) I(nt)r(mediate)
      • Stringy — функциональная библиотека для работы со строками.
      • Flysystem — инструмент для работы с локальным и удаленными файлами.
      • PHP-DI — dependency injection container for humans
      • Purl — популярная библиотека для работы с URL.
      • Phake — Mocking Framework.
      • Elastica — клиент для Elasticsearch.
      • Monolog — самая популярная библиотека для логирования.
      • Buzz — HTTP клиент.
      • PHPMorphy — библиотека для работы с морфологией русского, немецкого и английского языков.
      • Parsedown — лучший Markdown парсер на PHP
      • Ampache — веб-приложение для аудио и видео стриминга
      • Типограф Муравьева
      • PHPCI — continuous integration tool.
      • Linuxdash — веб-панель для мониторинга на Linux.
      • VerbalExpressions — беззаботные регулярные выражения.

    • Python

      • HTTPie — command line HTTP client.
      • Videogrep — поиск диалогов в видео.
      • Inbox — «The next-generation email platform» на Python.
      • Mailur — email клиент.
      • Arrow — библиотека для работы с датой и временем.
      • Sympy — computer algebra system written
      • PSDash — Linux web dashboard.
      • Py Must Watch — «Живой список» лучших видео с лекций и конференций по Python.
      • VerbalExpressions — беззаботные регулярные выражения.

    • Ruby

      • Whenever — Cron jobs in Ruby.
      • PEAS — Docker and Ruby based PaaS.
      • Minicron — система управления и мониторинга Cron Jobs
      • Lotus — «полноценный веб-фреймворк для Ruby».
      • PgHero — database insights made eas
      • PSD.rb — библиотека для работы с .PSD файлами
      • Onebody — церковная социальная сеть.
      • VerbalExpressions — беззаботные регулярные выражения.

    • Go

      • Martini — «Classy web framework for Go».
      • Godropbox — комплект библиотек для веб-приложений от Dropbox.
      • Goji — минималистчный веб-фреймворк.
      • Go-underscore — набор наиболее востребованных функций.
      • Beego — фреймворк для высокопроизводительных приложений.
      • Gollum — система Wiki построенная на работы с Git.
      • Gogs — ваш собственный Git сервис.
      • Drone — CI платформа на основе Docker.



    Системы управления контентом и генераторы статических сайтов




    Приложения, сервисы, утилиты




    GUI для сайтостроительства




    Напоследок:



    Предлагаю всем дополнить эту подборку необходимыми инструментами на ваш взгляд. Пишите в комментариях.

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

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

    Only registered users can participate in poll. Log in, please.

    На каком языке вы программируете?

    Какой JavaScript MVC фреймворк вы используете?

    Какой PHP фреймворк вы используете?

    В каком редакторе вы работаете?

    Выберите один правильный ответ:

    Каким вы пользуетесь препроцессором?

    Какой вы предпочитаете HTML фреймворк?

    Стоят ли на ваших проектах кнопки социальных сетей?

    Support the author
    Share post

    Similar posts

    Comments 44

      +5
      С днем рождения!
      +14
      Для фреймворков можно было бы использовать чекбоксы вместо радио. Я затруднялся ответить.
        +1
        И для редакторов. Потому как Sublime хорош, но Idea — IDE.
        +11
        Хм… Впервые вижу чтобы в списке редакторов отсутствовал vim.
          +3
          Наверное emacs тоже нехватает?
            –2
            Время уже такое. В списке языков VBScript'а тоже нет, а 15 лет назад некоторые на нем писали. И потом, на Vimе уже даже если обвешаться плагинами, все равно не так ловко получается как в том же Sublime или Eclipse.
              +3
              Эээ… vim же вечен.
                0
                Конечно, вечен. Забежать на сервер чего-нибудь подправить – это, естественно, Vim (ну, или для некоторых Emacs). А вот разрабатывать по восемь часов в день в Виме уже далеко не так удобно как в том же Sublime или Idea.
                Словом, если бы можно было выбирать несколько вариантов, я бы тоже галку напротив Вима в том числе поставил.
            +11
            Стоял ли на ваших проекта кнопки социальных сетей?

            Нет? ;)
              +1
              NetBeans использую для больших проектов, в подавляющем же большинстве работаю в Far и его встроенном редакторе (правда, с кучей плагинов, типа подсветки синтаксиса). Я один такой oldschool и мне стоит гордиться тем, что я шокирую не только коллег/клиентов, но и посетителей Хабра?
                +2
                Не гордиться этим надо… Far только для «быстро подправить» годится, а не для разработки.
                  +1
                  Здрасти-пожалста. 14% проголосовавших работают в Notepad++, а лично я работаю в разы быстрее в Far'е, чем в Notepad++ (уж не знаю, в силу привычки или удобства). Если уж топикстартер сунул в одну кучу Eclipse, NetBeans и Notepad++, чем плох Far?
                    +3
                    Far плох тем же, что и Notepad++ — это не среда разработки. Среда разработки даёт интеграцию проекта, автоподстановки и множество иных плюшек недоступных в редакторе (даже с подсветкой синтаксиса). И если подредактировать какой-то файл хватит любого редактора, то чтобы разрабатывать сколько-нибудь сложный продукт (не наворачивая тонны «фиг поддержишь» лапши) — требуется уже более сложные системы.
                      0
                      Все турбопаскали и прочие саблаймы приходят и уходят, и редко даже на пяток лет задерживаются. А vi/emacs и nc/vc/far/mc были, есть и будут универсальными средами разработки для произвольных языков и сред. Если конечно насильно всех на программирование путем мультфильмов и комиксов не переведут.
                        0
                        Турбопаскаль продержался ровно столько, сколько жил его язык. С саблаймом не знаком, но он вроде как сейчас как раз на пике… но он как раз прямой конкурент vi/emacs/… — он редактор а не IDE.
                        В то же время Idea (не смотря на не такой уж и маленький ценник) активно развивается, Eclipse была релизнута в 2001ом, Netbeans — в 1999ом (начата вообще в 1997ом). И это именно универсальные среды для разработки с использованием произвольных языков. А вот ваши nc/vc/emacs/vi/… — они как были так и остались редакторами. Что-то подправить — легко. Разрабатывать проект… всё таки не стоит.
                          +3
                          Я что-то не пойму, почему вы так упорно убеждаете в том, что Far и подобные не являются средами разработки? Вы думаете люди об этом не знают? Как и о том, что Far является именно файловым менеджером, в котором дополнительно есть встроенный редактор и в силу опыта-возраста-привычки, мне гораздо удобней работать в Far по F5-F6, чем таскать файлики мышкой или открывать по 5 минут IDE, чтобы сделать с десяток правок.
                            0
                            Вы действительно не понимаете…
                            Не гордиться этим надо… Far только для «быстро подправить» годится, а не для разработки.
                              0
                              Мм… Не хочу оскорбить, но знал я одного такого любителя разрабатывать сложные проекты в Far.
                              Когда я увидел код у меня был такой шок. Я даже скриншот на память оставил. Копипаст-на копипасте и копипастом подгодняет. Все в одной мешанине, без разделения логик и представлений, а проект реально очень большой, там таких файлов штук 500. После этого я крайне отрицательно отношусь к таким людям. Мож я и неправ и судить по одному примеру нельзя…
                              З.Ы. сам юзаю Far. Но только как файловый менеджер, а не редактор кода!
                                +2
                                Себя же процитирую:
                                NetBeans использую для больших проектов

                                Far является именно файловым менеджером

                                Тоже не хочу никого оскорблять, но может прежде чем что-то отвечать людям, имеет смысл внимательней читать?
                    +1
                    Не, не один :) Правда, в последнее время подсел на сублим (настроил открытие файла на Alt+F3), но F4 уже ничем не выжечь, похоже: на автомате частенько её тычу… :)
                      +1
                      Нда, а у меня когда-то на Alt+F3 Hiew стоял… Старею, блин!
                      0
                      Я очень долго делал так же. Но сравнительно недавно всё-таки переполз в Sublime Text (не отказываясь от Far-а в остальном).
                      Far можно настроить под себя очень круто, но перелопатить всего придется для этого очень много. Например, тот же Colorer, который был прекрасным удобным плагином несколько лет назад, со временем превратился в какого-то монстра. И если стандартные схемы по каким-то причинам не устраивают, сотворить свою — очень долго и муторно. А старые использовать не получится, потому что автор уже не единожды менял формат файлов.
                        +2
                        Поддерживаю! Автор, таки где мой Блокнот?
                        +7
                        А где Stylus?
                          +3
                          Жаль что в списке редакторов нет vim.
                            +1
                            Ответа «Не использую фреймворки» явно не хватает и в опросе «Какой JavaScript MVC фреймворк вы используете?», где воздержавшихся больше участников.

                            Но теперь, возможно, добавлять его поздно уж.
                              0
                              С днем рождения и спасибо за эти дайджесты!
                                0
                                Приятно, что упомянули Матрешку, спасибо. Напомню, о ней можно прочесть в серии статей.
                                  +1
                                  В списке JS фреймворков (в опросе) с удивлением обнаружил отсутствие Knockout =(
                                    +2
                                    ;-) Аналогично по поводу Sails.js. Уже месяц как использую. Вот пример zornica(dot)tk. Да к тому же ещё яхтсменам нравиться :-)
                                    +6
                                    Надесь сильно ругать не будете, если я упомяну о своей opensource KodiCMS, которую разрабатываю около 2-х лет. Построена на базе kohana, twitter bootstrap 2.3, font awesome, elfinder, redactorjs, ace и т.д. Умеет почти все, что и другие CMS, возможно и больше, чем многие платные аналоги, поддерживает расширение с помощью плагинов, ядро kohana 3.3.2. Поддержка кеша с тегами sqlite, apc, mongodb, memcached. 3 драйвера хранения сессии, 3 драйвера подключения к бд (mysql, mysqli, pdo).

                                    Разрабатываю (верстаю, программирую php, js) в одиночку, надеюсь, что кому нибудь понравится и появится хоть небольшое, но сообщество.

                                    Есть демо сайт: demo.kodicms.ru
                                    Готов ответить на любые вопросы.
                                    +1
                                    Задняя часть звучит сильно!
                                      +1
                                      Недавно на хабре проскакивала ссылка на оптимизатор css для grunt обедняющий в себе несколько тузл, я тогда глянул и сохранил в планшете для последующего изучения. Так получилось что ссылку я потерял, сейчас не могу найти. Знает ли кто-то о чем речь? Скорее всего это было в серии статей блога «Zfort Group», но я пересмотрел уже с десяток и не могу найти.
                                        0
                                        В этом году Sencha выпустила в свет ExtJS 5. Думаю стоит упомянуть об этом «малоизвестном» фреймворке :-)
                                          0
                                          Для меня не хватает Emacs и Stylus :(
                                            +2
                                            А что это за язык программирования такой ASP? И кто те люди, что на нем программируют? ))
                                              0
                                              Может имелось ввиду ASP.NET.
                                                0
                                                В любом случае, это не язык программирования ))
                                                  0
                                                  Когда пишешь на C#\VB (или ещё на чём) под Web, не думаю, что найдётся человек, который будет писать это всё на чистом языке, так что технологию (комплекс) asp.net можно рассматривать как один из полноценных языков (скорее всего шарп).
                                                    0
                                                    Я уже давно включил режим зануды. После этого комментария отключу. ))
                                                    Так вот есть язык программирования, а есть различные фреймворки. В частности PHP — язык, а всякие Zend, Yii и т.д — фреймворки. В то же время C# — язык, а ASP.NET Web Forms и ASP.NET MVC — уже фреймворки.

                                                    PS: я в web-е не силен, но по миом представлениям JavaScript, CoffeeScript и TypeScript разделять в рамках опроса языка программирования не очень корркетно.
                                                      0
                                                      Вы действительно в вебе не сильны:
                                                      asp вполне можно называть языком (как и jsp и другие языки шаблонирования, в том числе PHP) программирования.
                                                      А CoffeeScript и TypeScript — языки, компилируемые в JS.

                                            Only users with full accounts can post comments. Log in, please.