Как стать автором
Поиск
Написать публикацию
Обновить
320.43

JavaScript *

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

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

Пошагово создаём QR-код

Уровень сложностиСредний
Время на прочтение4 мин
Количество просмотров2.8K
В этой статье (оригинал представляет собой интерактивное приложение на JavaScript) подробно описывается, как текстовая строка кодируется в символ QR-кода. Она, по сути, объясняет, как устроена внутри моя библиотека генератора QR-кодов.

Пользовательский ввод




Результат генерации QR-кода



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

signals в качестве альтернативы useState в React

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

Привет, хабр! Больше года назад я впервые узнал про сигналы, а три месяца назад @Sin9k записал видео на эту тему. И поскольку сигналы по-прежнему обходят стороной, попробую немного исправить ситуацию)

В материале будет использоваться обёртка signals-react, так как изначально рассматриваемая библиотека написана под Preact.

Читать далее

Почему TeqFW использует только ES-модули?

Уровень сложностиСложный
Время на прочтение6 мин
Количество просмотров335

Ни у кого не получится показать другому то, что тот не хочет или не может увидеть. Объяснять и показывать нужно только тем, кто а) может понять, б) хочет понять. В этой публикации я демонстрирую пару своих документов для LLM, которые предписывают "силиконовым", какими правилами им следует руководствоваться при создании кода для моей платформы. "Силиконовым" можно впаривать любую дичь - они всеядные (могут понять) и покладистые (согласны понять). За это мы их и любим!

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

Читать далее

От идеи до деплоя: как поднять приложение на Cloudflare Workers

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

В предыдущей статье мы обсудили плюсы и минусы использования воркеров для cloud-native разработки. Сегодня же мы настроим и задеплоим полноценное приложение с фронтом, бэком, базой данных, горизонтальным мастшабированием, http/3, капчей и бесплатным поддоменом менее, чем за час.

Итоговый результат можно увидеть тут (только через VPN).

Читать далее

Оркестрация чатов LLM моделей через Redis

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

🐝 Оркестрация чатов LLM через Redis

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

Читать далее

Cложить два числа-гиганта или почему я прошел квест на собеседовании а на работу в BigTech взяли ChatGPT?

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

Евгений Жуков (@EvgeniiZhukov) написал статью «Сложить два числа‑гиганта: как я прошел квест на собеседовании в Бигтех».

Я решил развить мысль и проверить, как ChatGPT сможет пройти собеседование и устроиться на работу в BigTech. Стоит ли опасаться AI и сможет ли ChatGPT предложить решения, которые ни автор статьи ни авторы комментариев не смогли найти. Что остается делать простому front-end джуну в современном мире и как все-таки вкатиться в IT.

Читать далее

DOM-Scope: создание искусственных областей видимости и управление идентификаторами элементов

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

В процессе работы с HTML-документами часто возникает необходимость получить доступ к конкретным элементам DOM. Обычно это делается с помощью уникальных идентификаторов, которые присваиваются нужным элементам. Однако существует вероятность, что в большом документе может оказаться несколько элементов с одинаковыми идентификаторами, что может привести к путанице.

Чтобы избежать этой проблемы, я разработал библиотеку dom-scope, которая позволяет создавать искусственные области видимости (скоупы) внутри DOM. Я хочу поделиться своим решением с сообществом Хабра.

Читать далее

Понимая реактивные системы: искусство планирования зависимостей

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

В этой статье мы продолжим разбирать базовые концепции реактивности на основе идей и примеров, изложенных Райан Карниато (Ryan Carniato), автором SolidJS. Сегодня рассмотрим, как в реактивных системах планируется выполнение изменений производных значений.

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

Читать далее

Yandex индексация для SPA приложений

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

Год с небольшим назад я проводил здесь испытания, как поисковики индексируют SPA сайты. На тот момент Google справился на отлично, Yandex - не очень

Сейчас Yandex хорошо проиндексировал SPA сайт на Vue 3.

Читать далее

Выбор локальной LLM модели. Публикация на сайт с чатом

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

🐝 Выбор локальной LLM модели. Публикация на сайт с чатом.

В мире нейросетей - хайп. Не всегда заявления производителя соответствуют действительности, например, на бумаге DeepSeek R1 поддерживает русский язык, на деле не всё так гладко. Данная статья содержит подборку LLM моделей, хорошо работающих с русским языком и имеющих возможность tool calls - вызов внешних python/nodejs функций для интеграции в стороние сервисы

Читать далее

Рекомендуемые библиотеки для React

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



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


React позволяет разработчикам создавать пользовательские интерфейсы (user interfaces, UI) на основе функциональных компонентов. Хотя он предоставляет встроенные решения, такие как хуки (hooks), для управления локальным состоянием, обработки побочных эффектов и оптимизации производительности, в конечном итоге все сводится к работе с функциями — как компонентами, так и хуками — для построения UI.


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


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

Прожариваем React

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

Привет, Хабр! Я уже рассказал, что умею разнообразно писать счётчики . Пришло время сделать шаг вперёд! Сегодня поговорим о том инструменте, который я и миллионы разработчиков используют ежедневно. Речь пойдёт о великом и ужасном ReactJS.

Я пишу на React с 2018 года, делаю это, на мой взгляд, более-менее сносно. Мне нравится тезис о том, что профессионализм заключается не только в умении использоваться достоинства инструмента, но и в умении чётко видеть его недостатки.  Поэтому возникла идея сделать что-то типа прожарки React, указав на лично меня раздражающие моменты. С какими-то я смирился, с какими-то нет, что-то научился обходить. Если вас бесит в React что-то, что я не упомянул, не стесняйтесь писать в комментариях, было бы очень интересно сравнить мои ощущения с вашими.

И важное: несмотря на указанные ниже проблемы, я до сих пор считаю React прекрасным и удобным инструментом для создания фронтенда, в частности SPA.  Громких слов типа «ReactJS не пригоден для разработки» тут не будет - пригоден, да ещё как! Но... и на Солнце бывают пятна. Приступим.

Читать далее

Визуальный редактор для вашего сайта – Бесплатно и с открытым исходным кодом

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

У вас есть контент на сайте? Хотели бы редактировать его визуально, без необходимости погружаться в код?

Intlayer Visual Editor – это бесплатный инструмент с открытым исходным кодом, который позволяет редактировать контент вашего веб-приложения прямо в визуальном интерфейсе.

Читать далее

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

Дзен и публикация картинок

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

Привет, Хабр! Сегодня я хотел бы поговорить с тобой о проблеме публикации картинок. Зачем вообще об этом говорить? Ежедневно миллионы людей публикуют миллионы, или даже, миллиарды изображений, что тут можно обсуждать? Наверняка, для веб-разработчика, тем более, опытного - это вообще никакая не проблема.

Эх, как бы не так.

Сложить два числа-гиганта: как я прошел квест на собеседовании в Бигтех

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

 Привет, Хабр! Меня зовут Евгений Жуков, я работаю в Битриксе мобильным разработчиком. Моя основная задача — создавать приложения, которые упрощают бизнес-процессы. А еще я обожаю разбирать задачи с собеседований: они как головоломки, которые не только проверяют знание алгоритмов, но и учат видеть не очевидные подходы к коду. Хочу делиться такими кейсами — вдруг это поможет кому-то пройти сложное интервью или вдохновит на новые идеи. Поехали? 😊

Сценарий: вы на собеседовании, ожидаете вопросов про React, WebGL или хотя бы про Event Loop. А вместо этого получаете: «Напишите функцию сложения двух чисел в столбик, но числа передаются как массивы.

«Что? — думаете вы. — Это же уровень начальной школы! Где мои хитрые асинхронные задачи?» Но не спешите радоваться. Я тоже недооценивал эту задачу, пока не попытался реализовать её на JavaScript. 

Читать далее

«Философия платформы TeqFW» или «Как усложнить себе жизнь, делая вид, что это инновация»

Время на прочтение8 мин
Количество просмотров614

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

Всё изложенное касается только разработчиков на JavaScript (JS !== TS).

Философия Tequila Framework (TeqFW) — это мой личный взгляд на организацию разработки веб-приложений. Я, Алекс Гусев, сформировал этот подход, исходя из собственного опыта, который сосредоточен на модульных монолитах с одной базой данных. Этот документ отражает именно такой контекст и не претендует на универсальность.

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

Документ предназначен для формирования когнитивного контекста как у естественных интеллектов, так и у искусственных. В нём затрагиваются как специфические аспекты веб-разработки, так и более общие вопросы архитектуры ПО, с упором на снижение избыточной сложности, улучшение структурированности и адаптируемости к изменениям.

Читать далее

Как интегрировать миниапп (активность) в Discord

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

Привет! Я Егор Стеблин, фронтенд-разработчик в юните спецпроектов KTS.

В этой статье я расскажу о том, каким образом в Discord можно встроить свой миниапп (a.k.a. «активность»). Для тех, кто еще не сталкивался с этим понятием: активности — это интерактивные приложения, которые можно запустить в Discord. Они могут интегрироваться со следующей функциональностью Discord:

получение информации о пользователе;

голосовой и текстовый чаты;

данные профиля и встроенная монетизация.

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

Ниже я опишу процесс создания Discord-активностей от инициализации приложения на портале Discord до написания кода и его тестирования.

Читать далее

Playwright: игра в скриншотные тесты

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

Работа с Playwright всегда доставляет мне удовольствие. «Наиграв» уже десятки, если не сотни часов в библиотеке, решая проблемы, копаясь в исходниках или на просторах сети, я практически всегда находил удачное решение. И это я списываю не столько на свой опыт, сколько на удобство самой библиотеки. Чаще всего удачные решения находились уже в коробке. А то, что приходилось допиливать руками, всегда сопровождалось ощущением игры и веселья – настолько приятно и легко работать с этим инструментом. Вот уже год, как наши тесты работают стабильно без каких-либо значимых изменений. Сегодня я расскажу вам о скриншотных тестах, реализованных на основе Playwright и Storybook.

Читать далее

Интерактивные метки на изображении JS

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

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

Данный скрипт позволяет создавать адаптивные изображения с интерактивными метками. Скрипт по умолчанию поддерживает до 50 меток на изображении.

Читать далее

TypeScript 7 в 10 раз быстрее: анонс нативного компилятора TSGO

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

11 Марта вышел аннонс Typescript 7, в котором рассказали о разработке нового tsgo компилятора.

Андерс Хейлсберг объявил о следующем этапе в развитии Typescript, направленном на кардинальное повышение производительности.
Основная ценность Typescript — это удобный опыт разработки, с ростом кодовой базы эта ценность становится всё более очевидной. Но, как показала практика, текущая реализация часто не справляется с очень крупными проектами. Разработчики сталкиваются с долгим временем загрузки, медленным автокомплитом и проблемами с производительностью.

Нативный порт компилятора на Go - tsgo доступен в репозитории на GitHub - typescript-go. Уже сейчас его можно потестировать и попытаться собрать какой-нибудь проект, но пока реализовано 80% функционала языка. А завершить разработку tsgo обещают в пределах 2025 года.

Читать далее

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