JavaScript *

Привет, Хабр! Я yukk1ro, и сегодня хочу рассказать о своем проекте, который призван сделать обучение программированию более доступным и эффективным.

Соответствие политикам Content Security Policy (CSP) при использовании Google Tag Manager (GTM) на сайте может быть сопряжено с рядом сложностей.

CSP блокирует загрузку внешних ресурсов, выполнение inline-скриптов и стилизации, что может вызвать сбои в работе GTM: некорректную загрузку тегов, проблемы с передачей данных или отсутствие панели отладки.

Ниже рассмотрены основные проблемы в работе GTM и возможные способы их решения.

В декабре 2023 я впервые задумался о похудении. Тогда при росте 194 см я весил 116 кг. Раньше я только играл в мини-футбол, вообще не следил за едой и даже не заглядывал в спортзал.

Начал нормально питаться, поменял привычки, добавил силовые тренировки, к сентябрю 2024 скинул около 30 кг. Это был рекорд по минимальному весу.

Сейчас, через полгода, вешу 89 кг. Оказалось, что нарастить мышцы намного труднее, чем избавиться от жира. Надеюсь, что эти +3 кг в основном мышцы. Почему так: теперь могу подтянуться 11 раз вместо 9, и на фото видны изменения — делаю такие сравнения каждые пару месяцев.

Привет, Хабр!

A-Frame — интересный фреймворк для создания WebVR-приложений, но, статей о нём в русскоязычном сегменте не так много. А ведь это не плохой инструмент, который позволяет разрабатывать VR-сцены, используя простой HTML-подобный синтаксис и JavaScript.

Если вы когда-нибудь задумывались о создании своей VR-игры или интерактивного 3D-опыта в браузере, но не хотели погружаться в сложные движки вроде Unity или Unreal, то A-Frame — отличный вариант для старта.

В этой статье я разберу проблемы, с которыми можно столкнуться при разработке игры на A-Frame, и покажу, как их решить. Готовы к погружению в мир WebVR? Тогда поехали!

В крупнейшем JavaScript фреймворке, Next.js, была найдена критическая уязвимость 9.3/10, на исправление которой Vercel потребовалось 13 дней.

Pino — один из самых быстрых логгеров для Node.js, но как он устроен внутри? В этой статье мы углубимся в низкоуровневые механизмы: разберём, как работают транспорты, чем отличается multistream от pipeline, и как настроить логирование без потери производительности. Вы узнаете, как использовать child loggers, маскировать данные с redact и избегать типичных проблем. Этот материал для тех, кто хочет понять Pino на фундаментальном уровне и применять его с максимальной эффективностью.

Всем привет.

Немного контекста. У нас есть легаси проект, который пишется уже на протяжении порядка пяти лет. Когда мы его стартовали, было принято решение использовать redux в качестве стэйт менеджера. Сейчас не вижу смысла рассуждать на тему того, было ли это решение правильным, имеем то, что имеем, а именно кучу кода, мигрировать который на что-то иное вряд ли получится за адекватное время одновременно с написанием новых фич. А в чем проблема, спросите вы, redux прекрасный инструмент, зачем от него отказываться? Проблема в том, что философия глобальности redux побудила команду писать код, который постепенно превратился в неподдерживаемое нечто. Вообще, конечно, странная штука – глобальные переменные испокон веков считались антипаттерном, но redux, который по сути является глобальным объектом, обрел такую популярность и повсеместное использование.  Но это так, мысли вслух.

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

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

Недавно по работе занимался тестирование очередного апи и столкнулся с таким неудобством, что все запросы требуют авторизации, а токен живёт всего 5 минут. Из-за этого приходилось постоянно делать запрос авторизации и обновлять токен вручную.

В какой-то момент мне это надоело, и я задумался как это дело автоматизировать. Узнал, что можно написать Pre-request скрипт для коллекции в постмане, который будет выполняться перед каждым запросом, а уже в этом скрипте делать запрос токена авторизации.

С какими сложностями мне пришлось столкнуться... Ну во первых пришлось немного полазить в доке постмана, но там только поверхностно описано, не смог найти как сделать запрос. Гуглёж вопросов других бедолаг мне тоже не особо помог, т.к. там были немного другие кейсы.

Мне неожиданно помогла локально запущенная лама, которая мощно сходу дала мне хорошую подсказку, как сделать в скрипте постмана запрос с телом urlencoded и сохранить из него ответ в переменные. Чем я собственно и хотел поделиться.

Итак исходное положение. Имеем некую коллекцию запросов в постмане и все креды для авторизации сохранённые в переменных.

У нас есть запрос Auth, который получает токен авторизации.

Привет, меня зовут Андрей, и я написал книгу.

Нет, не о синтаксисе и не про очередной набор «лучших практик».
А о том, что часто остаётся за кадром — в рефлексии, в мыслях после проектов, в спорах между «пишем быстро» и «делаем правильно».

Создание простого хука для работы с формами в React на основе zod

В этой статье мы реализуем удобный хук useForm, который минимизирует ререндеры и упрощает работу с формами в React, используя FormData для сбора данных и zod для валидации. Рассмотрим разницу между контролируемыми и неконтролируемыми компонентами.

И вот прошло 9 месяцев, модели стали значительно совершеннее, и качество написания кода улучшилось в разы, если не на порядок.

Тогда в своей статье «Кажется, LLM программирует лучше меня» я с изрядной долей самоиронии описал в подробностях пошагово написание кода игры «Шарики», Lenes (Color Lines).

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

Поэтому проведем такой же эксперимент с новейшей моделью такого же размера и попробуем на экспертном уровне оценить степень прогресса в данной области.

Что изменилось за это время?

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

В первой части мы построили бэкенд на FastAPI, Aiogram, Redis и Centrifugo, заложив основу для анонимного чата в Telegram. Теперь пришло время развернуть фронтенд и создать стильный и отзывчивый интерфейс с использованием VueJS 3 в формате Telegram MiniApp.

В этой статье мы:

• Разработаем интерактивный UI с фильтрами поиска, анимациями загрузки и real-time чатом.
• Настроим мгновенный обмен сообщениями через Centrifugo без лишних запросов к серверу.
• Интегрируем монетизацию для заработка на рекламе в приложении.
• Выполним деплой на удаленный сервер и подготовим проект к продакшену.

Если вы хотите создать быстрый, удобный и монетизируемый анонимный чат в Telegram, который работает без задержек и перезагрузок, — эта статья для вас!

В этой статье мы рассмотрим 16 обязательных для любого Node.js‑разработчика NPM‑пакетов. Мы подробно расскажем о них, включая их ключевые особенности, как их установить и как именно вы можете использовать их в своих проектах для улучшения ваших рабочих процессов.

Я ранее описал принципы, которыми руководствуюсь при разработке веб-приложений, а также требования, предъявляемые со стороны платформы TeqFW к JS-коду. В этой публикации я покажу, как выглядит код типового модуля платформы, где не используется статический импорт. Хочу сразу отметить, что кажущаяся сложность материалов обусловлена непривычностью представленных концепций. Наработанный опыт и инерция мышления — сильные вещи! Тем, кто имеет ограниченный опыт в JS-разработке, этот материал будет проще для восприятия, в то время как опытным разработчикам предстоит преодолеть барьер устоявшихся привычек. На мой взгляд, несмотря на то что "TypeScript — это суперсет JavaScript", самыми сложными концепции платформы станут именно для TS-разработчиков.

Ну, вот - я предупредил, дальнейшее чтение - на ваш страх и риск.

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

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

Если вы тоже ищете способы сделать свой код чище и поддерживаемым, или просто хотите обсудить разные подходы к архитектуре, — добро пожаловать в комментарии. Давайте разбираться вместе!

Рассмотрим типичный сценарий разработки фронтенд-приложений. Бизнес выдвигает требования, которые постепенно усложняют компоненты. Это приводит к проблемам сопровождения, особенно в больших проектах.

В этой статье поделюсь быстрым способом настройки геотаргетинга на nginx + GeoIP2 в связке с локализацией Next.js на примере решения реальной задачи.

Вы узнаете как подключить и настроить GeoIP2 к nginx, как приоритизировать и настроить критерии выбора домена и локали, и как подружить это с Next.js