Зовем на стажировку по Frontend-разработке
Т-Банк предлагает студентам и начинающим специалистам попробовать себя в роли frontend-разработчика. Стажеры будут решать реальные бизнес-задачи и получат шанс попасть в штат.
Что ждет на стажировке:
— Работа над пользовательской стороной сервисов и приложений.
— Плавное погружение в задачи, помощь ментора и команды.
— Удобный формат: от 20 до 40 часов в неделю, удаленно или в офисе.
— Возможность совмещать с учебой, сессией и экзаменами.
— Официальное оформление, оплата и рабочая техника.
— Доступ к базе знаний с курсами и вебинарами.
Узнайте больше и успейте пройти отбор до 26 августа
Т-Банк предлагает студентам и начинающим специалистам попробовать себя в роли frontend-разработчика. Стажеры будут решать реальные бизнес-задачи и получат шанс попасть в штат.
Что ждет на стажировке:
— Работа над пользовательской стороной сервисов и приложений.
— Плавное погружение в задачи, помощь ментора и команды.
— Удобный формат: от 20 до 40 часов в неделю, удаленно или в офисе.
— Возможность совмещать с учебой, сессией и экзаменами.
— Официальное оформление, оплата и рабочая техника.
— Доступ к базе знаний с курсами и вебинарами.
Узнайте больше и успейте пройти отбор до 26 августа
👍6👎2
WebSocket DevTools
Инструмент для Chrome DevTools, позволяющий в реальном времени отслеживать WebSocket-соединения: просматривать сообщения, перехватывать и блокировать их, а также симулировать ответы клиента и сервера.
https://github.com/law-chain-hot/websocket-devtools
Инструмент для Chrome DevTools, позволяющий в реальном времени отслеживать WebSocket-соединения: просматривать сообщения, перехватывать и блокировать их, а также симулировать ответы клиента и сервера.
https://github.com/law-chain-hot/websocket-devtools
❤12❤🔥4🔥1
20 частых антипаттернов в React и как их исправить
Ошибки, которые приводят к избыточным рендерам, мерцаниям интерфейса, нестабильным эффектам и расхождениям данных.
https://habr.com/ru/articles/937656/
Ошибки, которые приводят к избыточным рендерам, мерцаниям интерфейса, нестабильным эффектам и расхождениям данных.
https://habr.com/ru/articles/937656/
❤🔥15👍3👎2🔥1🤔1
Оптимизация PWA под различные вариации Display Mode
Как в PWA можно учитывать разные режимы отображения — fullscreen, standalone, minimal-ui и browser — чтобы PWA выглядело как нативное приложение без потери удобства.
При использовании таких режимов разработчикам важно помнить, что пользователи теряют привычные возможности браузера — кнопки назад, обновления, копирования URL и т.п., поэтому нужно подстраивать интерфейс под контекст установки и отображения.
https://smashingmagazine.com/2025/08/optimizing-pwas-different-display-modes/
Как в PWA можно учитывать разные режимы отображения — fullscreen, standalone, minimal-ui и browser — чтобы PWA выглядело как нативное приложение без потери удобства.
При использовании таких режимов разработчикам важно помнить, что пользователи теряют привычные возможности браузера — кнопки назад, обновления, копирования URL и т.п., поэтому нужно подстраивать интерфейс под контекст установки и отображения.
https://smashingmagazine.com/2025/08/optimizing-pwas-different-display-modes/
❤8👍3⚡1
This media is not supported in your browser
VIEW IN TELEGRAM
Текст с трехмерными слоями
Создание сложного эффекта объёмного текста, похожего на стопку вырезанных слоёв. Три части — от основ к добавлению интерактивности.
Часть 1
Часть 2
Часть 3
Создание сложного эффекта объёмного текста, похожего на стопку вырезанных слоёв. Три части — от основ к добавлению интерактивности.
Часть 1
Часть 2
Часть 3
🔥5❤3😱3
Что такое Generative Engine Optimization (GEO)?
Generative Engine Optimization (GEO) — новый подход, который помогает создавать контент, чтобы AI-движки (например, ChatGPT, Google AI-Overviews, Perplexity) ссылались на ваш сайт напрямую в своих ответах, а не просто выводили его среди ссылок в выдаче. В отличие от SEO, ориентированного на рейтинги и клики, GEO ставит задачу — стать частью ответа AI, и включает оптимизацию структуры, цитируемости, авторитетности контента и семантики.
https://www.sitepoint.com/generative-engine-optimization
Generative Engine Optimization (GEO) — новый подход, который помогает создавать контент, чтобы AI-движки (например, ChatGPT, Google AI-Overviews, Perplexity) ссылались на ваш сайт напрямую в своих ответах, а не просто выводили его среди ссылок в выдаче. В отличие от SEO, ориентированного на рейтинги и клики, GEO ставит задачу — стать частью ответа AI, и включает оптимизацию структуры, цитируемости, авторитетности контента и семантики.
https://www.sitepoint.com/generative-engine-optimization
❤9💩4⚡1👍1
JWTAuditor
Бесплатный онлайн-анализатор JWT, декодер и инструмент для тестирования безопасности.
https://jwtauditor.com/
Бесплатный онлайн-анализатор JWT, декодер и инструмент для тестирования безопасности.
https://jwtauditor.com/
👍13⚡1🔥1
Бросаем кости с CSS random()
Новая CSS-функция random() (доступна в Safari Technology Preview) — позволяет генерировать рандомные значения прямо в стилях: позицию, цвет, размеры, анимации и многое другое — без единой строки JavaScript
https://webkit.org/blog/17285/rolling-the-dice-with-css-random
Новая CSS-функция random() (доступна в Safari Technology Preview) — позволяет генерировать рандомные значения прямо в стилях: позицию, цвет, размеры, анимации и многое другое — без единой строки JavaScript
https://webkit.org/blog/17285/rolling-the-dice-with-css-random
👍12🔥4❤2
Трюк с radio button для корзины товаров
Хороший пример, как управлять интерактивностью и UI-эффектами (плавные переходы и анимация добавления товара), не перегружая интерфейс лишним JavaScript-кодом.
https://css-tricks.com/a-radio-button-shopping-cart-trick/
Хороший пример, как управлять интерактивностью и UI-эффектами (плавные переходы и анимация добавления товара), не перегружая интерфейс лишним JavaScript-кодом.
https://css-tricks.com/a-radio-button-shopping-cart-trick/
❤9🔥3💯2
CSS лифт: конечный автомат на чистом CSS для навигации по этажам
Как при помощи современных возможностей CSS можно создать полнофункциональный лифт с перемещением между этажами без JavaScript.
Интерфейс работает как конечный автомат: пользователь выбирает этаж, и благодаря состояниям CSS лифт «понимает», куда ему двигаться.
https://css-tricks.com/css-elevator-a-pure-css-state-machine-with-floor-navigation/
Как при помощи современных возможностей CSS можно создать полнофункциональный лифт с перемещением между этажами без JavaScript.
Интерфейс работает как конечный автомат: пользователь выбирает этаж, и благодаря состояниям CSS лифт «понимает», куда ему двигаться.
https://css-tricks.com/css-elevator-a-pure-css-state-machine-with-floor-navigation/
❤11👍3🔥3
Next.js Caching & Rendering Tutorial
1.5 часовой курс по кешированию и рендерингу в Next.js для начинающих.
https://www.youtube.com/watch?v=qYk_BqGHXEg
1.5 часовой курс по кешированию и рендерингу в Next.js для начинающих.
https://www.youtube.com/watch?v=qYk_BqGHXEg
❤8👎3⚡2👍2🤡2
Сапер в 100 строк на чистом JavaScript
Простой туториал, который поможет вам лучше понять правила игры.
https://slicker.me/javascript/mine/minesweeper.htm
Простой туториал, который поможет вам лучше понять правила игры.
https://slicker.me/javascript/mine/minesweeper.htm
👍10❤4🐳3
Иллюстрированный гайд по Big O и временной сложности
JavaScript-ориентированное, интерактивное и визуализированное руководство по системе обозначения Big O и ее роли в описании сложности алгоритмов. Подойдёт даже для тех, кто отличает O(log n) от O(n^2).
https://samwho.dev/big-o/
JavaScript-ориентированное, интерактивное и визуализированное руководство по системе обозначения Big O и ее роли в описании сложности алгоритмов. Подойдёт даже для тех, кто отличает O(log n) от O(n^2).
https://samwho.dev/big-o/
❤12👍2🔥1
Liquid Glass в веб
Операционные системы Apple обновили свой дизайн. Фишкой этого дизайна стал эффект Liquid Glass. Не очень простой эффект для реализации в вебе. Вот несколько примеров и подходов, которыми разработчики пытаются перенести такой эффект в веб.
https://frontendmasters.com/blog/liquid-glass-on-the-web/
Операционные системы Apple обновили свой дизайн. Фишкой этого дизайна стал эффект Liquid Glass. Не очень простой эффект для реализации в вебе. Вот несколько примеров и подходов, которыми разработчики пытаются перенести такой эффект в веб.
https://frontendmasters.com/blog/liquid-glass-on-the-web/
❤12👎3👍1🔥1
So many ranges, so little time
Шпаргалка по свойству animation-ranges. Saron Yitbarek рассказывает все, что вам нужно знать об animation-ranges в scroll-driven анимации.
https://webkit.org/blog/17184/so-many-ranges-so-little-time-a-cheatsheet-of-animation-ranges-for-your-next-scroll-driven-animation/
Шпаргалка по свойству animation-ranges. Saron Yitbarek рассказывает все, что вам нужно знать об animation-ranges в scroll-driven анимации.
https://webkit.org/blog/17184/so-many-ranges-so-little-time-a-cheatsheet-of-animation-ranges-for-your-next-scroll-driven-animation/
❤5🔥3👍1
Отзывчивое видео теперь (почти) просто реализовать
Туториал, рассказывающий как вы можете отображать HQ вертикальные и горизонтальные варианты для видео без сторонних платформ.
https://www.kooslooijesteijn.net/blog/responsive-video-easy
Туториал, рассказывающий как вы можете отображать HQ вертикальные и горизонтальные варианты для видео без сторонних платформ.
https://www.kooslooijesteijn.net/blog/responsive-video-easy
🔥8👍2