Шпаргалка по БЭМ
Компоненты, которые приходится писать каждому верстальщику, разложенные на составляющие согласно БЭМ-методологии.
Смотреть: https://prglb.ru/3s3jq
#css #html #bem
Компоненты, которые приходится писать каждому верстальщику, разложенные на составляющие согласно БЭМ-методологии.
Смотреть: https://prglb.ru/3s3jq
#css #html #bem
Фильм Microsoft Build 2020: главные новинки IT-индустрии
Рассказ и видео о последних новинках от компании Microsoft. Суперкомпьютеры, безопасное машинное обучение, Learn TV, Fluid Framework и многое другое – будьте в курсе инноваций!
https://proglib.io/sh/RSsI59cBpz
Рассказ и видео о последних новинках от компании Microsoft. Суперкомпьютеры, безопасное машинное обучение, Learn TV, Fluid Framework и многое другое – будьте в курсе инноваций!
https://proglib.io/sh/RSsI59cBpz
SvelteJS
Видеокурс Владилена Минина по фреймворку SvelteJS. 9 небольших уроков, из которых вы узнаете все, что нужно для начала работы.
Урок 1. Что такое SvelteJS (отличие от React, Angular, Vue)
Урок 2. Как работает SvelteJS
Урок 3. Переменные и стили в SvelteJS
Урок 4. Как добавлять события в SvelteJS
Урок 5. Реактивность в SvelteJS
Урок 6. Как SvelteJS работает с формами (bind)
Урок 7. Как работают условные операторы в SvelteJS
Урок 8. Как создавать компоненты в SvelteJS
Урок 9. Как работают циклы в SvelteJS. Зачем нужен key
Смотреть: https://prglb.ru/3y75m
#video #svelte #frameworks
Видеокурс Владилена Минина по фреймворку SvelteJS. 9 небольших уроков, из которых вы узнаете все, что нужно для начала работы.
Урок 1. Что такое SvelteJS (отличие от React, Angular, Vue)
Урок 2. Как работает SvelteJS
Урок 3. Переменные и стили в SvelteJS
Урок 4. Как добавлять события в SvelteJS
Урок 5. Реактивность в SvelteJS
Урок 6. Как SvelteJS работает с формами (bind)
Урок 7. Как работают условные операторы в SvelteJS
Урок 8. Как создавать компоненты в SvelteJS
Урок 9. Как работают циклы в SvelteJS. Зачем нужен key
Смотреть: https://prglb.ru/3y75m
#video #svelte #frameworks
Большое руководство по iframes
iframe - это довольно мощный инструмент, который дает много возможностей разработчику, но и требует большой ответственности. Статья рассказывает о преимуществах фреймов (например, удобное управление фокусом), недостатках и лучших практиках работы с ними.
Читать: https://prglb.ru/4tcp0
#html #iframe
iframe - это довольно мощный инструмент, который дает много возможностей разработчику, но и требует большой ответственности. Статья рассказывает о преимуществах фреймов (например, удобное управление фокусом), недостатках и лучших практиках работы с ними.
Читать: https://prglb.ru/4tcp0
#html #iframe
Как сделать ваш HTML отзывчивым, добавив одну строку кода на CSS
Используем CSS Grid для создания крутой сетки изображений, которая изменяет количество столбцов в зависимости от ширины экрана или окна браузера. И все это всего лишь одной строчкой CSS-кода! 😲
Читать: https://prglb.ru/5mbd1
#css #grid #layout
Используем CSS Grid для создания крутой сетки изображений, которая изменяет количество столбцов в зависимости от ширины экрана или окна браузера. И все это всего лишь одной строчкой CSS-кода! 😲
Читать: https://prglb.ru/5mbd1
#css #grid #layout
Хабр
Как сделать ваш HTML отзывчивым, добавив одну строку кода на CSS
Привет, Хабр! представляю вашему вниманию перевод статьи «How to make your HTML responsive by adding a single line of CSS» автора Per Harald Borgen. В этой ст...
Создание дизайн-системы: чеклист
Собрание всего, что вы должно сделать, создавая собственную дизайн-систему: от логотипа и кнопочек до менеджмента.
Ссылка: https://prglb.ru/45ex6
#design #checklist
Собрание всего, что вы должно сделать, создавая собственную дизайн-систему: от логотипа и кнопочек до менеджмента.
Ссылка: https://prglb.ru/45ex6
#design #checklist
🙇Любите пораскинуть мозгами? 20 и 21 июня образовательный портал GeekBrains проведет онлайн-конкурс по математике и информатике. Решите задачи, войдите в десятку лучших и выиграйте бесплатное обучение IT-профессиям на выбор: веб-программированию, системному администрированию, разработке игр и др.
👨🏫 Участвуют все желающие, достаточно школьных знаний. А задания с выбором ответа и без.
🙋♂️ Выглядит жизненно: как будто сдаёшь ЕГЭ, чтобы поступить в онлайн-университет. Все подробности здесь: https://proglib.io/w/ab5b5cee
👨🏫 Участвуют все желающие, достаточно школьных знаний. А задания с выбором ответа и без.
🙋♂️ Выглядит жизненно: как будто сдаёшь ЕГЭ, чтобы поступить в онлайн-университет. Все подробности здесь: https://proglib.io/w/ab5b5cee
Какой из примеров использования ARIA является корректным?
Anonymous Quiz
13%
Никакой, все неправильные
6%
1
4%
2
11%
3
13%
4
25%
5
14%
6
16%
Все правильные
Привет, Чувак на связи.
Веду канал с вакансиями в IT без херни.
✅ Лично отбираю вакансии - никакой херни.
✅ Вакансии краткие и по делу - никаких полотен в два экрана.
✅ Только две вакансии в день - никакого спама, я уважаю своих читателей.
✅ Все вакансии имеют стандартизированный вид - никакого хаоса.
✅ Заставляю эйчаров переписывать вакансии по 10 раз - никаких дружных коллективов.
Веду канал с вакансиями в IT без херни.
✅ Лично отбираю вакансии - никакой херни.
✅ Вакансии краткие и по делу - никаких полотен в два экрана.
✅ Только две вакансии в день - никакого спама, я уважаю своих читателей.
✅ Все вакансии имеют стандартизированный вид - никакого хаоса.
✅ Заставляю эйчаров переписывать вакансии по 10 раз - никаких дружных коллективов.
Правильный ответ: 3
1: Для тега aside по умолчанию используется role=complementary, не имеет смысла дублировать
2: Не следует радикально изменять нативную семантику тегов
4: У обычного текстового поля нет состояния aria-checked
5: Для скрытого input нет доступных ARIA-ролей
6: Для обозначения недоступности кнопок следует использовать нативный атрибут disabled
Что такое ARIA?
Узнать: https://prglb.ru/ds7n
#accessibility #aria
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
Три шага для внедрения типизированного JS в ваш проект!
Читать: https://prglb.ru/1r9em
#frameworks #vue #typescript #tools
Medium
Adding Typescript to your existing VueJS 2.6+ app
Improve the Javascript code of your VueJS app with Typescript and its super powers!
Шаблоны верстки email-рассылок
Верстка почтовых рассылок - ужасная головная боль. Поэтому подборка готовых шаблонов будет очень полезна.
Тут есть базовый каркас письма, колонки, оформление текста, кнопок и т.д. Бонусом - подробные объяснения, для чего нужно каждое правило.
Забрать себе: https://www.goodemailcode.com/
#html #email #bestpractices
Верстка почтовых рассылок - ужасная головная боль. Поэтому подборка готовых шаблонов будет очень полезна.
Тут есть базовый каркас письма, колонки, оформление текста, кнопок и т.д. Бонусом - подробные объяснения, для чего нужно каждое правило.
Забрать себе: https://www.goodemailcode.com/
#html #email #bestpractices
11 распространенных заблуждений о микрофронтендах
Развенчиваем популярные мифы, которые мешают составить правильное представление о технологии:
- о том, что нужен JavaScript и куча разных фреймворков
- о разделении компонентов и обмене данными
- об отладке, микросервисах и монорепозиториях
Читать: https://prglb.ru/4b7h3
#microfrontends
Развенчиваем популярные мифы, которые мешают составить правильное представление о технологии:
- о том, что нужен JavaScript и куча разных фреймворков
- о разделении компонентов и обмене данными
- об отладке, микросервисах и монорепозиториях
Читать: https://prglb.ru/4b7h3
#microfrontends
CSS анимация
Плейлист от Виталия Менчуковского, посвященный анимации в CSS: https://prglb.ru/3w5u7
#video #css #animation
Плейлист от Виталия Менчуковского, посвященный анимации в CSS: https://prglb.ru/3w5u7
#video #css #animation
Какой селектор выберет первые два элемента списка?
Anonymous Quiz
11%
li + li
22%
li:nth-child(n + 2)
15%
li:nth-child(-n + 2)
2%
li + li:not(:last-child)
5%
li ~ li
45%
li:nth-of-type(1,2)
Правильный ответ li:nth-child(-n + 2)
В функции nth-child можно использовать отрицательный множитель для параметра n. Таким образом, условию будут соответствовать только элементы с индексами 1 и 2.
Еще несколько дельных советов по CSS: https://prglb.ru/zssn
В функции nth-child можно использовать отрицательный множитель для параметра n. Таким образом, условию будут соответствовать только элементы с индексами 1 и 2.
Еще несколько дельных советов по CSS: https://prglb.ru/zssn
Medium
Несколько дельных советов по CSS
Это современные решения типичных проблем, коллекция советов, которая поможет вам улучшить ваши профессиональные навыки CSS.
Итераторы, генераторы и протокол итерации в JavaScript
Статья рассказывает:
- как происходит итерация по умолчанию строк, массивов и других структур под капотом (спойлер: с помощью итераторов)
- как написать кастомный итератор, чтобы итерировать все, что угодно
- что такое функции-генераторы и нужны ли они разработчику
Читать: https://prglb.ru/pe6e
#javascript #core
Статья рассказывает:
- как происходит итерация по умолчанию строк, массивов и других структур под капотом (спойлер: с помощью итераторов)
- как написать кастомный итератор, чтобы итерировать все, что угодно
- что такое функции-генераторы и нужны ли они разработчику
Читать: https://prglb.ru/pe6e
#javascript #core