​5 VS Code расширений для комфортной работы

— Ayu-тема в трёх вариантах;
— один из лучших линтеров JavaScript ESLint;
— Code Spell Checker для проверки грамматики;
— симпатичные иконки с vscode-icons;
— Prettify JSON для правильного форматирования JSON.

Подробнее в статье: https://tprg.ru/VmOe

#vscode

Интерактивная шпаргалка по CSS Grid Layout

Можно не только почитать, но и посмотреть, что будет, если изменить некоторые параметры:

https://tprg.ru/G2Av

Статья включила такие разделы, как формирование сетки, расположение элементов, выравнивание и интервалы.

#css #фронтенд

Лайфхак против нерадивых клиентов

Репозиторий с гайдами по Amazon Web Services

Да, по этой облачной платформе написано много статей, а также есть подробная документация. Тем не менее, это не всегда удобно. Именно поэтому автор наиболее полного гайда решил создать репозиторий, где собрал полезные ресурсы с информацией о AWS:

https://github.com/open-guides/og-aws/

#aws #github

51 крутая игра на HTML5 и JavaScript с открытым исходным кодом:

https://tprg.ru/Lzhn

Осторожно! Затягивает.

#html #javascript

​Что нужно знать фронтенд-разработчику, чтобы переехать в США

Об этом рассказывает Senior, который из Воронежа перебрался в Москву, а далее — в Хьюстон, штат Техас. Он делится необходимыми навыками, подробно разбирая каждый из них:

https://tprg.ru/Lws8

#фронтенд

10 команд для Docker, без которых вам не обойтись

Docker — отличный инструмент для создания микросервисов, который позволяет создавать облачные приложения и системы. Выжимаем из него максимум, используя эти 10 команд:

https://tprg.ru/i3RM

#docker #devops

​Начало работы с Node.js

Посматриваете в сторону бэкенда на JavaScript? Тогда вам пригодится эта статья:

https://tprg.ru/bxtW

Вы пройдёте путь от установки Node.js до первого сайта на локальном сервере и маршрутизации. Всё с использованием терминала и VS Code.

#бэкенд #nodejs

.баскетбольное_кольцо { float: right; }

Как сделать HTML отзывчивым, добавив одну строку кода на CSS

Автор статьи рассказывает, как использовать CSS Grid для создания крутой сетки изображений, которая изменяет количество столбцов в зависимости от ширины экрана или окна браузера:

https://tprg.ru/gNSK

#фронтенд #css

С Vue 3 больше не нужен Vuex?

Vuex — это паттерн управления состоянием и библиотека для приложений на Vue.js. Так зачем от неё отказываться? Дело в том, что новый Vue 3 из коробки предлагает реактивность и новые способы структурирования веб-приложений. Эти изменения настолько глобальны, что можно централизовать управление состоянием без дополнительных инструментов.

Подробнее в статье: https://tprg.ru/m61Q

#фронтенд #vuejs

Сайт, на котором собран 61 PHP-инструмент для анализа кода, управления зависимостями, тестов: https://phpqa.io/

А в этом репозитории ещё свыше ста линтеров, форматтеров и статических анализаторов: https://tprg.ru/lptv

#php #инструменты

Наверняка каждый JavaScript-разработчик использовал метод console.log(‘text’) для отладки кода. Скорее всего, console.warn() и console.error() вам тоже знакомы.

Но есть много других логов, которые могут помочь повысить эффективность отладки кода на JS. В этой статье читайте про 8 самых интересных из них:

https://tprg.ru/Lvha

#javascript #nodejs

Как стать full stack разработчиком

https://tprg.ru/QgnI

По пунктам разобрали необходимые навыки:

— вёрстка и дизайн;
— языки и фреймворки;
— базы данных и DevOps;
— вспомогательные инструменты.

#фронтенд #бэкенд

А вы знали, что JavaScript может отсортировать ваш массив с помощью setTimeout()?

Краткая шпаргалка по TypeScript

Это полноценный базис: типы, параметры, модификаторы доступа, примеры классов, подсказки по установке и ссылка на документацию.

https://tprg.ru/kO7x

#typescript

Оптимизация CLS для списков с бесконечным скроллом

Пагинация и кнопки вроде «Загрузить ещё» порядком надоели, и многие сайты переходят на бесконечную подгрузку элементов. Чтобы избежать при этом сдвига макета, нужно сделать следующее:

— зарезервировать место перед подгрузкой элементов;
— удалить футер или любые DOM-элементы после списка;
— использовать prefetch для предварительной загрузки данных вне области браузера.

Планируете работать с бесконечной прокруткой? Тогда вам будет полезна эта статья:

https://tprg.ru/StXG

#фронтенд #дизайн #ux

CSS в реальной жизни

«Невозможный» чекбокс — это креативный проект, в котором вредный мишка возвращает переключатель в исходное положение. Автор использовал React + GSAP и не поленился добавить звуковые эффекты. Посмотреть код и пощёлкать со звуком можно в сервисе CodePen:

https://codepen.io/jh3y/pen/LYNZwGm

#фронтенд

Как называть переменные в JavaScript

Автор рассказывает в своей статье о том, что не позволяет язык и как подобрать названия, которые помогут вам и другим разработчикам легко разобраться в коде. Статья включила такие разделы:

— Чувствительность к регистру
— Самодокументируемый код
— Соглашение об именовании булевых переменных
— Соглашение об именовании констант

Подробнее: https://tprg.ru/iYtm

#javascript