Обновить
512K+

JavaScript *

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

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

Заметка о Mapped Types и других полезных возможностях современного TypeScript

Время на прочтение9 мин
Охват и читатели26K


Привет, друзья!


Представляю вашему вниманию перевод 2 статей:


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

Мета-приложения и Symbiote.js

Время на прочтение11 мин
Охват и читатели3.9K

Определимся сразу, что мета-приложения и мета-компоненты - это еще не устоявшиеся в индустрии термины. Это скорее предложение, которое может быть принято или отвергнуто сообществом веб-разработчиков. Самое время объяснить, что конкретно мы имеем в виду.

Читать далее

Как создать игру Tetris с помощью Three.js

Время на прочтение20 мин
Охват и читатели8.4K

Вспомните, как мы играем в «Тетрис». При движении блока мы свободно перемещаем и вращаем его. Кубы, из которых состоят блоки, соединены, поэтому должно быть соединено и их описание в коде. С другой стороны, когда мы завершаем горизонтальный срез (в 2D это строка), кубы удаляются и блок, к которым они принадлежали, на этом этапе уже не важны. На самом деле, они и не должны быть важны, ведь некоторые кубы из блока могут удалиться, а другие остаться на поле.

Для отслеживания начальной точки куба пришлось бы постоянно разделять и объединять геометрию, и поверьте мне, это был бы сущий хаос. В оригинальном двухмерном «Тетрисе» показателем исходного блока был цвет квадрата. Однако в 3D нам нужен удобный способ демонстрации оси Z, и лучше всего для этого подходит цвет.

В нашей игре кубы будут соединены, когда они динамичны и разделены, когда они статичны.
Читать дальше →

Выходим за пределы JVM. Объясняем на крестиках-ноликах чем хорош Kotlin Multiplatform

Время на прочтение31 мин
Охват и читатели16K

Какой есть общий недостаток у мобильной, front-end и back-end разработки и иногда распила микросервисов? Дублирование логики. Очень часто я видел статьи или новости, где одна команда мобильных разработчиков ждет другую, чтобы выкатить релиз. И если с мобильными версиями более-менее все понятно и есть решения, то что делать с браузером? Очень часто логику работы приложения нужно поддержать и там.

Что делать, если хочется писать нативный код и при этом не иметь дублей реализации — на этот вопрос я постараюсь ответить подробно в данной статье. В процессе чтения можно будет познакомиться с технологией Kotlin Multiplatform и создать полноценный проект всем известной игры «Крестики-нолики» на трех самых популярных платформах Browser (JS), iOS (Swift) и Android (Java) с общей логикой на Kotlin.

Читать далее

Проверяем, есть ли у нативной JavaScript‑функции манкипатч

Время на прочтение7 мин
Охват и читатели7.6K

Как можно понять, была ли переопределена нативная JavaScriptфункция? Никак — или не совсем надежно. Способы есть, но полностью доверять им нельзя.

Узнать способы

Задачи на собеседованиях. Event loop. JS

Время на прочтение10 мин
Охват и читатели140K

Почти на каждом собеседовании бывает задачка на событийный цикл. И как я понял, не все до конца понимают как их решать. А решают их обычно в голове, а лучше используя бумажку и ручку. В статье я приведу способ решения через таблицу
Основной поток/Микрозадачи/Макрозадачи

Читать далее

Приватные конструкторы JavaScript

Время на прочтение3 мин
Охват и читатели6K

Месяц назад вышел новый стандарт ECMAScript 2022, который нам дал всё больше и больше ООП. На Хабре уже была статья про то, что нам представили в новом стандарте, но сегодня я хочу остановиться на том, что мы не получили. Приватные конструкторы в студию.

Разберём, что такое приватные конструкторы, зачем они нужны и попробуем создать полифил.

Попытать удачу

Как сделать много форм, не сделав ни одной

Время на прочтение8 мин
Охват и читатели11K

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

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

На самом деле есть другое решение.

Читать далее

Через Git и бэк — в фулстек: что мы узнали из опроса фронтендеров

Время на прочтение8 мин
Охват и читатели22K

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

Мы также попросили прокомментировать выводы Максима Орехова, руководителя центра компетенций по разработке веб-приложений ПСБ: картина была бы неполной без взгляда со стороны бизнеса.

Читать далее

Руководство по симулятору простого ассемблера для 8-битного процессора на Javascript

Время на прочтение12 мин
Охват и читатели8.3K

Базовое понимание принципа Eventloop

Время на прочтение4 мин
Охват и читатели51K

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

Читать далее

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

Разрабатываем чат с помощью Nest, React и Postgres

Время на прочтение17 мин
Охват и читатели26K


Привет, друзья!


В данном туториале мы разработаем чат с использованием следующих технологий:


  • TypeScript — статический типизатор;
  • NestJS — сервер;
  • Socket.IO — библиотека для работы в веб-сокетами;
  • React — клиент;
  • TailwindCSS — библиотека для стилизации;
  • PostgreSQL — база данных (далее — БД);
  • PrismaORM;
  • Docker — платформа для разработки, доставки и запуска приложений в изолированной среде — контейнере.

Функционал чата будет таким:


  • фейковая регистрация пользователей:
    • хранение имен пользователей в памяти (объекте) на сервере;
    • хранение имен и идентификаторов пользователей в localStorage на клиенте;
  • регистрация подключений и отключений пользователей на сервере и передача этой информации подключенным клиентам;
  • запись, обновление и удаление сообщений из БД в реальном времени на сервере и передача этой информации клиентам.

Репозиторий с кодом проекта.


Если вам это интересно, прошу под кат.

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

Использование шаблонов проектирования группы GoF в React

Время на прочтение9 мин
Охват и читатели14K

В этой статье поговорим о том, как написать в React многократно используемый код, используя три шаблона проектирования группы Gang-of-Four.

Читать далее

Построение архитектуры при интеграции алгоритмов шифрования в приложении для финансового учета

Время на прочтение11 мин
Охват и читатели6.3K

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

Утечка данных 150 тыс. клиентов Совкомбанка, слив исходного кода Госуслуг, потеря данных более 8 млн. пользователей сервисов доставки еды — мне продолжать? Кажется, всё это — достаточно веские причины, чтобы задуматься о безопасности. Говоря о приложениях для финансового учета, вопрос сохранности данных стоит ребром.

Читать далее

Как использовать Docker в приложениях Node.js и React

Время на прочтение4 мин
Охват и читатели64K

В этой статье поговорим о том, как разработать и запустить бэкэнд на Node.js-Express и фронтенд на React в контейнере Docker.

Читать далее

Делаем эффекты в видеосвязи, используя Canvas API и MediaPipe

Время на прочтение7 мин
Охват и читатели4.8K

Привет! На связи Влад из команды видеоплатформы Skyeng. Мы отвечаем за аудио и видео коммуникацию в образовательных продуктах, применяем WebRTC и реализуем фичи вокруг Video Conferencing. О реализации одной из них хочу рассказать: мы сделали видеоэффекты для веба.

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

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

Все сошлось. Решили делать.

Читать далее

Осенние конференции JUG Ru Group: онлайн и офлайн, Москва и Питер

Время на прочтение4 мин
Охват и читатели1.7K

Как проводить IT-конференции в 2022-м: в офлайне или онлайне? Одни люди ратуют за живое общение, а другие уже полюбили возможность подключиться из любой точки планеты. Мы решили пойти навстречу всем, и получился нестандартный конференционный формат:

— Первая пара дней проходит в онлайне, спикеры выступают удалённо. А позже ещё один день происходит старый добрый офлайн на конференционной площадке.

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

Впервые опробовали это весной, а теперь по такому принципу пройдут все конференции нашего осеннего сезона. У первой половины из них офлайн-часть пройдёт в Петербурге, у второй — в Москве. Представляем Хабру даты и подробности.


Читать далее

Frontend архитектура MVP (Model-View-Presenter)

Время на прочтение8 мин
Охват и читатели17K

Frontend сейчас сильно разрастается, всё больше компаний переписывают свои старые решения на SPA. В компании которой я работаю это не обошло стороной.

По умолчанию был выбран фреймворк Nuxt.js, т.к Vue лучше React :))
В общем суть не в фреймворке, а с чего начинаем.

что там?