Инструмент для удобной отладки адаптивности веб-приложения

С помощью этой тулзы можно одновременно смотреть как ваш сайт выглядит на всех необходимых разрешениях. И основная фишка в том, что какие-либо действия, выполняемые в одном из окон, будут автоматически воспроизводиться на всех других окнах. Поэтому не придётся проводить один и тот же сценарий на каждом из разрешений. Эта прелесть ещё и бесплатная.

Ссылка на инструмент: Responsively

#инструмент #web #frontend

Курс: Программа-минимум по TypeScript для React

В планах есть плотная работа с React, но пока не дружите с TS? Эта статья проведёт быстрый экскурс по тому, что и как происходит в TypeScript: от самых основ до нишевых и специфичных тем. Вам не потребуется тратить много времени на другие полноценные курсы по TS, достаточно засесть на один вечер с этой статьёй.

#курс #typescript #react #frontend #en

​​Большая подборка бесплатных учебных материалов для фулстека

Вам больше не нужно ходить по сети в поисках подходящих материалов — всё, что нужно для обучения веб-разработки, собрано в одном месте. Само собой, эта подборка будет полезна не только фулстекам, но и отдельно фронтенд и бэкенд-разработчикам.

В этой подборке вы найдёте бесплатные курсы по вёрстке, JavaScript, JS-фреймворкам, Node.js, PHP, базам данных, Docker и другим важным технологиям.

@prog_point #web #frontend #backend

Инструмент для добавления интерактивности HTML-страницам

Благодаря такому инструменту вы получаете доступ к AJAX, CSS Transitions, WebSockets и Server Sent Events прямо из HTML, без необходимости обрабатывать это всё на стороне JS. Так вы сможете сконцентрироваться на вёрстке и даже делать интерактивные страницы без знания JavaScript или CSS.

Ссылка на инструмент: htmx

#инструмент #web #frontend

Анимированное руководство по CSS flex

flex — свойство в CSS, определяющее способность элемента растягиваться или сжиматься для заполнения собой доступного свободного пространства.

Вариантов использования flex много — про популярные способы рассказали в этом гайде. Всё с гифками, поэтому можно будет сразу определить нужную конфигурацию flex.

#frontend #css #ru

​​10 игр для изучения CSS

Учиться разработке через игры во многом интересней и эффективней, чем делать это же самое в видео и статьях. Ловите целых 10 таких игрушек для изучения CSS: Flexbox froggy, Flexbox defense, Knights of the Flexbox Table, Flex Box adventure, Flexbox zombies, Grid garden, Grid attack, CSS Diner, Guess CSS, CSS Speedrun.

Подробней про каждую игру с описанием смотрите в источнике.

#frontend #css