Share This
Связаться со мной
Крути в низ
Categories
//25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

На «ванильном» JavaScript сейчас почти никто не пишет, но кроме мощных фреймворков есть и небольшие библиотеки с интересными возможностями. В наш список попали наиболее полезные из них, часто применяемые веб-разработчиками. Обсудить

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 5dffcdc - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Для решения часто повторяющихся задач программисты на JavaScript часто используют ujnjdst библиотеки кода. Они упрощают создание интерфейса, а также помогают добавить на сайт мощную функциональность. Из огромного числа рабочих идей и готовых решений мы отобрали наиболее полезные и популярные инструменты.

Algolia Places

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat a60c604 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Algolia Places – библиотека JavaScript для автоматического заполнения форм. Она специализируется на адресах, может добавить карту в поиск и отобразить местоположение. Удивительно точная и сверхбыстрая библиотека повысит удобство работы пользователей с сайтом.

Anime.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 6d94adf - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Анимация и микровзаимодействия сейчас в тренде. Anime.js добавит на сайт немного движения. Библиотека работает с CSS, SVG, атрибутами DOM и объектами JavaScript, что делает ее идеальной практически для любого проекта.

AOS – Animate On Scroll

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat d3536c7 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Работаете над одностраничным сайтом с эффектом parallax? Animate on Scroll добавит приятную анимацию при прокручивании страницы. Эта библиотека поможет вам создать привлекательный дизайн: в ней есть все, от эффектов затухания, до размещения статических привязок.

Bideo.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 3cc0ee0 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Полноэкранные видео служат отличным фоном для сайта. Bideo.js – библиотека JavaScript для добавления видеофона, который хорошо смотрится на экране любого размера и плавно масштабируется. Если хотите увидеть, как она работает, кликните сюда.

Chart.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 80b48ba - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Chart.js – библиотека для дизайнеров и веб-разработчиков, позволяющая добавлять на сайт красивые диаграммы различных типов. Есть возможность смешивать их, чтобы получить действительно интересный набор данных.

Choreographer-js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 57379ac - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Choreographer-js – простая библиотека JavaScript для анимации CSS. Ее легко использовать, и она действительно поможет вам создать для сайта сложную CSS-анимацию. Кликните сюда, чтобы увидеть красочный пример использования библиотеки и узнать, как начать работу.

Cleave.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 87c3724 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Вы когда-нибудь использовали поле формы, которое бы форматировало контент во время набора текста? Например, чтобы превратить 1234567890 в номер телефона с международным кодом: (123) 456-7890. Cleave.js – библиотека JavaScript, позволяющая добавить на сайт подобные функции.

D3.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat edac863 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

D3.js – набор инструментов для визуализации данных. Состоит он из небольших модулей, каждый из которых решает отдельную задачу. Есть модули для построения различных фигур, для работы с элементами на странице (простой аналог jQuery), для загрузки данных (аналог fetch/$.ajax, заточенный под форматы csv, json, xml и т.д.), для форматирования/масштабирования данных и множество других. При помощи D3.js вы сможете, к примеру, создавать HTML-таблицы или интерактивные диаграммы SVG.

Glimmer

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 66061e1 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Отличная библиотека, которая помогает при работе с компонентами пользовательского интерфейса и отрисовкой DOM. Она построена на базе Ember CLI и использует Git, Node.js, npm и Yarn. Если вы ищете инструмент для создания компонентов и хотите оптимизировать процесс работы с ними, обратите внимание на Glimmer.

Granim.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 0ffe353 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Украсьте фон своего сайта красочным градиентом с помощью Granim.js. Эта небольшая библиотека JavaScript идеально подходит для добавления плавных и интерактивных градиентов. Их можно использовать независимо от других элементов, можно также закрыть ими изображение или разместить их под графической маской.

Multiple.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat b1f17bc - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Если вы занимаетесь созданием интересных фоновых изображений, обязательно стоит попробовать Multiple.js. Библиотека позволяет использовать фоновое изображение для нескольких элементов с помощью CSS, что создает действительно интересный визуальный эффект. На сайте разработчиков доступна демонстрация возможностей продукта.

Garlic

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 8c637d5 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Плагин jQuery, хранящий значения формы при помощи HTML5 LocalStorage. Чем длиннее форма, тем больше вероятность необходимости повторного ее заполнения в случае сбоя. Плагин помогает пользователю избежать подобной ситуации.

Parsley

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 15f1591 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Если ваш проект включает формы, попробуйте Parsley. Библиотека также прекрасно работает с Garlic.

Popper.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 100691b - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Эта библиотека JavaScript поможет вам создать на сайте красивые попперы. Если вам интересно, что такое поппер, вспомните коммиксы. Когда герой о чем-то думает, из его головы вырывается маленький пузырь мыслей. Popper.js предлагает несколько способов упорядочить эти мысли, привязать к элементам и обеспечить их работу на экране любого размера.

Premonish

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat d232679 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Premonish – библиотека JavaScript, которая анализирует движение курсора и предсказывает, с каким элементом пользователь будет взаимодействовать дальше. Это позволяет применить на сайте интересные триггеры анимации и помогает выделить некоторые призывы к действию.

Slick

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat ec1941d - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

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

TaffyDB

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 1a1b3a2 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Если вы работаете с данными в JavaScript, вам понравится TaffyDB. Эта библиотека привносит в ваш код функциональность базы данных.

TweenJS

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat f0b4073 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Эта часть пакета CreateJS невероятно эффективна для создания анимации на HTML и JavaScript.

Three.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 98eb4b0 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Three.js – действительно интересная библиотека JavaScript для интересующихся трехмерным дизайном. Посмотрите сайт Paper Planes – там можно бросать бумажные самолетики с помощью телефона. Больше созданных с помощью Three.js проектов вы найдете здесь.

Voca

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat dfe9f64 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Voca упрощает работу со строками, предлагая полезные функции, вроде изменения регистра, обрезки и усечения. Библиотека разбита на несколько модулей, что позволяет работать с отдельными ее функциями.

ESLint

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat aae0857 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Выявляйте ошибки в коде с помощью этой подключаемой утилиты, специально созданной для JavaScript и JSX. Вы можете узнать больше о ее возможностях здесь.

Shave

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat ef83a37 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Используя заданную максимальную высоту, этот плагин JavaScript обрезает оставшийся текст, чтобы он поместился в элементе HTML. При этом текст сохраняется в скрытом элементе <span>, т.е. вы его не потеряете.

StencilJS

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat f3c1c88 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Stencil сочетает лучшие концепции самых популярных интерфейсных фреймворков для создания веб-компонентов, которые работают в любом современном браузере. Это просто, быстро и надежно.

Overlay Scrollbars

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat ae00b54 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

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

iziModal

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 9bc9b4c - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Когда вам нужно уведомить о чем-то пользователей или запросить у них информацию, лучшим решением иногда является всплывающее модальное окно. Благодаря этому легкому плагину jQuery его очень легко добавить на сайт. iziModal предлагает несколько вариантов окон и имеет множество настроек.

Microlight.js

25 poleznyh plaginov i bibliotek javascript o kotoryh vy mozhete ne znat 42a6784 - 25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

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

***

Выложившим эти прекрасные инструменты в открытый доступ – огромный респект. Всегда полезно иметь в своем арсенале набор небольших готовых решений: такой подход экономит время и помогает сосредоточиться на более важных задачах. Сохраняйте библиотеки в закладки и активно ими пользуйтесь. Удачи!

  • 9 views
  • 0 Comment

Leave a Reply

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

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.

Связаться со мной
Close