Frontender Libs - обзор библиотек JS / CSS
8.46K subscribers
2.02K photos
735 videos
2 files
239 links
Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront

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

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

Это CSS-библиотека, которая упрощает стилизацию HTML, тем же путем, как это делает Bootstrap, – добавляя огромное количество разнообразных классов. Но, в отличие от Bootstrap, который добавляет уже готовые к употреблению компоненты, такие как кнопки, алерты и навбары, классы TailwindCSS нацелены на конкретное свойство. В TailwindCSS нет заранее написанной кнопки, её ты должен сделать сам.

👉 @sWebDev
iView

Это высококачественный набор инструментов для компонентов пользовательского интерфейса, созданный на основе Vue.js. Он был создан TalkingData для настройки тем, многоязычного развертывания и других функций, что значительно повысило эффективность разработки.

👉 @sWebDev
Angular Google Maps

Использование библиотеки Google Maps в Angular всегда является серьезной проблемой, потому что библиотека загружается с использованием тега script, поэтому могут возникать некоторые ошибки компиляции, исправление которых может потребовать большого количества времени.

Эта библиотека решает все проблемы за вас и предоставляет удобный интерфейс для взаимодействия с google maps.

👉 @sWebDev
Nuxt.js

Это фреймворк для создания универсальных приложений на Vue.js с использованием Node.js. С помощью него можно рендерить UI на сервере и генерировать статические сайты.

👉 @sWebDev
💥Два дня живого общения на конференции FrontendConf 2021

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

Программа конференции построена вокруг 6 тематик:
— архитектура и организация кодовой базы;
— The Frontend Operations Engineer;
— хорошие практики современного фронтенда;
— профессиональный, карьерный и социальный рост;
— взгляд со стороны (собеседования, команды, развитие);
— будущее (перспективы развития нашей сферы, недавние изменения и размышления о красоте вещей).

🔥И все это офлайн! Место и время встречи — Москва, Radisson Slavyanskaya, 11-12 октября.

По ссылке можно прочитать подробнее о конференции, изучить программму и забронировать билет 👉 https://clck.ru/XZLdg

Также уже открыт плейлист докладов прошлого года, где многие из тем актуальны до сих пор 👉https://clck.ru/XRjNv
ngx-translate

В какой-то момент вашему веб-приложению может потребоваться обслуживание многоязычной базы пользователей. Интернационализация, или, если коротко, i18n, - это процесс, с помощью которого вы можете сделать ваше приложение пригодным для использования на другом родном языке. Хотя Angular обладает некоторой встроенной функциональностью i18n, ngx-translate - это сторонний пакет, который упрощает процесс.

👉 @sWebDev
✏️ Вопрос из канала «Web Interview»:
В чем разница между null и undefined?

  Ответ:
 В JavaScript undefined означает, что переменная была объявлена, но ей еще не присвоено значение, например:

let a;
alert(a); //выведет undefined
alert(typeof a); //выведет undefined

null - это значение присваивания. Он может быть присвоен переменной, как представление без значения (когда разработчик решает, что значение пока что не определено):

let a = null; //разработчик сам присвоил null
alert(a); //выведет null
alert(typeof a); //выведет object

📌 Из предыдущих примеров ясно, что undefined и null являются двумя различными типами: undefined - это сам тип (неопределенный), а null - объект.

null === undefined // false
null == undefined // true
null === null // true

Хочешь быть готовым к вопросам на собеседовании? — подпишись на канал  «Web Interview»!

• Здесь ежедневно публикуются реальные вопросы по фронту и бэку с собеседований российских IT компаний.

• И еще! Канал ведет действующий Fullstack разработчик.
Mint UI

Это библиотека мобильных компонентов, созданных на CSS и JS, которые могут быть использованы для создания мобильных приложений. Использование этой библиотеки поможет вам еще быстрее создавать веб-страницы в едином стиле.

👉 @sWebDev
Keen UI

Библиотека Keen-UI, хотя её разработчики явно черпали идеи из уже не раз упомянутой на этом канале концепции Material Design, не является настоящим набором Material-компонентов. В её состав входят только компоненты, использующие JavaScript, она не является CSS-фреймворком и не включает в себя систему работы с сеткой или типографские стили.

👉 @sWebDev
This media is not supported in your browser
VIEW IN TELEGRAM
Hover

Это CSS-библиотека. Hover — сборка эффектов наведения на CSS3, которые будут применяться к ссылкам, кнопкам, логотипам, SVG, избранным изображениям и т. д. Эффекты доступны на CSS, Sass и LESS. Вы можете копировать и вставлять эффект, который вы хотите использовать в своей таблице стилей, или ссылаться на таблицу стилей библиотеки.

👉 @sWebDev
This media is not supported in your browser
VIEW IN TELEGRAM
Запомните: айти в 2021 году – самая перспективная ниша.

1. Выучить «базу» 2-3 языков можно за месяц, даже если вы чайник.

2. Тысячи компаний платят новичкам от $800.

3. Из-за высокого спроса вы найдете работу за 1-2 недели.

Освоить всё с нуля поможет канал Frontend. Уроки по JavaScript, CSS, HTML и советы для собеседований. Впитываете знания – уверенно проходите интервью – получаете работу.

Ребята скомпоновали всё так, что влиться в процесс сможет каждый. Стартуйте сейчас: @frontendInterview
BootstrapVue

Эта библиотека предназначена для создания отзывчивых веб-приложений, при разработке которых ориентируются, в первую очередь, на мобильные платформы. Библиотека построена на базе Vue и Bootstrap 4. Она предназначена для Vue 2.4+, в ней реализована автоматическая разметка WAI-ARIA, направленная на создание веб-проектов, с которыми удобно работать людям с ограниченными возможностями.

👉 @sWebDev
This media is not supported in your browser
VIEW IN TELEGRAM
Velocity

Velocity — это быстрый механизм анимации Javascript с тем же API, что jQuery $.animate(). Он включает в себя цветную анимацию, преобразования, смягчения, поддержку SVG и анимацию прокрутки.

👉 @sWebDev
В команду Юлы нужен DevOps-инженер!

Наш идеальный кандидат на «ты» с Kubernetes, любит новые и интересные технологии, хочет их внедрять и применять. Большим плюсом будет опыт из смежных направлений разработки и широкий кругозор, ведь задачи могут быть самые разные – и трафик поанализировать, и подебажить упавшую сборку, и помочь коллегам с внедрением CI-инструментов.
Если тебе это интересно, ищи подробности (стек, требования, условия) по ссылке.
Fish-UI

Fish-UI — это набор инструментов для веб-разработки, использующий возможности WebPack и ES2015. Несмотря на скудную документацию, библиотека Fish-UI достойна внимания, так как содержит в себе более 35-ти хорошо структурированных компонентов, позволяющих создавать простые и понятные интерфейсы, не перегруженные ненужными деталями.

👉 @sWebDev
Компоненты React от Khan Academy

Компоненты React, подготовленные силами Khan Academy, выпущены в виде библиотеки компонентов, в которой используется встроенный CSS и имеются комментарии. Отдельные компоненты библиотеки можно установить, воспользовавшись этой подборкой, созданной средствами Bit.

👉 @sWebDev
Angular Material

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

У NG Bootstrap, популярной библиотеки, в которую входят компоненты для Angular, выполненные в стиле Bootstrap 4, около 4.5 тысячи звёзд на GitHub. Она служит заменой Bootstrap-проекту angular-ui, который больше не поддерживается. NG Bootstrap отличается высоким уровнем покрытия кода тестами и отсутствием сторонних JS-зависимостей.

👉 @sWebDev
Clarity

Clarity — это опенсорсная система дизайна, созданная VMware. Она представляет собой комбинацию из реализации рекомендаций по UX-дизайну, HTML/CSS фреймворка и компонентов для Angular. Clarity даёт разработчику обширный набор высокопроизводительных компонентов с привязкой данных.

👉 @sWebDev
NG2 Charts

Библиотека NG2 Charts, имеющая около тысячи звёзд на GitHub, даёт разработчику директивы Angular для создания графиков шести типов, при этом используемые здесь свойства основаны на chart.js. Эту библиотеку можно использовать для визуализации больших наборов данных и вывода списков.

👉 @sWebDev