Библиотека фронтендера | Frontend, JS, JavaScript, React.js, Angular.js, Vue.js
23.2K subscribers
2.2K photos
120 videos
38 files
4.61K links
Все самое полезное для фронтенда в одном канале.

По рекламе: @proglib_adv

Учиться у нас: https://proglib.io/w/77178ed4

Наши каналы: https://yangx.top/proglibrary/9197

РКН: https://gosuslugi.ru/snet/67a5b6884689c2151c820bb4
加入频道
Привет, Чувак на связи.

Веду канал с вакансиями в IT без херни.

Лично отбираю вакансии - никакой херни.
Вакансии краткие и по делу - никаких полотен в два экрана.
Только две вакансии в день - никакого спама, я уважаю своих читателей.
Все вакансии имеют стандартизированный вид - никакого хаоса.
Заставляю эйчаров переписывать вакансии по 10 раз - никаких дружных коллективов.
Правильный ответ: 3

1: Для тега aside по умолчанию используется role=complementary, не имеет смысла дублировать
2: Не следует радикально изменять нативную семантику тегов
4: У обычного текстового поля нет состояния aria-checked
5: Для скрытого input нет доступных ARIA-ролей
6: Для обозначения недоступности кнопок следует использовать нативный атрибут disabled

Что такое ARIA?
Узнать: https://prglb.ru/ds7n

#accessibility #aria
Библиотека фронтендера | Frontend, JS, JavaScript, React.js, Angular.js, Vue.js pinned «​​Фильм Microsoft Build 2020: главные новинки IT-индустрии Рассказ и видео о последних новинках от компании Microsoft. Суперкомпьютеры, безопасное машинное обучение, Learn TV, Fluid Framework и многое другое – будьте в курсе инноваций! https://proglib.io/sh/RSsI59cBpz»
Интеграция Typescript в существующее VueJS приложение

Три шага для внедрения типизированного JS в ваш проект!

Читать: https://prglb.ru/1r9em

#frameworks #vue #typescript #tools
Шаблоны верстки email-рассылок

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

Тут есть базовый каркас письма, колонки, оформление текста, кнопок и т.д. Бонусом - подробные объяснения, для чего нужно каждое правило.

Забрать себе: https://www.goodemailcode.com/

#html #email #bestpractices
11 распространенных заблуждений о микрофронтендах

Развенчиваем популярные мифы, которые мешают составить правильное представление о технологии:

- о том, что нужен JavaScript и куча разных фреймворков
- о разделении компонентов и обмене данными
- об отладке, микросервисах и монорепозиториях

Читать: https://prglb.ru/4b7h3

#microfrontends
CSS анимация

Плейлист от Виталия Менчуковского, посвященный анимации в CSS: https://prglb.ru/3w5u7

#video #css #animation
Правильный ответ li:nth-child(-n + 2)

В функции nth-child можно использовать отрицательный множитель для параметра n. Таким образом, условию будут соответствовать только элементы с индексами 1 и 2.

Еще несколько дельных советов по CSS: https://prglb.ru/zssn
Итераторы, генераторы и протокол итерации в JavaScript

Статья рассказывает:
- как происходит итерация по умолчанию строк, массивов и других структур под капотом (спойлер: с помощью итераторов)
- как написать кастомный итератор, чтобы итерировать все, что угодно
- что такое функции-генераторы и нужны ли они разработчику

Читать: https://prglb.ru/pe6e

#javascript #core
Шпаргалка по SEO для разработчиков и веб-мастеров

29 пунктов, которые обязательно нужно проверить до и после запуска сайта!

Читать: https://dev.to/pagely/seo-cheat-sheet-for-devs-5h1g

#seo
Утечки памяти в веб-приложениях

Откуда берутся - и как бороться?

Когда код вашего приложения выполняется на клиентской стороне, нужно заботиться о ресурсах устройства, на котором он работает. Утечки могут съесть целые гигабайты памяти - за это пользователь вам спасибо не скажет!

Читать: https://prglb.ru/vbc2

#browser #performance #bestpractices #javascript
Проблемы с тултипами - и чем их заменить

Тултип - это достаточно спорный паттерн веб-дизайна. В статье разобрано 6 аргументов против их использования и 3 паттерна, которые могут успешно заменить всплывающие подсказки.

Читать: https://adamsilver.io/articles/the-problem-with-tooltips-and-what-to-do-instead/

#interface
​​Сегодня недооценивают проблему конфиденциальности с «тыла». Никто из нас не застрахован от того, что под давлением мы будем вынуждены показать переписку с рук. В роли принуждающего может быть кто угодно, начиная от злоумышленника и заканчивая пограничником, в любой точке мира.

Ни один из популярных мессенджеров не имеет защиты от подобной «атаки». Ребята из Postuf предлагают тебе исправить эту ситуацию на основе открытого кода Telegram. Если твое решение окажется лучшим, то ты получишь 5000$. Твоей задачей будет разработать принцип «двойного дна» в оригинальном клиенте Telegram.

Идея «двойного дна» заключается в том, что юзер, будучи под давлением, мог бы открыть Telegram и показать пустой аккаунт, где нет важных переписок. При этом злоумышленник не поймет, что ему показали лишь один из нескольких аккаунтов, скрытых в мессенджере.

Подробности об участии здесь: https://yangx.top/postuf/17
🕵️ Puppeteer: парсинг сайтов с JavaScript

Библиотека Puppeteer позволяет создавать веб-скраперы, имитирующие действия пользователя на странице.

Читать: https://prglb.ru/4o5mg

#javascript #parsing #browser #tools
Вакансия: Front-end разработчик в Tilda (офис / Москва)
Компания: Tilda Publishing — платформа для создания сайтов, интернет-магазинов или посадочных страниц.

👨‍🎓 Спектр задач: В Тильде есть несколько направлений, которые мы рассматриваем как внутренние продукты. Одним из них является Библиотека блоков. Мы ищем разработчика, который будет заниматься созданием новых блоков и поддержкой существующих, а также развитием нашего внутреннего фреймворка для их создания.

📌 От кандидата мы ожидаем:
- Отличные знания HTML, CSS, JS
- Опыт кроссбраузерной и адаптивной верстки
- Базовые знания Git
- Технический английский
- Умения разбираться в чужом коде и писать читаемый код
- Внимание к UX, желание создавать удобные интерфейсы
- Навык расставлять приоритеты и самостоятельно доводить задачи до финальной стадии

Ссылку на резюме и сопроводительное письмо отправлять на [email protected]

➡️ Подробности - https://proglib.io/vacancies/front-end-razrabotchik-v-tilda-tilda-publishing-2020-06-20
3 способа коммуникации между компонентами в Svelte

Из статьи вы узнаете, как наладить общение между родительскими и дочерними компонентами в Svelte-приложении.

Вкратце - есть три способа:
1️⃣ Передать в дочерний компонент обработчик-замыкание, имеющий доступ к состоянию родителя
2️⃣ Передать в дочерний компонент само состояние через переменную
3️⃣ Использовать dispatcher для передачи сообщений

Подробнее: https://prglb.ru/2h75x

#frameworks #svelte