
💸 Скидки до 70% для бизнеса и финансов
Ловите лучшие слоты в каналах бизнес-тематик — только до 6 апреля!
Забрать скидку

31.9

Будни разработчика
4.8
97
Интернет технологии
2.5K
82
Всё о разработке вообще и фронтенде в частности: лучшие статьи, фишки, баги браузеров и личный опыт автора
Поделиться
В избранное
Купить рекламу в этом канале
Формат:
keyboard_arrow_down
- 1/24
- 2/48
- 3/72
- 7 дней
- Репост
1 час в топе / 24 часа в ленте
Количество:
%keyboard_arrow_down
- 1
- 2
- 3
- 4
- 5
- 8
- 10
- 15
Стоимость публикации:
local_activity
2 517.48₽2 517.48₽local_mall
0.0%
Осталось по этой цене:0
Последние посты канала
Не ожидал, что телега не останется в стороне от 1 апреля.
Вы уже видели эту офигительную анимацию лайка?
Вы уже видели эту офигительную анимацию лайка?
1100
06:00
01.04.2025
play_circleВидео недоступно для предпросмотра
#фишка дня
Применяя
Вот только есть одна проблема: последняя строка таблицы при скролле скрывается под этим самым заголовком и выглядит это, ну, странно. Особенно в случае, когда в таблице не просто текст, а условия сравнения, изображения и так далее.
А решение простое!
Добавляем
Обратите внимание,
Да, совсем не очевидно, зато выглядит таблица теперь бомбически: https://codepen.io/alinaki/pen/JojeGMY?editors=0100
#table #sticky #position
Применяя
position: sticky
к заголовку таблицы, мы получам прекрасную и понятную реализацию прилипшего заголовка.Вот только есть одна проблема: последняя строка таблицы при скролле скрывается под этим самым заголовком и выглядит это, ну, странно. Особенно в случае, когда в таблице не просто текст, а условия сравнения, изображения и так далее.
А решение простое!
Добавляем
margin-bottom
на thead
размером во всю высоту строки:
margin-bottom: calc(1lh + 20px);
Обратите внимание,
1lh
— это буквально единица измерения, позволяющая обратиться к значению интерлиньяжа, aka высоте строки. Ну а складывать удавов с попугаями мы умели всегда.Да, совсем не очевидно, зато выглядит таблица теперь бомбически: https://codepen.io/alinaki/pen/JojeGMY?editors=0100
#table #sticky #position
1500
11:30
31.03.2025
imageИзображение не доступно для предпросмотра
В айти давно поменялась философия рабочей среды. Спецы выбирают место работы не по формальным критериям, а по ощущению — «моё/не моё». То есть это не про «привлечение талантов» корпоративными методами, а про ценности, которые мэтчатся с личными.
Яндекс на фестиваль New Star Camp в горах Сочи перенес лучшие практики из своих офисов в три разные зоны. Они все про простые, но очень важные идеи:
— доступность — любой гость попробовать себя в роли сотрудника и перенести свою фотографию на большой «бейдж», а еще потестировать бенефиты сотрудников, получить приглашения на мероприятия или сделать кастомный мерч
— активности — в отдельном селфбуст-пространстве проходили воркшопы, дискуссии про ИИ и даже D&D игры
— атмосфера — уютная терраса в стиле офисных крыш компании, где можно взять чай, послушать музыкальные вечера, и просто неформально пообщаться
Выглядело это как естественное продолжение фестиваля. Когда компании становятся не работодателем, а местом для единомышленников — это совершенно другой уровень вовлеченности.
Яндекс на фестиваль New Star Camp в горах Сочи перенес лучшие практики из своих офисов в три разные зоны. Они все про простые, но очень важные идеи:
— доступность — любой гость попробовать себя в роли сотрудника и перенести свою фотографию на большой «бейдж», а еще потестировать бенефиты сотрудников, получить приглашения на мероприятия или сделать кастомный мерч
— активности — в отдельном селфбуст-пространстве проходили воркшопы, дискуссии про ИИ и даже D&D игры
— атмосфера — уютная терраса в стиле офисных крыш компании, где можно взять чай, послушать музыкальные вечера, и просто неформально пообщаться
Выглядело это как естественное продолжение фестиваля. Когда компании становятся не работодателем, а местом для единомышленников — это совершенно другой уровень вовлеченности.
В айти давно поменялась философия рабочей среды. Спецы выбирают место работы не по формальным критериям, а по ощущению — «моё/не моё». То есть это не про «привлечение талантов» корпоративными методами, а про ценности, которые мэтчатся с личными.
Яндекс на фестиваль New Star Camp в горах Сочи перенес лучшие практики из своих офисов в три разные зоны. Они все про простые, но очень важные идеи:
— доступность — любой гость попробовать себя в роли сотрудника и перенести свою фотографию на большой «бейдж», а еще потестировать бенефиты сотрудников, получить приглашения на мероприятия или сделать кастомный мерч
— активности — в отдельном селфбуст-пространстве проходили воркшопы, дискуссии про ИИ и даже D&D игры
— атмосфера — уютная терраса в стиле офисных крыш компании, где можно взять чай, послушать музыкальные вечера, и просто неформально пообщаться
Выглядело это как естественное продолжение фестиваля. Когда компании становятся не работодателем, а местом для единомышленников — это совершенно другой уровень вовлеченности.
Яндекс на фестиваль New Star Camp в горах Сочи перенес лучшие практики из своих офисов в три разные зоны. Они все про простые, но очень важные идеи:
— доступность — любой гость попробовать себя в роли сотрудника и перенести свою фотографию на большой «бейдж», а еще потестировать бенефиты сотрудников, получить приглашения на мероприятия или сделать кастомный мерч
— активности — в отдельном селфбуст-пространстве проходили воркшопы, дискуссии про ИИ и даже D&D игры
— атмосфера — уютная терраса в стиле офисных крыш компании, где можно взять чай, послушать музыкальные вечера, и просто неформально пообщаться
Выглядело это как естественное продолжение фестиваля. Когда компании становятся не работодателем, а местом для единомышленников — это совершенно другой уровень вовлеченности.
1700
11:51
30.03.2025
play_circleВидео недоступно для предпросмотра
#инструмент дня
Дизайнеры в последнее время очень полюбили градиенты. Особенно ненаправленные.
Градиенты как элемент оформления. Градиенты как плейсхолдеры. Градиенты как идея.
И вот вроде есть у нас продукты, исповедующие идеологию LQIP (Low Quality Image Preview), о которых я писал не так давно, но многим этого мало и охота точной настройки. Особенно если дело касается mesh-градиентов (по сетке, или, проще говоря, ненаправленных).
И тут нашёлся такой инструмент для генерации и настройки градиента по фото! Буквально, так и называется: https://photogradient.com/
Я, честно, не считаю вручную акцентированный градиент настолько лучше автоматически созданного по контрасту, но для основных, идейных изображений, наверняка кому-то пригодится.
Но для нагруженного проекта я предпочту LQIP или SQIP, ссылку на которые дал выше.
#gradient #tool #mesh #бородач
Дизайнеры в последнее время очень полюбили градиенты. Особенно ненаправленные.
Градиенты как элемент оформления. Градиенты как плейсхолдеры. Градиенты как идея.
И вот вроде есть у нас продукты, исповедующие идеологию LQIP (Low Quality Image Preview), о которых я писал не так давно, но многим этого мало и охота точной настройки. Особенно если дело касается mesh-градиентов (по сетке, или, проще говоря, ненаправленных).
И тут нашёлся такой инструмент для генерации и настройки градиента по фото! Буквально, так и называется: https://photogradient.com/
Я, честно, не считаю вручную акцентированный градиент настолько лучше автоматически созданного по контрасту, но для основных, идейных изображений, наверняка кому-то пригодится.
Но для нагруженного проекта я предпочту LQIP или SQIP, ссылку на которые дал выше.
#gradient #tool #mesh #бородач
1800
06:44
29.03.2025
play_circleВидео недоступно для предпросмотра
#инструмент дня
Дизайнеры в последнее время очень полюбили градиенты. Особенно ненаправленные.
Градиенты как элемент оформления. Градиенты как плейсхолдеры. Градиенты как идея.
И вот вроде есть у нас продукты, исповедующие идеологию LQIP (Low Quality Image Preview), о которых я писал не так давно, но многим этого мало и охота точной настройки. Особенно если дело касается mesh-градиентов (по сетке, или, проще говоря, ненаправленных).
И тут нашёлся такой инструмент для генерации и настройки градиента по фото! Буквально, так и называется: https://photogradient.com/
Я, честно, не считаю вручную акцентированный градиент настолько лучше автоматически созданного по контрасту, но для основных, идейных изображений, наверняка кому-то пригодится.
Но для нагруженного проекта я предпочту LQIP или SQIP, ссылку на которые дал выше.
#gradient #tool #mesh #бородач
Дизайнеры в последнее время очень полюбили градиенты. Особенно ненаправленные.
Градиенты как элемент оформления. Градиенты как плейсхолдеры. Градиенты как идея.
И вот вроде есть у нас продукты, исповедующие идеологию LQIP (Low Quality Image Preview), о которых я писал не так давно, но многим этого мало и охота точной настройки. Особенно если дело касается mesh-градиентов (по сетке, или, проще говоря, ненаправленных).
И тут нашёлся такой инструмент для генерации и настройки градиента по фото! Буквально, так и называется: https://photogradient.com/
Я, честно, не считаю вручную акцентированный градиент настолько лучше автоматически созданного по контрасту, но для основных, идейных изображений, наверняка кому-то пригодится.
Но для нагруженного проекта я предпочту LQIP или SQIP, ссылку на которые дал выше.
#gradient #tool #mesh #бородач
1800
06:44
29.03.2025
play_circleВидео недоступно для предпросмотра
#инструмент дня
Охренеть какая штука!
https://react-explorer.com/
Это обозреватель зависимостей. Я бы даже сказал, созвездия завимимостей и сейчас вы поймёте, почему.
Потому что помимо простого дерева, которое в целом умеет строить кто угодно, тут имеется мини-карта!
Перемещаешься по карте — смотришь подсвеченные созвездия. Инспектор работает на любом реакт-сайте без отдельной установки, потому что построен по принципу React Scan — инджектит React DevTools на страницу.
Да, на минифицированном коде результат получается не очень понятный, но осознать масштаб зависимостей и связи между ними всё же позволяет.
Проект пока не открыт, но находится в открытом тестировании.
#react #analyze #dependencies
Охренеть какая штука!
https://react-explorer.com/
Это обозреватель зависимостей. Я бы даже сказал, созвездия завимимостей и сейчас вы поймёте, почему.
Потому что помимо простого дерева, которое в целом умеет строить кто угодно, тут имеется мини-карта!
Перемещаешься по карте — смотришь подсвеченные созвездия. Инспектор работает на любом реакт-сайте без отдельной установки, потому что построен по принципу React Scan — инджектит React DevTools на страницу.
Да, на минифицированном коде результат получается не очень понятный, но осознать масштаб зависимостей и связи между ними всё же позволяет.
Проект пока не открыт, но находится в открытом тестировании.
#react #analyze #dependencies
2200
07:34
27.03.2025
imageИзображение не доступно для предпросмотра
#видео дня
Прямо сейчас идёт трансляция Epic Web Conf 2025. Конкретно в этот момент — рассказ об фронтенд-инфраструктуре компании ByteDance (стоящей за TikTok). А именно, о RSpack (моя любовь), RSBuild, Lynx. Большое влияние уделено микрофронтендам и Module Federation.
Срочно подключаемся: https://www.youtube.com/watch?v=SDuvi5eUqp0
Прямо сейчас идёт трансляция Epic Web Conf 2025. Конкретно в этот момент — рассказ об фронтенд-инфраструктуре компании ByteDance (стоящей за TikTok). А именно, о RSpack (моя любовь), RSBuild, Lynx. Большое влияние уделено микрофронтендам и Module Federation.
Срочно подключаемся: https://www.youtube.com/watch?v=SDuvi5eUqp0
2100
15:57
26.03.2025
imageИзображение не доступно для предпросмотра
#видео дня
Прямо сейчас идёт трансляция Epic Web Conf 2025. Конкретно в этот момент — рассказ об фронтенд-инфраструктуре компании ByteDance (стоящей за TikTok). А именно, о RSpack (моя любовь), RSBuild, Lynx. Большое влияние уделено микрофронтендам и Module Federation.
Срочно подключаемся: https://www.youtube.com/watch?v=SDuvi5eUqp0
Прямо сейчас идёт трансляция Epic Web Conf 2025. Конкретно в этот момент — рассказ об фронтенд-инфраструктуре компании ByteDance (стоящей за TikTok). А именно, о RSpack (моя любовь), RSBuild, Lynx. Большое влияние уделено микрофронтендам и Module Federation.
Срочно подключаемся: https://www.youtube.com/watch?v=SDuvi5eUqp0
2100
15:57
26.03.2025
imageИзображение не доступно для предпросмотра
Яндекс вновь проведет масштабный фестиваль Young Con для всех, кто интересуется сферой IT
25 июня во второй раз пройдет фестиваль про технологии и карьеру в IT — Young Con. В этом году он будет доступен не только студентам, выпускникам и начинающим специалистам, но и школьникам 9-11 классов. Участники смогут познакомиться с IT-профессиями, посетить интерактивные зоны ведущих вузов, попробовать сервисы Яндекса, пообщаться со специалистами и пройти пробное собеседование.
Подробнее — на сайте Young&&Yandex и в Телеграм-канале.
25 июня во второй раз пройдет фестиваль про технологии и карьеру в IT — Young Con. В этом году он будет доступен не только студентам, выпускникам и начинающим специалистам, но и школьникам 9-11 классов. Участники смогут познакомиться с IT-профессиями, посетить интерактивные зоны ведущих вузов, попробовать сервисы Яндекса, пообщаться со специалистами и пройти пробное собеседование.
Подробнее — на сайте Young&&Yandex и в Телеграм-канале.
2200
16:51
25.03.2025
play_circleВидео недоступно для предпросмотра
#инструмент дня
Мой самый любимый виджет из всех — Modal Bottom Sheet. Это как в построении маршрута на Google Maps. Шторка, по-нашему. Дёргаешь её туда-сюда, забавно.
Так вот, в мобильных фреймворках вроде того же Flutter и SwiftUI шторка реализована из коробки, а для веба — приходится изгаляться.
Хотя у шторки на мобильных устройствах очень много на самом деле общего со множеством других виджетов: модалка, тост, боковое меню, лайтбокс, стек (как в Tinder). Просто потому что их очень интуитивно можно смахнуть или развернуть жестами.
Так вот, собственно, к чему это я: https://silkhq.co/
Прекрасная библиотека, реализующая шторку и ей подобные виджеты, их анимации и взаимодействия на разных устройствах.
Множество примеров, нативные анимации, жесты. Одна проблема: платная для коммерческого использования. И не открытая.
Две, получается, проблемы :(
#react #sheet #widget
Мой самый любимый виджет из всех — Modal Bottom Sheet. Это как в построении маршрута на Google Maps. Шторка, по-нашему. Дёргаешь её туда-сюда, забавно.
Так вот, в мобильных фреймворках вроде того же Flutter и SwiftUI шторка реализована из коробки, а для веба — приходится изгаляться.
Хотя у шторки на мобильных устройствах очень много на самом деле общего со множеством других виджетов: модалка, тост, боковое меню, лайтбокс, стек (как в Tinder). Просто потому что их очень интуитивно можно смахнуть или развернуть жестами.
Так вот, собственно, к чему это я: https://silkhq.co/
Прекрасная библиотека, реализующая шторку и ей подобные виджеты, их анимации и взаимодействия на разных устройствах.
Множество примеров, нативные анимации, жесты. Одна проблема: платная для коммерческого использования. И не открытая.
Две, получается, проблемы :(
#react #sheet #widget
1900
14:17
25.03.2025
close
С этим каналом часто покупают
Отзывы канала
keyboard_arrow_down
- Добавлен: Сначала новые
- Добавлен: Сначала старые
- Оценка: По убыванию
- Оценка: По возрастанию
4.8
8 отзыва за 6 мес.
Превосходно (75%) За последние 6 мес
Очень хорошо (25%) За последние 6 мес
d
**agoneknp@*****.com
на сервисе с июня 2023
21.02.202510:25
5
Высокая конверсия
Показать еще
Лучшие в тематике
Новинки в тематике
Выбрано
0
каналов на сумму:0.00₽
Подписчики:
0
Просмотры:
lock_outline
Перейти в корзинуКупить за:0.00₽
Комментарий