​Flappy Bird и Doodle Jump на JavaScript

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

https://tprg.ru/ksw4

#видео #javascript

​Шпаргалка по HTML

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

Посмотреть можно тут:

https://tprg.ru/ArxK

#html

Доступный переключатель

В этой статье вы научитесь делать доступные тумблеры, которые могут стать отличной заменой чекбоксам, используя только HTML и CSS:

https://tprg.ru/Eu2h

#html #css

Плейсхолдер загрузки

С помощью этого инструмента вы сможете быстро добавить на ваш сайт анимацию загрузки контента, созданную на CSS.

По ссылке доступны примеры работы инструмента и инструкция по его установке:

https://tprg.ru/cNzn

#css

Номинант на звание худшего UX-решения

GameDev: разработка игр — новый Telegram-канал от Tproger, где мы будем собирать лучшие материалы по геймдеву для геймдевелоперов, художников, левел-дизайнеров, сценаристов, геймдизайнеров.

Подключайтесь: @make_game

3D-самолёт

Этот самолёт летит и управляется с помощью библиотеки GSAP. В проекте также используются препроцессоры Pug для HTML и Stylus для CSS. Самолёт может не только менять направление движения, но и включать световые огни при переключении в ночной режим.

Посмотреть код проекта и попробовать в деле можно тут:

https://tprg.ru/6CM8

#codepen #css #javascript

​CSS Container Queries

CSS Container Queries — это новый способ создания адаптивной вёрстки сайта взамен медиа-запросам в CSS. Свойство пока ещё не появилось официально и попробовать его можно только Chrome Canary.

Автор этого видео показал, как оно работает и насколько упрощает создание адаптивного сайта, а также рассказал, как вы можете попробовать это CSS-свойство самостоятельно:

https://tprg.ru/7HMZ

#видео #css #фронтенд

​Использование графического процессора для повышения производительности JavaScript

В этой статье вам расскажут о библиотеке GPU.js, которая поддерживается браузерами, Node.js и TypeScript и позволяет использовать мощности графического процессора для повышения производительности.

Подробности в статье:

https://tprg.ru/AVBZ

#javascript

Какие типичные ошибки в дизайне сайта допускают новички — рассказывают эксперты

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

https://tprg.ru/SJUF

#дизайн #ux

Корнями уходит в легаси-код

​Фронтенд-разработка в Docker

Эта статья поможет фронтенд-разработчикам, которые работают или будут работать над совместным проектом. Здесь вы научитесь разрабатывать фронтенд, используя Docker, который поможет избавиться от проблем с совместимостью у разных людей и не только.

Подробнее в статье:

https://tprg.ru/o1vz

#docker #фронтенд

Создание расширения Chrome с помощью React

В этой статье вы найдёте подробную инструкцию по созданию расширения для Chrome, следуя которой, вы сможете самостоятельно создать своё расширение с необходимым функционалом:

https://tprg.ru/Jmr6

#react

Неважно с какими трудностями вы столкнулись при работе с Python. На канале Zen of Python вы обязательно найдёте решение, ведь здесь множество полезных статей, видео и туториалов.

Подписывайтесь: @zen_of_python

​Решили непростую задачу или создаёте интересный проект? Расскажите об этом на Tproger

Не нужно ждать особого приглашения или молиться на рейтинг, чтобы поделиться тем, что может оказаться полезно IT-сообществу или просто интересно вам. У нас появился удобный редактор, который позволяет быстро написать статью и опубликовать её на нашем сайте.

Подробнее в нашей статье:

https://tprg.ru/Wr8Q

Как создать временную шкалу с помощью чистого CSS

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

Эта статья также понятно и наглядно научит вас создавать такие шкалы с помощью чистого CSS:

https://tprg.ru/odU0

#фронтенд #css

И потом сайт, как после бомбёжки выглядит

Сможете правильно ответить, не прибегая к запуску кода?!

Выбирайте правильный ответ в викторине ниже, но не пишите его в комментарии, чтобы всем было интереснее!

#викторина

​Как сделать сайт редактируемым извне с помощью данных Google Sheets

В этой статье рассматривается интересный кейс — как сделать так, чтобы информация на сайте обновлялась в соответствии с данными из таблиц Google.

Ничего особо сложного нет, но очень интересно. Посмотрите сами:

https://tprg.ru/9ysk