Веб-страница
23K subscribers
1.9K photos
560 videos
2 files
4.11K links
Всё по фронтенду, бэкенду и девопсу в одном месте

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

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

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

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

Регистрация в перечне РКН: https://tprg.ru/64ai
Download Telegram
UI? Какой UI?
This media is not supported in your browser
VIEW IN TELEGRAM
Кнопка загрузки

Интересная кнопка загрузки, которая анимирована с использованием SVG-изображений. Из особенностей это минимальное использование JS и просто приятный внешний вид.

Ткнуть самому и изучить код можно тут:

https://tprg.ru/Aypt

#codepen
Проблемы доступности веб-форм

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

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

https://tprg.ru/8bHP

#фронтенд
Работа с TypeScript: практическое руководство для разработчиков

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

В этом руководстве вы узнаете как установить и настроить TypeScript, а также познакомитесь с возможностями TS:

https://tprg.ru/1rY6

#typescript
Вышел Notepad++ 8 — первое крупное обновление редактора за пять лет

В новой версии добавили поддержку ARM64-архитектуры, а также новые иконки в панели инструментов (ну прям ВАУ, конечно), а также пофиксили ряд имеющихся проблем.

Подробнее об изменениях и нововведениях читайте в статье:

https://tprg.ru/9k36
Притяжение и отталкивание частиц на JavaScript

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

Подробнее тут:

https://tprg.ru/Yc61

#видео #javascript
Google: Сторонние cookies небезопасны! Мы придумали новый безопасный способ сбора данных — FLoC!

Тем временем FLoC:
Представлен Angular DevTools

Недавно для Angular появился DevTools, который можно установить в виде расширения для Chrome и получить новый опыт отладки вашего Angular проекта.

Подробнее об инструменте рассказывает один из его разработчиков:

https://tprg.ru/WdfZ

#angular
Практическое введение в Svelte

В этом руководстве вы узнаете о том, что такое Svelte, познакомитесь с его основными концепциями и синтаксисом, а ещё сможете создать первое небольшое приложение на нём:

https://tprg.ru/9xXQ

#svelte
JavaScript API для распознавания людей и ботов в Chrome

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

Но появился новый способ, который поможет исправить эту ситуацию. Называется он Privacy Pass и вот как он работает:

https://tprg.ru/CjVH
This media is not supported in your browser
VIEW IN TELEGRAM
Игра Stack на Three.js и Cannon.js

Версия игры Stack, выполненная на JavaScript с использованием библиотек Three.js и Cannon.js.

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

https://tprg.ru/oWxP

#codepen
Полезные расширения VS Code для фронтенд-разработчиков

В этой подборке собрано более 20 полезных расширений, которые пригодятся фронтенд-разработчикам в самых разных ситуациях:

https://tprg.ru/ubGX

#vscode
Идеальная ссылка. Какая она?

На первый взгляд может показаться, что нет ничего проще, чем создать ссылку на веб-странице — добавил тег <a>, записал в атрибут href адрес и добавил какой-то контент в неё, чтобы было куда нажимать.

Но на самом деле есть множество нюансов, которые мешают создать идеальную ссылку, которая будет и выглядеть на все сто, и максимально удобной. Подробнее в статье:

https://tprg.ru/BUNJ

#html #фронтенд
Введение в лучшие практики Angular

Если вы занимаетесь разработкой с использование Angular, то эта статья вам пригодится. Здесь вы найдёте полезные советы и рекомендации по написанию лучшего кода на Angular и JavaScript:

https://tprg.ru/SZbA

#angular
Когда ты фуллстак-разработчик:
Как быстро и удобно документировать Angular проект с помощью модуля AddOnDoc из TaigaUI

Существуют разные способы документирования проекта Angular. Вероятно, вы пользуетесь каким-то из них.

Здесь автор рассказал об этих способах, сравнил их и объяснил почему считает AddOnDoc лучшим из них:

https://tprg.ru/Uk3e

#angular
Не успеваем делиться новостями

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

Можно работать удалённо или в московском офисе, зарплата на старте от 50к рублей с возможностью роста.

Подробности по ссылке: https://tprg.ru/6wbP
Планы по развитию React

Команда разработчиков React поделилась дальнейшими планами развития библиотеки. Среди них автоматическое пакетирование, новые API-интерфейсы и новое средство рендеринга.

Подробнее можете узнать в их блоге:

https://tprg.ru/xJO2

#react
5 проектов для выведения навыков фронтенд-разработки на новый уровень

Если хотите прокачать свои навыки, как фронтенд-разработчика, то эта статья вам поможет. Здесь представлены 5 проектов, использующие различные технологии, которые позволят вам пополнить своё портфолио и увеличить багаж знаний:

https://tprg.ru/ZswA
Лучшие UI-фреймворки для Vue 3

Использование UI-фреймворков ещё сильнее упрощает разработку веб-сайта на Vue. На сегодняшний день существует несколько актуальных фреймворков, которые вы можете использовать в собственном проекте.

Подробнее о них здесь:

https://tprg.ru/bKUi

#vue
Библиотека react-lazyload

Если вдруг вы не знаете, что такое ленивая загрузка — рассказываем. Ленивая загрузка — это возможность загрузки отдельных компонентов при открытии страницы, необходимых в данный момент. Так, в случае, если какие-то компоненты не нужны в текущей ситуации они не будут загружаться и тем самым снизят нагрузку на сеть и ускорять загрузку страницы.

Для React существует специальная библиотека, которая позволяет быстро настроить ленивую загрузку на вашем сайте, вот она:

https://tprg.ru/MawQ

#react #библиотека