Добавили новы возможности в reactuse 😎 :
- useUrlSearchParams
- createReactiveContext
Продолжаем разрабатывать полезные хуки и утилиты. В задачах все также стоит покрытие тестами. Со временем увидели некоторые проблемы парочки хуков, они будут переделаны. До конца года хочется еще добавить удобный способ просмотра типизации в документации🧐
- useUrlSearchParams
- createReactiveContext
Продолжаем разрабатывать полезные хуки и утилиты. В задачах все также стоит покрытие тестами. Со временем увидели некоторые проблемы парочки хуков, они будут переделаны. До конца года хочется еще добавить удобный способ просмотра типизации в документации
Please open Telegram to view this post
VIEW IN TELEGRAM
siberiacancode.github.io
useUrlSearchParams | reactuse
Improve your react applications with our library 📦 designed for comfort and speed
🔥10🍌3🎉2❤1🐳1🏆1
🧊 siberiacancode x IT-ХОЗЯЕВА
Провели игру 👍 Огромное спасибо Глебу Михееву, Сане Стародубцеву, Антону Непше и Денису Чернову. Очень круто посидели — всем участникам низкий поклон за выделенное время и такую отличную игру. Всем зрителям огромное спасибо за интерес. Я мельком видел, что…
siberiacancode-frontend-first.zip
8.1 MB
Многие просили поделится паком своей игры 📞
Please open Telegram to view this post
VIEW IN TELEGRAM
10🍌9❤4🔥3🌭2🤯1🎉1
Для меня все еще секрет, почему люди для i18n и темизации берут перегруженные готовые инструменты. Вот не хочу тыкать пальцем, но самое популярное решение для next хранит тему в locale storage 👻
В app router хранить данные необходимые для адекватного формирования ui, чтобы банально интерфейс красился заранее. Как такое возможно🥄 я лично не смогу понять.
Хотя тут мы вспоминаем мой pull request в доку shadcnui, чтобы пофиксить пример с темой и в этот момент становится все понятно. Но самое прекрасное, это решение с выключением ошибок гидрации😵💫
В app router хранить данные необходимые для адекватного формирования ui, чтобы банально интерфейс красился заранее. Как такое возможно
Хотя тут мы вспоминаем мой pull request в доку shadcnui, чтобы пофиксить пример с темой и в этот момент становится все понятно. Но самое прекрасное, это решение с выключением ошибок гидрации
Please open Telegram to view this post
VIEW IN TELEGRAM
😢7🍌6✍1🤯1👀1🙈1
На самом деле createReactiveContext довольно спорный хелпер. Это контекст, который позволяет оптимизировать реренедеры. Невероятно специфичный хелпер, который родился из-за проблемы, которую люди выдумали 😵💫
Крайне не рекомендуем использовать контекст для сложных интерфейсов, а взять механизм работающий вне react, createStore, reatom, effector, zustand. От самой простой да более сложных задач есть много вариантов, которые помогут вычисления вытащить за react scope🤔
Крайне не рекомендуем использовать контекст для сложных интерфейсов, а взять механизм работающий вне react, createStore, reatom, effector, zustand. От самой простой да более сложных задач есть много вариантов, которые помогут вычисления вытащить за react scope
Please open Telegram to view this post
VIEW IN TELEGRAM
🍌13🎉2❤1🤔1🌭1🤝1
Фух, пронесло, что remix теперь на preact, а то я волновался, что не успеваю его посмотреть и сравнить с next. Спасибо, что теперь у нас только один фрейм для react 👍
Please open Telegram to view this post
VIEW IN TELEGRAM
2🌭11🍌9❤1🔥1
Please open Telegram to view this post
VIEW IN TELEGRAM
YouTube
🍾 шифт интенсив дорабатываем бекенд на nest
Донаты 💸
250руб+ - ревью резюме
1.000руб+ - код ревью
5.000руб+ - мок собес
Поддержка автора 🧊
boosty - https://boosty.to/siberiacancode
donatealerts - https://www.donationalerts.com/r/siberiacancode
Социальные сети 🔥
boosty: https://boosty.to/siberiacancode…
250руб+ - ревью резюме
1.000руб+ - код ревью
5.000руб+ - мок собес
Поддержка автора 🧊
boosty - https://boosty.to/siberiacancode
donatealerts - https://www.donationalerts.com/r/siberiacancode
Социальные сети 🔥
boosty: https://boosty.to/siberiacancode…
❤7🍌7✍2🔥1
MoscowJS 65 + siberiacancode = 😎
Заменят ли нас нейронки? Узнаем уже скоро на крутом митапе от MoscowJS. Ребята хорошие друзья с Докой😆 — платформой с понятными статьями от разработчиков для разработчиков 😁
Регистрация на офлайн уже открыта, Напоминаем: если используете промокод, то не забывайте нажать «Применить». Конечно же будет и онлайн часть, которую ваш покорный слуга будет стримить. Будем обсуждать, комментировать и хорошо проводить время и конечно задавать вопросы спикерам.
Если вы хотите стать спикером, то я максимально рекомендую попробовать свои силы. Я лично знаю ребят организаторов и точно знаю, что они вам помогут с вашим выступлением, подробней можно узнать тут
MoscowJS: https://www.tg-me.com/moscowjs
Задать вопросы спикерам: https://moscowjs.org/qna/
Заменят ли нас нейронки? Узнаем уже скоро на крутом митапе от MoscowJS. Ребята хорошие друзья с Докой
Регистрация на офлайн уже открыта, Напоминаем: если используете промокод, то не забывайте нажать «Применить». Конечно же будет и онлайн часть, которую ваш покорный слуга будет стримить. Будем обсуждать, комментировать и хорошо проводить время и конечно задавать вопросы спикерам.
Если вы хотите стать спикером, то я максимально рекомендую попробовать свои силы. Я лично знаю ребят организаторов и точно знаю, что они вам помогут с вашим выступлением, подробней можно узнать тут
MoscowJS: https://www.tg-me.com/moscowjs
Задать вопросы спикерам: https://moscowjs.org/qna/
Please open Telegram to view this post
VIEW IN TELEGRAM
4🍌7🔥6❤4🎉1😴1💘1
🧊 siberiacancode x IT-ХОЗЯЕВА
Ребята, стрим переношу на завтра. Батарейка кончилась, нужно отдохнуть 🔋
Please open Telegram to view this post
VIEW IN TELEGRAM
1🍌9😢8⚡3❤2
⚡️ typescript стал в 10 раз быстрее и вот почему это хорошо
Таймкоды ⌛️
00:00 Вступление
00:20 Что такое typescript ?
00:36 Почему typescript может стать лучше ?
01:15 Компиляция typescript
01:32 Порт на go
02:20 А что ждать ?
02:37 Вывод
Please open Telegram to view this post
VIEW IN TELEGRAM
YouTube
⚡️ typescript стал в 10 раз быстрее и вот почему это хорошо
В данном ⚡️ ролике поговорим с вами о порте для typescript на go, почему это круто, но не так важно
Таймкоды ⌛️
00:00 Вступление
00:20 Что такое typescript ?
00:36 Почему typescript может стать лучше ?
01:15 Компиляция typescript
01:32 Порт на go
02:20…
Таймкоды ⌛️
00:00 Вступление
00:20 Что такое typescript ?
00:36 Почему typescript может стать лучше ?
01:15 Компиляция typescript
01:32 Порт на go
02:20…
8❤13🍌4🔥3🎉2🍓1
Please open Telegram to view this post
VIEW IN TELEGRAM
1❤7🍌5🔥3✍2🎉1
🧊 siberiacancode x IT-ХОЗЯЕВА
Для меня все еще секрет, почему люди для i18n и темизации берут перегруженные готовые инструменты. Вот не хочу тыкать пальцем, но самое популярное решение для next хранит тему в locale storage 👻 В app router хранить данные необходимые для адекватного формирования…
Очень простая реализация theme и intl для react и nextjs 🧐
На самом деле для многих такой реализации будет достаточно, но я понимаю, что некоторым нужна system тема и с ней вам от ошибки гидрации не уйти, потому-что мы только на клиенте можем понять, какая тема в браузере. Также понимаю, что у кого-то в проекте переводов за 1000 ключей и нужно доработать деление их на чанки.
Самое важное, что я хочу отметить, данные вопросы очень простые, вам не нужны оверинжениренг решения, чтобы в вашем проекте это заработало и было удобным🤔
На самом деле для многих такой реализации будет достаточно, но я понимаю, что некоторым нужна system тема и с ней вам от ошибки гидрации не уйти, потому-что мы только на клиенте можем понять, какая тема в браузере. Также понимаю, что у кого-то в проекте переводов за 1000 ключей и нужно доработать деление их на чанки.
Самое важное, что я хочу отметить, данные вопросы очень простые, вам не нужны оверинжениренг решения, чтобы в вашем проекте это заработало и было удобным
Please open Telegram to view this post
VIEW IN TELEGRAM
🍌9❤4🔥2🎉1
🧊 siberiacancode x IT-ХОЗЯЕВА
Для меня все еще секрет, почему люди для i18n и темизации берут перегруженные готовые инструменты. Вот не хочу тыкать пальцем, но самое популярное решение для next хранит тему в locale storage 👻 В app router хранить данные необходимые для адекватного формирования…
Я был неправ — забыл про SSG 📞
Если сайт использует SSG или ISR, мы не можем учитывать куки или другие пользовательские данные при генерации страницы. Всё, что у нас есть — это чистая статика.
А значит, определить тему можно только на клиентской стороне, уже после загрузки. Это приводит к проблеме: тема применяется после рендера, и в момент загрузки страница сначала отображается в дефолтной теме, а затем "мигает", переключаясь на нужную.
Главная проблема — как применить тему до рендера, если у нас только статика😵💫
Во многих документациях эту проблему решают с помощью инлайнового скрипта в <head>, который запускается до инициализации фрейма. В документации Astro и Next.js можно найти два разных подхода.
Astro делает всё в одном месте. У него в <head> вставляется небольшой JS-скрипт, который не только ставит нужную тему, но и даже ставит нужные иконки
Next.js идёт по другому пути. Он также делает скрипт, который ставит тему в класс, но все остальные компоненты, которые связаны с темой, он просто подгружает через lazy на клиенте.
В итоге я выбрал стратегию next, она больше подходит, когда я работаю с react, но конечно пришлось поддержать dynamic🏋️
Если сайт использует SSG или ISR, мы не можем учитывать куки или другие пользовательские данные при генерации страницы. Всё, что у нас есть — это чистая статика.
А значит, определить тему можно только на клиентской стороне, уже после загрузки. Это приводит к проблеме: тема применяется после рендера, и в момент загрузки страница сначала отображается в дефолтной теме, а затем "мигает", переключаясь на нужную.
Главная проблема — как применить тему до рендера, если у нас только статика
Во многих документациях эту проблему решают с помощью инлайнового скрипта в <head>, который запускается до инициализации фрейма. В документации Astro и Next.js можно найти два разных подхода.
Astro делает всё в одном месте. У него в <head> вставляется небольшой JS-скрипт, который не только ставит нужную тему, но и даже ставит нужные иконки
Next.js идёт по другому пути. Он также делает скрипт, который ставит тему в класс, но все остальные компоненты, которые связаны с темой, он просто подгружает через lazy на клиенте.
В итоге я выбрал стратегию next, она больше подходит, когда я работаю с react, но конечно пришлось поддержать dynamic
Please open Telegram to view this post
VIEW IN TELEGRAM
4❤8🔥6🍌3🎉1
Please open Telegram to view this post
VIEW IN TELEGRAM
YouTube
MoscowJS 65 🟨 нас всех заменить ai, бегите
event - https://moscowjs.org/
Донаты 💸
250руб+ - ревью резюме
1.000руб+ - код ревью
5.000руб+ - мок собес
Поддержка автора 🧊
boosty - https://boosty.to/siberiacancode
donatealerts - https://www.donationalerts.com/r/siberiacancode
Социальные сети 🔥
boosty:…
Донаты 💸
250руб+ - ревью резюме
1.000руб+ - код ревью
5.000руб+ - мок собес
Поддержка автора 🧊
boosty - https://boosty.to/siberiacancode
donatealerts - https://www.donationalerts.com/r/siberiacancode
Социальные сети 🔥
boosty:…
🍌5❤4🔥2⚡1
Автотесты в вебе — странная вещь, вроде бы надо, а вроде бы нет 🤔
Я помню, как вчера. Была сходка на holy, был единственный подписчик. Сидел я, он и artalar. Мы говорили о многом, но и, конечно, задели тесты. Подписчик развернулся ко мне и спросил: «Вы реально пишете тесты?»
Тестирование — это очень важная часть производства, но за свою карьеру я сделал пару основных выводов. Во-первых, что тестирование, что автотесты — нужны не везде. Во-вторых, если они нужны, они не должны выделяться как что-то эдакое❌
Автотесты — просто часть процесса, как ваш дейлик, как код-ревью, как любая ваша задача. Я постараюсь вскоре рассказать вам об этом подробнее, а пока делюсь актуальными и хорошими инструментами для автотестирования.
Я помню, как вчера. Была сходка на holy, был единственный подписчик. Сидел я, он и artalar. Мы говорили о многом, но и, конечно, задели тесты. Подписчик развернулся ко мне и спросил: «Вы реально пишете тесты?»
Тестирование — это очень важная часть производства, но за свою карьеру я сделал пару основных выводов. Во-первых, что тестирование, что автотесты — нужны не везде. Во-вторых, если они нужны, они не должны выделяться как что-то эдакое
Автотесты — просто часть процесса, как ваш дейлик, как код-ревью, как любая ваша задача. Я постараюсь вскоре рассказать вам об этом подробнее, а пока делюсь актуальными и хорошими инструментами для автотестирования.
Please open Telegram to view this post
VIEW IN TELEGRAM
YouTube
Инструменты для тестирования frontend vitest, testing-library, playwright 🧪
Поддержка автора 🧊
boosty - https://boosty.to/siberiacancode
donatealerts - https://www.donationalerts.com/r/siberiacancode
Социальные сети 🔥
boosty: https://boosty.to/siberiacancode
telegram: https://www.tg-me.com/siberiacancode
vk: https://vk.com/siberiacancode…
boosty - https://boosty.to/siberiacancode
donatealerts - https://www.donationalerts.com/r/siberiacancode
Социальные сети 🔥
boosty: https://boosty.to/siberiacancode
telegram: https://www.tg-me.com/siberiacancode
vk: https://vk.com/siberiacancode…
🔥12✍3❤3🍌3
🧊 siberiacancode x IT-ХОЗЯЕВА
Автотесты в вебе — странная вещь, вроде бы надо, а вроде бы нет 🤔 Я помню, как вчера. Была сходка на holy, был единственный подписчик. Сидел я, он и artalar. Мы говорили о многом, но и, конечно, задели тесты. Подписчик развернулся ко мне и спросил: «Вы реально…
А там еще и оказывается storybook 9 вышел 🤩
Круто, что они уменьшали банд сайз на 48% процентов. Я думаю многие сталкивались с проблемами версий, потому-что сторибук ставил кучу пакетов и они очень часто конфликтовали с вашими.
Адекватные глобальные значения и поддержка фреймворка next и svelte, генератор историй выглядит интересно и удобно😍
Также там много связанное с тестами, но я до сих пор не расцениваю storybook, как тест среду. Ведь самые важные тесты, которые хотелось бы от сторибука, визуальные тесты платные, хотя a11y тесты для элементов системы это прям супер .
Все еще считаю, что storybook отличный инструмент для кастомных дизайн систем, когда у вас куча своих компонентов, экранов, виджетов и т.д.👍
Круто, что они уменьшали банд сайз на 48% процентов. Я думаю многие сталкивались с проблемами версий, потому-что сторибук ставил кучу пакетов и они очень часто конфликтовали с вашими.
Адекватные глобальные значения и поддержка фреймворка next и svelte, генератор историй выглядит интересно и удобно
Также там много связанное с тестами, но я до сих пор не расцениваю storybook, как тест среду. Ведь самые важные тесты, которые хотелось бы от сторибука, визуальные тесты платные, хотя a11y тесты для элементов системы это прям супер .
Все еще считаю, что storybook отличный инструмент для кастомных дизайн систем, когда у вас куча своих компонентов, экранов, виджетов и т.д.
Please open Telegram to view this post
VIEW IN TELEGRAM
Storybook Blog
Storybook 9
The lean, mean component testing machine
🔥8🎉4🍌4❤3
reatom — это живой пример, что какая бы технология не была классная, как бы автор не старался инженерно грамотно решать проблему, всему миру будет все равно 🫠
Попробуй отучить react боев не писать в view логику в наше время, самое интересно что вью теперь отчасти имеет такую же историю. И вот вопрос, а может ребята из reatom и effector не правы🤔 и это просто новый архитектурный паттерн view composition.
Попробуй отучить react боев не писать в view логику в наше время, самое интересно что вью теперь отчасти имеет такую же историю. И вот вопрос, а может ребята из reatom и effector не правы
Please open Telegram to view this post
VIEW IN TELEGRAM
1❤11🍌4🔥3🎉1
🧊 siberiacancode x IT-ХОЗЯЕВА
MoscowJS 65 + siberiacancode = 😎 Заменят ли нас нейронки? Узнаем уже скоро на крутом митапе от MoscowJS. Ребята хорошие друзья с Докой 😆 — платформой с понятными статьями от разработчиков для разработчиков 😁 Регистрация на офлайн уже открыта, Напоминаем:…
Бьем рекодры ретрансляции митапа, всем спасибо 🤩
Мы обсуждали ai и различные способы его применения. Было здорово поразмышлять о будущем искусственного интеллекта и о том, как он всё больше приобретает человеческие черты.
📞 Что можно не знать про LLM, чтобы создать себе замену - доклад про то, как сделать свое расширение для vscode и llm, хоть доклад и про велосипед, было интересно послушать про интеграцию llm вручную, а не через cursor
🤓 Ох уж этот AI! Что ты такое? - доклад рассказывал бывший маркетолог, он очень круто держал темп повествования и разобрал некоторые базовые вещи связанные с ai. Очень хороший софтовый доклад получился.
😉 AI в QA: UI тесты простым языком - представьте, что вы пишете e2e-тесты не через сложные локаторы и селекторы, а просто с помощью текстовых команд — звучит действительно круто. Хоть доклад и был в формате рекламы сервиса, идея такого подхода впечатляет: тесты становятся ближе к реальному пользователю, и писать их может практически любой. Конечно, вопрос качества таких тестов остаётся открытым, но суть не в этом.
Одна из идей доклада, которая действительно цепляет — разработчики не должны писать автотесты. В мире веба тесты почему-то часто воспринимаются как нечто отдельное, вынесенное в вакуум. Есть этапы анализа, разработки, ревью — а тесты будто бы "не наша задача". Но это иллюзия. Разработчики должны писать тесты. Должны ревьюить тесты. Должны участвовать в создании инфраструктуры для них. Это не чужая обязанность — это часть общей работы над продуктом.
🤯 AI и безопасность при работе с NPM - неплохой софтовый доклад, как злоумышленники засоряют npm пакетами с помощью ai и воруют данные.
Мы обсуждали ai и различные способы его применения. Было здорово поразмышлять о будущем искусственного интеллекта и о том, как он всё больше приобретает человеческие черты.
Одна из идей доклада, которая действительно цепляет — разработчики не должны писать автотесты. В мире веба тесты почему-то часто воспринимаются как нечто отдельное, вынесенное в вакуум. Есть этапы анализа, разработки, ревью — а тесты будто бы "не наша задача". Но это иллюзия. Разработчики должны писать тесты. Должны ревьюить тесты. Должны участвовать в создании инфраструктуры для них. Это не чужая обязанность — это часть общей работы над продуктом.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
1❤6🔥5🍌5🎉3
🧊 siberiacancode x IT-ХОЗЯЕВА
Please open Telegram to view this post
VIEW IN TELEGRAM
YouTube
Я.Субботник 💛 по разработке интерфейсов
event - https://events.yandex.ru/events/ya-subbotnik-2025-06-07
Донаты 💸
250руб+ - ревью резюме
1.000руб+ - код ревью
5.000руб+ - мок собес
Поддержка автора 🧊
boosty - https://boosty.to/siberiacancode
donatealerts - https://www.donationalerts.com/r/siberiacancode…
Донаты 💸
250руб+ - ревью резюме
1.000руб+ - код ревью
5.000руб+ - мок собес
Поддержка автора 🧊
boosty - https://boosty.to/siberiacancode
donatealerts - https://www.donationalerts.com/r/siberiacancode…
🍌8✍1❤1🔥1
Проведем социальный опрос 🤔 почему вы не используете reatom ?
Anonymous Poll
31%
Мало информации о технологии
24%
Мало практичных примеров
19%
Технология выглядит сложно
29%
Маленькое комьюнити
7%
Не решают мою задачу
60%
Не понимаю зачем она нужна
🍌20🔥3🐳3❤2🎉2🤷♂1
