Frontender Libs - обзор библиотек JS / CSS
8.48K subscribers
2.02K photos
734 videos
1 file
237 links
Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront

Менеджер по рекламе: @Spiral_Yuri

Купить рекламу: https://telega.in/c/sWebDev
Download Telegram
Ring UI

Неплохая библиотека компонентов React от всеми известной JetBrains. Имеется большой набор компонентов среди которых есть действительно уникальные и полезные «штуки». Все компоненты имеют фирменный стиль JetBrains.

👉 @sWebDev
Wired elements

Wired elements — это коллекция элементов, нарисованных вручную. Разработанные для вайрфреймов, элементы нарисованы таким образом, что два элемента визуализации не могут быть одинаковы — как две отдельные нарисованные от руки формы. Полезно? Возможно. Круто? Определенно:).

👉 @sWebDev
SurveyJS

Помогает разработчикам создавать настраиваемые опросы и квизы, которые можно интегрировать с любыми приложениями JavaScript (JS).

Возможности:
1. Расширение опросов с помощью сторонних виджетов;
2. Интеграция с любыми приложениями;
3. Создание опросов для сопровождения элементов бренда веб-сайта.

👉 @sWebDev
Final Form

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

Функции:
1. Совместима со всеми веб-фреймворками;
2. Полноценная и расширяемая реализация;
3. Автономность.

👉 @sWebDev
Redux

Обычно используется вместе с JavaScript-фреймворками, такими как Angular и React. Помогает решить проблему нехватки данных поддержкой предсказуемого состояния приложений, когда их размер в производственном процессе становится огромным.

👉 @sWebDev
Angular Material

Это официальная библиотека компонентов Angular, в которой реализованы концепции Material Design от Google. Эти компоненты пользовательского интерфейса можно рассматривать как примеры кода, написанные в соответствии с рекомендациями команды разработчиков Angular.

👉 @sWebDev
DropzoneJS

Позволяет создавать окна загрузки файлов с помощью технологии drag-and-drop. Есть возможности для создания превью изображений, превью файлов и анимации выполнения процесса.

Преимущества:
1. Не имеет внешних зависимостей;
2. Возможность настройки под конкретные нужды.

👉 @sWebDev
NGX Bootstrap

Библиотека NGX Bootstrap набрала около 5 тысяч звёзд на GitHub. В ней можно найти базовые компоненты, реализующие возможности шаблона Bootstrap и написанные для Angular, да и не только их. Она подходит для разработки настольных и мобильных приложений и спроектирована с учётом расширяемости и адаптивности.

👉 @sWebDev
Typeahead.js

Библиотека с открытым исходным кодом. Обеспечивает автозаполнение для окон поиска и других текстовых полей на веб-сайтах. Состоит из двух компонентов — механизма предложений и UI-элемента.

Ключевые функции:
1. Компоненты библиотеки можно использовать отдельно модульно;
2. Обширная библиотека для каждого компонента;
3. Поддержка всех десктопных браузеров (не для мобильных).

👉 @sWebDev
Prime NG

Это библиотека, включающая в себя обширный набор из более чем 70-ти компонентов пользовательского интерфейса. При этом здесь доступны разные виды их стилизации, например — Material Design и Flat Design. Ей пользуются такие компании, как eBay, Fox, и многие другие. Всё это говорит о том, что данная библиотека достойна внимания тех, кто ищет подходящий набор компонентов для своего проекта.

👉 @sWebDev
ApexChart

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

Функции:
1. Оболочки для популярных фреймворков, таких как React, Vue и Angular;
2. Обширная документации и кроссбраузерная поддержка;
3. Единый и простой в использовании API.

👉 @sWebDev
Сколько времени учатся на фронтендера с нуля?

От 6-ти месяцев. Вот несколько правил, с которыми сделать это будет проще:

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

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

Можно выбрать готовое решение - Профессия Frontend-разработчик PRO от Skillbox.

Курс разработан грамотно и проверен на тысячах студентов.

В него входят:
- 3 месяца бесплатного периода;
- изучение React, Vue
- гарантия трудоустройства;
и многое другое.

Летняя скидка - 40%
NG-ZORRO

Компоненты из библиотеки NG-ZORRO написаны на TypeScript с полной типизацией. Цель этого проекта — дать разработчикам высококлассные компоненты для создания пользовательских интерфейсов в стиле Ant Design. Эта интересная библиотека создана китайскими разработчиками, на GitHub у неё около 2 тысяч звёзд.

👉 @sWebDev
Ext JS

Ещё пару лет назад этот продукт бил все рекорды популярности у опытных разработчиков, заслуженно завоевав их уважение. Был даже период, когда Sencha Ext JS был безраздельным властелином на рынке UI библиотек.

👉 @sWebDev
Meanderer

Маленькая библиотека JavaScript для создания отзывчивых траекторий анимации. Перед началом работы автор Meanderer рекомендует воспользоваться SVGOMG.

👉 @sWebDev
amCharts

amCharts — одна из JavaScript библиотек, полезных тем, кто ищет простое и в то же время гибкое решение для визуализации данных.

Основные возможности
1. Много разнообразных типов графиков, включая интерактивные карты и диаграммы Ганта.
2. Возможность анализа данных «вглубь» (дрилдаун) и другие хорошо проработанные интерактивные опции.
3. Документация, описывающая все нужные методы, хорошо написана, правда, на мой вкус, не слишком удобна в использовании.
4. Крутая анимация графиков.
5. Интеграция с React, Angular, Vue, Ember и др.
6. Готовый плагин для WordPress.
7. Экспорт графиков в изображение или PDF файл.

👉 @sWebDev
MoreToggles.css

Библиотека на чистом CSS со множеством приятных глазу переключателей.

👉 @sWebDev
Plotly.js

Plotly.js — это библиотека JavaScript высокого уровня, бесплатная, с открытым исходным кодом. Построена на D3.js и WebGL. Ее можно использовать для создания множества самых разных типов визуализации данных, включая, например, трехмерные статистические графики.

👉 @sWebDev
Halfmoon

Интерфейсный фреймворк со встроенным тёмным режимом и полной настраиваемостью с использованием переменных CSS; отлично подходит для панелей мониторинга и инструментов.

👉 @sWebDev
Luxon

Библиотека Luxon заявлена как мощное, современное и удобное средство для работы с датами и временем в JavaScript. Библиотеку создал Айзек Камброн (Isaac Cambron), входящий в команду разработчиков Moment с 2013 года.

👉 @sWebDev