Все потоки
Поиск
Написать публикацию
Обновить
209.19

JavaScript *

Прототипно-ориентированный язык программирования

Сначала показывать
Порог рейтинга
Уровень сложности

Кликджекинг по двойному щелчку. Новый приём обманного UI

Время на прочтение4 мин
Количество просмотров3.9K


Кликджекинг (подделка UI) — известный приём обмана пользователей интернета, когда поверх видимой страницы располагается невидимый слой, куда загружается фальшивка. То есть пользователю кажется, что он вводит пароль на доверенной странице, но на самом деле вводит его в стороннюю форму, которая принадлежит злоумышленнику.

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

Однако несколько месяцев назад в Сети впервые замечены случаи кликджекинга по двойному щелчку. Вредоносные действия выполняются в промежутке между первым и вторым кликами незаметно для жертвы. Более продвинутая версия атаки работает практически на всех сайтах и в любых браузерах.
Читать дальше →

Представляю @vue-dnd-kit/components: Готовые компоненты для быстрой разработки интерфейсов с перетаскиванием

Уровень сложностиПростой
Время на прочтение8 мин
Количество просмотров7K

Представляю vue-dnd-kit/components — готовые компоненты для быстрой разработки drag & drop интерфейсов в Vue 3!

📋 Сортируемые таблицы
📊 Канбан-доски
🌳 Древовидные структуры
🧩 Интерактивные дашборды

CLI работает как shadcn/ui — компоненты клонируются в ваш проект, давая полный контроль над кодом. Проект в активной разработке, но уже готов к использованию!

Готовые компоненты: Table, Kanban, Tree, Dashboard.

Статус: бета, API может изменяться. Подходит для прототипов и активной разработки.

Читать далее

Как создать простое API? Express + Prisma

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров2.2K

Эта статья поможет вам быстро написать API, используя Express и Prisma). Для этого вам понадобятся базовые знания работы с Node.js и понимания разработки реляционных баз данных

Читать далее

Разработка LLM моделей для обновления кода приложений на более высокие версии фреймворков или языков программирования

Уровень сложностиПростой
Время на прочтение12 мин
Количество просмотров2.7K

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

Читать далее

Мой первый боевой проект: FSD, TanStack и как мы это дружили

Уровень сложностиСредний
Время на прочтение7 мин
Количество просмотров4.3K

Тут я расскажу о том, как я впервые с нуля поднимал проект на React, используя связку FSD, TanStack Router, TanStack Query и Effector — и как мы всё это далее подружили подружили или нет 🙂.

Сразу оговорюсь:
Проектом занимается команда, но архитектурный старт, выбор технологий и базовая структура — легли на меня. Это был мой первый опыт в такой роли: отвечать не просто за компоненты или страницы, а за фундамент проекта.
А так же, это моя первая статья. Не претендую на истину в последней инстанции, но надеюсь, кому‑то мой опыт будет полезен и палками бить сильно не будете.

Читать далее

Я устал от ограничений Strava и написал свой «швейцарский нож» для анализа тренировок на Python и FastAPI

Уровень сложностиСредний
Время на прочтение7 мин
Количество просмотров16K

Всем привет! Я — разработчик и велосипедист, которому надоели ограничения Strava. Знакомы боли: GPS‑треки с «телепортами», платный анализ по зонам и неудобная загрузка сегментов на Garmin? Я решил исправить это и написал свой «швейцарский нож» для анализа тренировок.

Под катом — история создания pet‑проекта Peakline на Python, FastAPI и Vanilla JS. Расскажу, как устроен продвинутый FIT‑генератор для гонок с «призраком», как визуализировать исправление «сломанных» GPX‑треков и как заставить график и карту работать в связке. Поделюсь фрагментами кода, архитектурными решениями и подводными камнями при работе с API Strava.

Узнать, как это сделано

Русскоязычные LLM для вызова инструментов, переводов и финансовой аналитики

Уровень сложностиПростой
Время на прочтение2 мин
Количество просмотров3.3K

🧠 Русскоязычные LLM для вызова инструментов, переводов и финансовой аналитики

Подборка моделей, которые действительно позволяют отказаться от OpenAI и вести разработку в закрытом контуре без подключения к интернету 🔌

Читать далее

Как я делал автопуть для игры на Phaser (TypeScript)

Уровень сложностиСредний
Время на прочтение4 мин
Количество просмотров1.4K

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

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

Позже я добавил NPC с простым AI: они могут преследовать игрока, если тот находится рядом. В этой статье речь пойдёт только о построении пути.

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

БУ, испугался, не бойся, я друг, я тебя...

Vue 3: Почему ref() — это новая ссылка, а reactive() — обёртка?

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров4.3K

Если вы работаете с Vue 3, вы точно сталкивались с ref() и reactive(). Обе функции из Composition API делают значения реактивными — но делают это по-разному. И хотя документация Vue чётко указывает, что использовать в каком случае, она редко объясняет, почему это важно и что может пойти не так, если использовать не тот инструмент.

Вот ссылки на официальную документацию — на всякий случай:

Читать далее

Как переносить «висячие» слова на следующую строку с помощью JavaScript

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров2.5K

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

Читать далее

Frontend Risks #1: CMS Битрикс отправляет данные ваших клиентов в Ирландию

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров4.8K

В результате проведенного мной исследования безопасности 3000 российских frontend-приложений было обнаружено, что CMS Битрикс более 11 лет передает персональные данные посетителей сайтов на территорию Ирландии. Компании рискуют получить штрафы Роскомнадзора за трансграничную передачу данных без уведомления регулятора.

Читать далее

Postman + Newman: быстрый старт API-автотестов на практике

Уровень сложностиСредний
Время на прочтение8 мин
Количество просмотров5.8K

Автоматизация тестирования API — задача, с которой сталкиваются даже опытные инженеры, но многие всё ещё предпочитают полагаться на ручные запросы в Postman, а затем переносят их в код — и так годами. Но можно ли избежать этого лишнего шага? В этой статье мы покажем, как настроить эффективную автоматизацию тестов API с Postman и Newman, интегрируя их в процессы CI/CD, чтобы избежать ошибок и повысить производительность.

Читать далее

Золотое сечение в дизайне 2025: Современные подходы к применению в веб и мобильном дизайне

Уровень сложностиСредний
Время на прочтение8 мин
Количество просмотров2.9K

Сегодня я хочу поделиться глубоким исследованием того, как применять золотое сечение в современном дизайне 2025 года. Эта статья основана не только на теории, но и на реальном опыте работы с крупными проектами, A/B тестах и исследованиях пользователей.

Читать далее

Ближайшие события

Почему Feature-Sliced Design (FSD) не спасет ваш проект

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров4.6K

Каждый разработчик рано или поздно сталкивается с вопросом: как организовать проект так, чтобы он не превратился в хаос? Или как исправить проект, в котором уже царит хаос?

Начинается всё одинаково: мы делаем простое MVP или проект с ограниченным функционалом, не заморачиваемся по поводу архитектуры и организации кода, ведь проект небольшой и несложный, а сделать его нужно уже здесь и сейчас. Но время идёт, и у бизнеса появляются всё новые требования. Какие‑то изначальные идеи полностью отменяются или меняются до неузнаваемости, разрастается команда, дизайн меняется несколько раз, появляется необходимость покрыть проект тестами, а иногда и необходимость вообще сменить стек технологий. И вот вы уже работаете над кодом, в котором становится всё сложнее вносить изменения в существующий функционал. Всё держится на костылях, становится трудно ориентироваться в куче файлов, и кажется, что всё устроено как‑то не так, как должно быть.

В этот момент мы начинаем задаваться вопросом: «а как нужно писать и организовывать код на самом деле?». В поисках ответа мы читаем статьи, смотрим обучающие видео, доклады и неизбежно натыкаемся на Feature‑Sliced Design (FSD).

Читать далее

Как мы распилили монолит на микрофронтенды с Vite и не сошли с ума

Уровень сложностиСредний
Время на прочтение9 мин
Количество просмотров7.8K

Наш фронтенд начинался как простой SPA на React, собранный с помощью Vite — типичный монолит с несколькими страницами. Со временем проект оброс новыми функциями и интеграциями и начал становиться всё сложнее в поддержке.

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

После изучения разных вариантов мы остановились на подходе микрофронтендов. Хотелось разграничить зоны ответственности между командами и ускорить разработку, не теряя гибкости. В качестве сборщика решили остаться на Vite — он быстро развивался, предлагал отличную DX и поддержку модульной федерации через плагин. Кроме того, важно было сохранить единый репозиторий, чтобы упростить CI/CD и управление зависимостями.

Читать далее

document.currentScript: что такое и с чем едят

Уровень сложностиПростой
Время на прочтение9 мин
Количество просмотров3K


Сначала я недооценил document.currentScript, но оказалось, что он отлично подходит для передачи параметров конфигурации прямо в теги <script> — и это далеко не все.


Порой я натыкаюсь на давно существующие браузерные API в JavaScript, о которых, по идее, я должен был узнать гораздо раньше. Например, window.screen или метод CSS.supports(). К счастью, я понял, что не один такой. Помню, как однажды упомянул window.screen в посте и получил неожиданно много комментариев от людей, которые тоже впервые о нем слышали. Это меня немного приободрило — я почувствовал себя не таким уж глупым.


Видимо, дело не в том, как давно существует API, а в том, насколько он полезен в реальных задачах. Если window.screen почти нигде не используется, о нем легко забыть.


Но иногда все же появляется неожиданный шанс применить одну из этих малоизвестных возможностей. Похоже, я как раз нашел такой случай для document.currentScript — и намерен использовать его по максимуму.

Читать дальше →

Используйте Camunda как удобный REST-движок для оркестрации и workflow — без необходимости работать с Java

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров5K

Я много общаюсь о микросервисных архитектурах с «не-Java-людьми» — будь то разработчики на C#, энтузиасты Node.JS/JavaScript или GoLang. Все они сталкиваются с необходимостью оркестрации в микросервисной архитектуре — или просто хотят использовать workflow, упорядочивание действий, обработку таймаутов, Saga и компенсации, а также другие полезные возможности.

Open Source BPM-платформа Camunda отлично подходит для этих задач. Ориентированность на разработчиков — один из ключевых принципов продукта, но при изучении документации может показаться, что она рассчитана в основном на Java-разработчиков. Платформа предоставляет множество точек расширения и интеграции, но всё это реализуется на Java. Значит ли это, что другим разработчикам путь закрыт?

Нет! На самом деле, запустить Camunda и работать с ней без знания Java очень просто — архитектуру можно выстроить так, чтобы писать код на любом удобном языке. В этом посте:

Читать далее

Dagaz: Вторжение в трёхмерность

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров961
Представь себе, что ты находишься в Плоскомире, и вдруг кто-то предлагает тебе заглянуть в мир трех измерений. Разве это не покажется тебе безумием?

Эдвин Эбботт, "Флатландия"



Эта статья про застарелые комплексы, а также про успешное их преодоление. Восемь лет назад, Dagaz создавался не на пустом месте. В его основу легли Zillions, Axiom и… Jocly. Как раз с последним и было связано больше всего терзаний. Сейчас Jocly выглядит как 100%-ый 3D-проект, но так было не всегда. Когда-то в нём были 2D-игры (например манкалы). Где они теперь? Всё просто, разработчики выпилили их из проекта, поскольку посчитали, что те не вписались в новую концепцию трёхмерности. Было понятно, что это не путь для Dagaz, но какой путь для Dagaz было непонятно…
Читать дальше →

10 Принципов отказоустойчивости (с примерами на Javascript)

Уровень сложностиСредний
Время на прочтение12 мин
Количество просмотров5.9K

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

Хорошая отказоустойчивость начинается с мышления.

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

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

Перейти к 10 принципам

Быстрый Frontend в 2025: почему RTK Query, Tailwind и Vite убивают классические подходы

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров18K

Ни для кого ни секрет, что разработка и IT‑решения в 2025-м году — это гонка за скоростью: от выяснения бизнес‑требований до финальной версии продукта. Чем быстрее пишется код, тем раньше ваш продукт попадает к пользователям. Разумеется, выбор технологий существенно сказывается на скорости разработки.

В этой статье я бы хотел затронуть современные инструменты Frontend‑разработчика, которые уже начали вытеснять классику, а также попутно сокращают объём кода, избавляя разработчика от рутины.

Читать далее

Вклад авторов