Веб-страница
22.1K subscribers
2.18K photos
561 videos
2 files
4.46K links
Всё по фронтенду, бэкенду и девопсу в одном месте

Разместить рекламу: @tproger_sales_bot

Правила общения: https://tprg.ru/rules

Другие каналы: @tproger_channels

Сайт: https://tprg.ru/site

Регистрация в перечне РКН: https://tprg.ru/64ai
Download Telegram
Знаете, как будет вести себя spread-оператор с Set?

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

#викторина
Что будет выведено в консоль при выполнении кода на изображении выше?
Anonymous Quiz
28%
5 2
6%
5 3
21%
Ошибка
36%
4 2
10%
4 3
​Худший Vue.js в мире своими руками

Чтобы разобраться как работает Vue.js, автор создал простейшую копию этого фреймворка.

В этой статье он объясняет, как работает реактивность, директивы и прочее:

https://tprg.ru/lxtf

#vue
​Flappy Bird и Doodle Jump на JavaScript

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

https://tprg.ru/ksw4

#видео #javascript
​Шпаргалка по HTML

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

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

https://tprg.ru/ArxK

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

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

https://tprg.ru/Eu2h

#html #css
This media is not supported in your browser
VIEW IN TELEGRAM
Плейсхолдер загрузки

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

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

https://tprg.ru/cNzn

#css
This media is not supported in your browser
VIEW IN TELEGRAM
Номинант на звание худшего UX-решения
GameDev: разработка игр — новый Telegram-канал от Tproger, где мы будем собирать лучшие материалы по геймдеву для геймдевелоперов, художников, левел-дизайнеров, сценаристов, геймдизайнеров.

Подключайтесь: @make_game
This media is not supported in your browser
VIEW IN TELEGRAM
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
И потом сайт, как после бомбёжки выглядит