Frontender Libs - обзор библиотек JS / CSS
Открыть в Telegram
Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront Купить рекламу: https://telega.in/c/sWebDev
Больше
7 361
Подписчики
-224 часа
-217 дней
-9230 дней
Архив постов
","datePublished":"2023-04-14T18:19:55Z","dateModified":"2023-04-14T18:20:05Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1}]}},{"@type":"ListItem","position":12,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2067","url":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2067","mainEntityOfPage":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2067","headline":"Toilet Paper Toggle Забавный переключатель для сайта, выполненный с использованием библиотеки Gsap.js. 👉 @sWe…","articleBody":"Toilet Paper Toggle\n\nЗабавный переключатель для сайта, выполненный с использованием библиотеки Gsap.js.\n\n👉 @sWebDev","datePublished":"2023-04-14T11:15:04Z","dateModified":"2023-04-14T11:15:04Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1373},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":13}]}},{"@type":"ListItem","position":13,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2066","url":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2066","mainEntityOfPage":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2066","headline":"Стать сотрудником Яндекса быстрее и проще, чем кажется. Участвуйте в днях быстрого найма: решите тестовое, пр…","articleBody":"Стать сотрудником Яндекса быстрее и проще, чем кажется. Участвуйте в днях быстрого найма: решите тестовое, пройдите несколько секций собеседования и получите офер за несколько дней.\n\nТеперь дни быстрого найма будут проходить регулярно. Чтобы вам было удобно следить за расписанием, собрали его на отдельной странице.\n\nБлижайшие мероприятия:\n\n• 20-22 апреля - Fast Track для frontend-разработчиков пишущих на JavaScript/TypeScript, офер за 3 дня в команду Поиска.\n• 27-28 мая - Weekend Offer для frontend-разработчиков, офер за 2 дня в команды Яндекса.\n\nЗарегистрироваться","datePublished":"2023-04-14T07:15:06Z","dateModified":"2023-04-16T07:21:59Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1021},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":1}]}},{"@type":"ListItem","position":14,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2065","url":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2065","mainEntityOfPage":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2065","headline":"NanoSQL NanoSQL - легковесная и быстрая база данных, которую можно использовать как в браузере, так и на серв…","articleBody":"NanoSQL\n\nNanoSQL - легковесная и быстрая база данных, которую можно использовать как в браузере, так и на сервере. Библиотека обладает множеством полезных функций, таких как индексы, транзакции, агрегирующие функции и т.д. NanoSQL поддерживает различные бэкэнды баз данных, включая IndexedDB, WebSQL, SQLite, LevelDB и другие.\n\n👉 @sWebDev","datePublished":"2023-04-13T13:00:40Z","dateModified":"2023-04-13T13:00:40Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1348},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":14}]}},{"@type":"ListItem","position":15,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2064","url":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2064","mainEntityOfPage":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2064","headline":" Разбираешься во Front-End? Мы создали уникальную игру для программистов прямо в браузер…","articleBody":"\nРазбираешься во Front-End?\n\n\n\nМы создали уникальную игру для программистов прямо в браузере с 3d миром будущего и с ревардами в криптовалюте.\n\nПиши код, развлекайся и зарабатывай TON, выполняя интересные задачи от уровня Junior до уровня Senior!\n\nПерейди по ссылке и исследуй мир TONight:\n👉 https://clck.ru/347ZX9 \n","datePublished":"2023-04-13T09:03:04Z","dateModified":"2023-04-15T09:03:59Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1050},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":11}]}},{"@type":"ListItem","position":16,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2063","url":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2063","mainEntityOfPage":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2063","headline":"Зачем и когда использовать ng-template в Angular? По ссылке обзор 3 полезных возможностей директивы .","datePublished":"2023-04-13T06:12:01Z","dateModified":"2023-04-13T06:12:01Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1316},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":8}]}},{"@type":"ListItem","position":17,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2062","url":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2062","mainEntityOfPage":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2062","headline":"GSAP 3 Radio Анимированное радио, выполненное с использованием библиотеки Gsap.js. 👉 @sWebDev","articleBody":"GSAP 3 Radio\n\nАнимированное радио, выполненное с использованием библиотеки Gsap.js.\n\n👉 @sWebDev","datePublished":"2023-04-12T06:52:00Z","dateModified":"2023-04-12T06:52:00Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1408},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":8}]}},{"@type":"ListItem","position":18,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2061","url":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2061","mainEntityOfPage":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2061","headline":"jsPDF jsPDF - это библиотека для генерации PDF-документов на стороне клиента. Она позволяет создавать PDF-фай…","articleBody":"jsPDF\n\njsPDF - это библиотека для генерации PDF-документов на стороне клиента. Она позволяет создавать PDF-файлы из HTML-страниц, изображений и других типов контента, поддерживает множество настроек и опций для создания настраиваемых документов. JsPDF не требует установки дополнительного программного обеспечения и может быть использована в любом современном браузере.\n\n👉 @sWebDev","datePublished":"2023-04-11T16:00:48Z","dateModified":"2023-04-11T16:00:48Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1375},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":35}]}},{"@type":"ListItem","position":19,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2060","url":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2060","mainEntityOfPage":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2060","headline":"Можно бесконечно смотреть на три вещи: как течет вода, горит огонь и фронтендеры пилят монолит Ребята из банд…","articleBody":"Можно бесконечно смотреть на три вещи: как течет вода, горит огонь и фронтендеры пилят монолит\n\nРебята из банды фронтендов TeamSnack решили раз и навсегда разобраться в подходах к микросервисам. Сравнивать будут Single-spa(SystemJS) и Webpack Module Federation. Обещают живое общение с едой и напитками, а также интерактив в Miro с рабочими схемами, которые можно потом протестировать в работе. \n\nКогда: 14 апреля, 19:00 - 21:00\n\nГде: ценители ламповой атмосферы могут приехать в офис Cloud (Москва, 2-я Звенигородская улица, 28), а для закоренелых удаленщиков доступен онлайн-формат в Telegram-канале сообщества.\n\nВсе детали можно узнать у самой команды TeamSnack: https://t.me/+b_H0dbC85dsyM2Qy\n\nРеклама. Рекламодатель: ООО «Облачные технологии». erid: LatgBqAA4","datePublished":"2023-04-11T12:01:10Z","dateModified":"2023-04-13T12:21:57Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1041},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":1}]}},{"@type":"ListItem","position":20,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2059","url":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2059","mainEntityOfPage":"https://telemetr.io/ru/channels/1215276433-swebdev/posts/2059","headline":"Встраивание WebGL в HTML-страницу с помощью Three.JS В статье рассмотрим совмещение WebGL‑анимации с прокрутк…","articleBody":"Встраивание WebGL в HTML-страницу с помощью Three.JS\n\nВ статье рассмотрим совмещение WebGL‑анимации с прокруткой страницы HTML, используя библиотеку Three.js. Работа с ней во многом схожа с работой 3D‑редактора. Для получения результата в виде картинки или анимации необходимо создать сцену, поместить в нее камеру, создать примитив (геометрию или 3D‑модель), создать источник освещения и запустить процесс рендеринга.\n\n👉 @sWebDev","datePublished":"2023-04-11T07:23:00Z","dateModified":"2023-04-11T07:23:00Z","author":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"publisher":{"@type":"Organization","name":"Frontender Libs - обзор библиотек JS / CSS","url":"https://telemetr.io/ru/channels/1215276433-swebdev","image":"https://img.telemetr.io/c/1kfaUN/5240031659749914258?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1289},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":13}]}}]}
Anonymous voting
Alien Abduction
Анимированная сцена, выполненная с использованием библиотеки GSAP.js.
👉 @sWebDev
React Spectrum
Компонентная библиотека от Adobe, созданная для создания современных пользовательских интерфейсов веб-приложений. Библиотека предлагает набор готовых компонентов тем и API, которые могут быть использованы в любом React-проекте. React Spectrum используют в Adobe Creative Cloud и других продуктах Adobe.
👉 @sWebDev
Пишите хорошие тесты без stub/mock и заглушек маршрутизатора
В статье описаны методы тестирования Angular компонентов без использования стаб(stub), мок(mock) и заглушек для маршрутизатора. Авторы предлагают использовать реальный маршрутизатор и специальный класс, который позволяет создавать тестовые модули с минимальной конфигурацией. Это позволяет существенно упростить процесс написания тестов и повысить их точность.
👉 @sWebDev
React Monochromatic Landscape Generator
Генератор ландшафта, выполненный с помощью SCSS, SVG и Babel.js.
👉 @sWebDev
❔❔ JS-разработчик?
А насколько хорошо ты знаешь Vue.js? JS-разработчик? А насколько хорошо ты знаешь Vue.js?
✔️ Пройди тест из 20 вопросов и узнай, сможешь ли ты учиться на курсе "Vue.js Developer" от OTUS. Если правильно ответишь хотя бы на 12 вопросов - сможешь поступить на курс по специальной цене!
⏰ Время прохождения теста ограничено 30 минут
✍️ПРОЙТИ ТЕСТ: https://otus.pw/gVmC/
Курс доступен в рассрочку.
🎁 Пройдете успешно тест, получите доступ к открытым урокам курса.
Реклама. Информация о рекламодателе на сайте www.otus.ru
Возврат отложенной версии переданного значения React
Рассмотрим грядущее изменение, которое появится в React 18. Хук
useDeferredValue вернет отложенную версию переданного значения, которая будет “отставать” от исходной на время, равное таймауту:
import { useDeferredValue } from "react";
// ...
const [text, setText] = useState("text");
const deferredText = useDeferredValue(text, { timeoutMs: 2000 });
👉 @sWebDevLi´l Vikings
Анимированная сцена, выполненная с использованием Gsap.js.
👉 @sWebDev
Инструмент для того, чтобы отложить загрузку компонента React?
Как отложить загрузку компонента React?
Каким инструментом React воспользоваться для того, чтобы отложить загрузку компонента до момента, когда он будет необходим для отображения?
👉 @sWebDev
Часто используемые шаблоны проектирования в Angular
Обзор нескольких распространенных паттернов проектирования в Angular, таких как Singleton, Facade, Observer и других. Материал описывает, как использовать каждый паттерн и какие преимущества он может принести в разработке приложений.
👉 @sWebDev
Получение доступа к реактивным данным и активным событиям Vue.js
В хуке
created вы сможете получить доступ к реактивным данным и активным событиям. Шаблоны и виртуальный DOM ещё не встроены (mounted) и не отрисованы.
Например:
ExampleComponent.vue
<script>
export default {
data() {
return {
property: 'Blank'
}
},
computed: {
propertyComputed() {
console.log('I change when this.property changes.')
return this.property
}
},
created() {
this.property = 'Example property update.'
console.log('propertyComputed will update, as this.property is now reactive.')
}
}
</script>Toilet Paper Toggle
Забавный переключатель для сайта, выполненный с использованием библиотеки Gsap.js.
👉 @sWebDev
Стать сотрудником Яндекса быстрее и проще, чем кажется. Участвуйте в днях быстрого найма: решите тестовое, пройдите несколько секций собеседования и получите офер за несколько дней.
Теперь дни быстрого найма будут проходить регулярно. Чтобы вам было удобно следить за расписанием, собрали его на отдельной странице.
Ближайшие мероприятия:
• 20-22 апреля - Fast Track для frontend-разработчиков пишущих на JavaScript/TypeScript, офер за 3 дня в команду Поиска.
• 27-28 мая - Weekend Offer для frontend-разработчиков, офер за 2 дня в команды Яндекса.
Зарегистрироваться
NanoSQL
NanoSQL - легковесная и быстрая база данных, которую можно использовать как в браузере, так и на сервере. Библиотека обладает множеством полезных функций, таких как индексы, транзакции, агрегирующие функции и т.д. NanoSQL поддерживает различные бэкэнды баз данных, включая IndexedDB, WebSQL, SQLite, LevelDB и другие.
👉 @sWebDev
<head>
Разбираешься во Front-End?
</head>
<body>
Мы создали уникальную игру для программистов прямо в браузере с 3d миром будущего и с ревардами в криптовалюте.
Пиши код, развлекайся и зарабатывай TON, выполняя интересные задачи от уровня Junior до уровня Senior!
Перейди по ссылке и исследуй мир TONight:
👉 https://clck.ru/347ZX9
</body>
Зачем и когда использовать ng-template в Angular?
По ссылке обзор 3 полезных возможностей директивы
<ng-template>.GSAP 3 Radio
Анимированное радио, выполненное с использованием библиотеки Gsap.js.
👉 @sWebDev
jsPDF
jsPDF - это библиотека для генерации PDF-документов на стороне клиента. Она позволяет создавать PDF-файлы из HTML-страниц, изображений и других типов контента, поддерживает множество настроек и опций для создания настраиваемых документов. JsPDF не требует установки дополнительного программного обеспечения и может быть использована в любом современном браузере.
👉 @sWebDev
Можно бесконечно смотреть на три вещи: как течет вода, горит огонь и фронтендеры пилят монолит
Ребята из банды фронтендов TeamSnack решили раз и навсегда разобраться в подходах к микросервисам. Сравнивать будут Single-spa(SystemJS) и Webpack Module Federation. Обещают живое общение с едой и напитками, а также интерактив в Miro с рабочими схемами, которые можно потом протестировать в работе.
Когда: 14 апреля, 19:00 - 21:00
Где: ценители ламповой атмосферы могут приехать в офис Cloud (Москва, 2-я Звенигородская улица, 28), а для закоренелых удаленщиков доступен онлайн-формат в Telegram-канале сообщества.
Все детали можно узнать у самой команды TeamSnack: https://t.me/+b_H0dbC85dsyM2Qy
Реклама. Рекламодатель: ООО «Облачные технологии». erid: LatgBqAA4
Встраивание WebGL в HTML-страницу с помощью Three.JS
В статье рассмотрим совмещение WebGL‑анимации с прокруткой страницы HTML, используя библиотеку Three.js. Работа с ней во многом схожа с работой 3D‑редактора. Для получения результата в виде картинки или анимации необходимо создать сцену, поместить в нее камеру, создать примитив (геометрию или 3D‑модель), создать источник освещения и запустить процесс рендеринга.
👉 @sWebDev
