​#performance

Очень-очень большой чеклист по производительности фронтенда

Почему ваш сайт не так быстр, как хотелось бы? Что влияет на производительность, а что нет? На какие показатели ориентироваться? Можно ли переборщить с оптимизацией? Как решить текущие проблемы и предотвратить будущие?

Заварите чай, посадите на колени кота и уютно проведите воскресный вечер с этим замечательным лонгридом, который расставит все точки над ё.

https://prglb.ru/5dqp1

​#tricks #interface #html

Движение текста по кривой

Забавный эффект перемещения текста, реализованный на SVG.

https://prglb.ru/4yeqi

Доброе утро понедельника :) Расскажите, пожалуйста, о своем опыте во фронтенд-разработке
anonymous poll

Есть некоторый опыт разработки на JS и/или популярных фреймворках – 273
👍👍👍👍👍👍👍 22%

JavaScript-джуниор – 271
👍👍👍👍👍👍👍 22%

Знаю HTML и CSS. JavaScript пока - темный лес – 248
👍👍👍👍👍👍 20%

Крепкий миддл – 237
👍👍👍👍👍👍 19%

Никакого опыта, делаю первые шаги – 142
👍👍👍👍 11%

JS-профессионал – 65
👍👍 5%

👥 1236 people voted so far.

​#css

Это не Дисней: практическое руководство по переходам и анимациям в CSS

В CSS есть неплохой набор инструментов для создания красивых и достаточно сложных эффектов. Разбираемся, как с ними работать.

https://prglb.ru/5go6z

​#frameworks #angular

Введение в Angular Elements

Учимся создавать удобные переиспользуемые компоненты на Angular и компилировать их в Custom Elements с помощью Angular Elements.

https://prglb.ru/5gjo2

​#javascript #advanced

Осваиваем Async/Await на реальных примерах

Async/await - это современный способ создания асинхронного кода, который выглядит как синхронный. Осваиваем его на примере приложения-конвертора валют.

https://prglb.ru/4vvs6

​#tools

Введение в Webpack для новичков

Webpack - это швейцарский нож веб-разработки. Если вы его еще не освоили, то скорее исправьте это недоразумение.

https://prglb.ru/f4jw

​#video #css #tricks

Верстка 3D-карточки

Небольшой туториал по созданию вращающейся 3D карточки с помощью CSS-трансформаций

​#javascript

Прощай, плохой код: вот как не лажать в JavaScript

На JavaScript легко писать работающие решения, но легко и совершать ошибки. Рассказываем и показываем, как стать лучше в JavaScript.

https://proglib.io/p/better-javascript/

​#css

Пользовательские свойства CSS в каскадной модели

Глубокое погружение в пользовательские свойства, приемы их использования и особенности работы в каскаде стилей.

https://prglb.ru/ubkg

#javascript #advanced

Список (продвинутых) вопросов по JavaScript

Большая подборка (уже больше 90) вопросов по JS разного уровня сложности. Проверьте свои знания!

https://prglb.ru/9p0p

​#javascript #beginners

JavaScript Maps vs Обычные объекты: смертельная битва

Среди других замечательных плюшек, в стандарте ES6 появились мапы (Maps) и сеты (Sets). Пора ли отказываться от старых-добрых объектов и массивов, или новые структуры не могут полностью их заменить?

https://proglib.io/p/js-maps-vs-objects/

#interface #tricks #video

Кастомные чекбоксы правильно

Вадим Макеев расказывает, как кастомизировать встроенные чекбоксы под любой дизайн, сохраняя их доступность.

https://prglb.ru/2ly9r

​#frameworks

React vs Angular vs Vue - Что выбрать в 2019?

Очередной раунд противостояния трех JavaScript-гигантов.

https://prglb.ru/1ggmd

​#css #beginners

Блочная модель в CSS: что это и как использовать?

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

https://prglb.ru/32h7h

​#performance #html

Секреты использования семантической верстки в HTML5

Семантические теги придают обычным HTML-блокам особый смысл. Их использование позволяет поисковым системам лучше анализировать страницу и улучшает SEO.

https://prglb.ru/4hj3h

​#javascript #advanced

Полное руководство по TypeScript

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

https://prglb.ru/32v8z

​#tricks

Создаем анимированный фавикон

Фавикон, возможно, самый недооцененный элемент веб-страницы. А ведь он способен привлечь внимание пользователя даже если вкладка с сайтом в его браузере неактивна.

Проявим фантазию и анимируем важную иконку!

https://prglb.ru/5nzy7

​#javascript

Как писать JavaScript-код еще лучше?

Несколько практических советов по улучшению вашего JS.

https://prglb.ru/4x5gf

​#javascript #beginners

Это безумное слово this

Ключевое слово this существует во многих языках программирования.

Разбираемся, для чего оно нужно в JavaScript и как с ним правильно работать.

https://prglb.ru/1p6ej

​#css

Топ-7 CSS-трендов 2019

Что актуально в мире верстки в 2019? 7 фич, на которые стоит обратить внимание.

https://prglb.ru/4y5rc