Веб-страница
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
Компиляция в JavaScript-фреймворках

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

Давайте разберёмся в этом вопросе подробнее:

https://tprg.ru/NFTq

#javascript
RxJS и Angular: декларативный If/Else

Вы знаете, что используя RxJS можно написать условное ветвление в коде без использования if/else? Нет, речь сейчас не о switch. При использовании поток, композиции и оператора фильтра результат будет аналогичен применению if/else.

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

https://tprg.ru/ZzMH
​Изучение обратного вызова, промисов и async/await на примере приготовления мороженого

Большое видео, посвящённое асинхронности в JavaScript, где вам подробно, понятно с красивыми иллюстрациями расскажут о каждом из способов создания асинхронного кода:

https://tprg.ru/ISLs

#видео #javascript
​Нативная валидация ввода в CSS

Для работы с формами в CSS уже присутствуют специальные свойства и псевдоклассы, которые позволяют пройти валидацию, обозначить пропущенные или неверно заполненные поля и так далее.

В этой небольшой статье вы можете поближе познакомиться с ними:

https://tprg.ru/KZFk

#css
12 ошибок начинающих веб-разработчиков

Хватит делать ошибки на ровном месте! Да, некоторых ошибок не избежать, но с большинством можно действовать превентивно и заранее узнать подводные камни, с которыми можно столкнуться в процессе веб-разработки.

Эта статья вам в этом поможет:

https://tprg.ru/FG0V
Подборка лучших постов из всех Telegram-каналов Tproger

Типичный программист — годнота и самое важное из сферы IT:
— ТОП-5 репозиториев на GitHub, о которых должен знать каждый разработчик
— Самые глупые и самые дорогие баги в истории
— Бесплатные материалы для обучения и прокачки скиллов в программировании

Точка входа в программирование — всё для начинающих программистов:
— Шпаргалка по хоткеям для популярных редакторов кода и сред разработки
— История становления разработчика: от первых троянов до собственной программы для шифрования файлов
— Состояние гонки (race condition) простым языком

Zen of Python – питонисты оценят:
— Собеседование VS реальная работа: какие навыки пригодятся начинающим Python-разработчикам
— Оптимизируем походы в магазин с помощью Python
— 5 быстрых проектов в портфолио на Python, которыми вы будете гордиться

(вы здесь) Веб-страница — канал про веб-разработку:
— Создаём спутниковый трекер с нуля на 30 строках JavaScript
— Топ-10 самых популярных вопросов на собеседовании по JavaScript
— Первое знакомство с Kubernetes: установка кластера k8s вручную

Мобильная разработка — годнота для мобильных разработчиков:
— Пишем список изменений в App Store и Google Play правильно
— Реализовываем компьютерное зрение в мобильном приложении для йоги
— Создаём динамическую смену темы в виде круговой анимации. Прямо как в Telegram, только лучше

GameDev: разработка игр — геймдев такой, какой он есть:
— Лучшая VR-механика ever
— Подборка ресурсов с бесплатной музыкой и звуками для вашей игры
— Создаём игровой движок с видом от первого лица всего за 265 строк кода на JS

IT Юмор — cочные мемы и несерьёзные темы:
— Антидедлайн — битые файлы для отправки заказчику
— Почему не стоит браться за старые костыли в новом проекте — наглядное руководство
— «Не баг, а огреха»

Представляешь, — важные, смешные и родные новости про технологии и IT
— ​Нейросеть будет контролировать поведение подмосковных школьников
— ​Навоз научились применять в добыче криптовалюты
— ​Названы самые «прожорливые» до пользовательских данных приложения

Сохраняйте понравившиеся материалы в закладки и подписывайтесь на интересные для вас каналы.
​Юмористичный обзор Rust с перспективы JavaScript

Опытный JavaScript-разработчик решил познакомиться с языком Rust и сделать некоторые заметки по этому поводу. Получилось достаточно интересно и весело, а главное понятно.

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

https://tprg.ru/TUGX

#rust #javascript
5 возможностей React Material UI, которые вы могли пропустить

Material UI популярный стиль для веб-сайтов и приложений, поэтому для React даже есть соответствующая библиотека. Если работаете с React, то вы, вероятно, знакомы с ней. Но знакомы ли вы со всеми её фишками?

В этой статье вы узнаете о пяти интересных возможностях этой библиотеки:

https://tprg.ru/Ar7i

#react
25 полезных сокращений в JavaScript для веб-разработчиков

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

Здесь вы можете узнать сразу 25 приёмов, которые помогают сократить и облегчить код на JavaScript:

https://tprg.ru/WG3v

#javascript
​​Бэкенд-разработчик решил помочь с дизайном фронтенда:
​DIV должен уйти: улучшаем HTML

В современном вебе многие сайты строятся чуть ли не полностью на одних div'ах, но правильно ли это?

Сегодня HTML позволяет отказаться от конструкции <div class="container"></div> в пользу <container></container> во многих случаях, при этом не только упрощая ориентацию по коду страницы, но и делая её более семантической.

В этой статье автор подробнее рассмотрел этот вопрос и сделал соответствующие вывод:

https://tprg.ru/OlQw

#html
Совместное использование компонентов React в нескольких приложениях

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

Для решения этой проблемы существует Bit — система контроля версий, похожая на Git, но созданная специально для компонентов и зависимостей. Залетайте в статью, чтобы узнать подробнее:

https://tprg.ru/sPIQ

#react
Полное руководство по инструментам обеспечения доступности

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

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

https://tprg.ru/JTYR
Обнаружение неиспользуемых классов в HTML

Зачем хранить в HTML неиспользуемые классы? В разработке важная максимальная лаконичность и минималистичность, ведь ресурсы не бесконечны, да и разбираться потом зачем нужен лишний класс тоже такое себе удовольствие.

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

https://tprg.ru/mabX

#html
​CSS, JavaScript и блокировка парсинга веб-страниц

Хотите узнать неожиданный способ защиты страницы от парсинга? Оказывается, достаточно настроить загрузку CSS-файлов определённым образом. Правда это может и негативно повлиять на загрузку страницы, поэтому тоже надо учитывать и знать, чтобы не навредить работе сайта.

Подробнее:

https://tprg.ru/wxAB
❤1
Что такое React Hooks и какие проблемы они решают

До появления React версии 16.8 основным способом работы с React было использование компонентов различной сложности. Но потом появились хуки, которые позволяют удобно работать с жизненными циклами страницы и упрощают разработку.

В чём же их преимущества и как их использовать читайте в статье:

https://tprg.ru/MIGD

#react
Осталось проверить адаптивность
​Как центрировать что угодно в CSS

Очередное полезное видео от Джой Шахеба, где он расскажет вам и покажет, как настроить расположение div-элемента четырьмя разными способами. Красивые иллюстрации присутствуют.

https://tprg.ru/V0Hz

#видео #css
​W3C внедрил новый аудио-стандарт

Теперь и Web Audio API носит статус официально рекомендованного.

С его помощью веб-разработчики могут совершенно по-разному манипулировать звуковой составляющей в своих проектах. При этом работа API чем-то напоминает то, как устроен DaVinci Resolve со своей нодовой системой:

https://tprg.ru/Rk9h
👍1
Как динамически импортировать модули ECMAScript

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

В этой статье вы узнаете как это сделать:

https://tprg.ru/xZyh

#javascript