Обновить
228.77

JavaScript *

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

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

Примитивы синхронизации в JavaScript: cемафоры и хоккей

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

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

Читать далее

[В закладки] Как работает браузер

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

К старту курса по Fullstack-разработке на Python делимся лонгридом от ведущего программиста компании THG. Специалистам материал будет полезен в подготовке к собеседованиям, а новичкам поможет получить целостное представление о том, что происходит у браузера под капотом.

Читать далее

Node.js: работа с файловой системой

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


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


Представляю вашему вниманию перевод этой замечательной статьи.


Данная статья включает в себя:



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

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

Как создать Star Rating виджет на React.js и оптимизировать его

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

В этой статье я хочу затронуть еще одну задачу, с которой вы можете столкнуться на собеседовании на позицию Front-End — создание Star Rating виджета.

За последние пять месяцев у меня было 15 онсайт собеседований, а также офферы от Google, Roku, Microsoft и других компаний.

Вы должны уточнить требования и реализовать этот виджет в течение ~ 45–50 минут.

Читать далее

Релиз Centrifugo v4 – маленькая революция

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

Сегодня мы рады представить новую версию сервера Centrifugo — Centrifugo v4. Релиз выводит Centrifugo на новый уровень с точки зрения эффективности клиентского протокола, простоты фоллбеков для WebSocket, экосистемы клиентских SDK и модели безопасности каналов. Также релиз включает в себя экспериментальную поддержку HTTP/3 и WebTransport.

Читать далее

Обмен данными между Phaser.js и Vue.js используя Vuex

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

Я потерял много времени, пытаясь найти решение — как осуществить обмен данными между vue.js и Phaser. Этот вопрос заинтересовал меня, т.к. все что не касается игровой механики, намного удобнее и быстрее делать вне игрового движка, например: авторизация и вывод игровой статистики.

Поскольку у меня есть некоторый опыт работы с Vue.js, то я решил использовать его для этих целей.

Поскольку Phaser работает как отдельное приложение, то вы не можете передавать или извлекать информацию из него, для этого вам потребуется немного пофантазировать.

Я не мог найти, как передать какую-то переменную в Phaser через процесс инициализации игры или как достучаться из него во Vue. Казалось бы, у обоих инструментов есть большие комьюнити, но я нашел лишь много подобных вопросов на форумах или под видео на YouTube — и все они либо без ответа, либо содержат не рабочие или не полноценные ответы. Я решил написать эту короткую статью, потому что надеюсь помочь другим энтузиастам, которые находятся в самом начале пути.

Читать далее

Прагматичная разработка-2: фронтэнд

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

Продолжение разработки простого проекта про specialty-кофейни на Кипре.

В первой части я рассказал про API микросервис, теперь расскажу про фронтэнд-сайт и в финальной статье - про бота для Telegram.

Читать далее

Write Once Run Anywhere

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

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

Меня зовут Илья Черторыльский, я Senior Community Lead в Райффайзен банке. Эта статья про WebBluetooth, WebUSB, WebSerial и WebHID. Полную версию выступления можно посмотреть на YouTube.

Читать далее

Как создать и развернуть библиотеку компонентов Vue в NPM

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

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

Читать далее

Как работают браузеры. Часть 2: парсинг и выполнение JS

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

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

В прошлой статье мы обсудили навигацию и получение данных. Сегодня поговорим о HTML- и CSS-парсинге и выполнении JavaScript.

Содержание:

1. HTML-парсинг:
— Парсинг
— Браузерные движки
— Токенизация
— Построение DOM
— Предварительные загрузчики и ускорение страницы

2. CSS-парсинг:
— Токенизация и построение CSSOM

3. Выполнение JavaScript:
— Движки JavaScript
— Компиляция
— Интерпретация
— Комплияция Just-In-Time
— Как обрабатывается код JavaScript

Читать далее

Vue здорового pragmatica. Как правильно делать выбор между React и Angular

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

Хочешь устроить очередной… кхм… спор о том, какой фреймворк лучше и прослыть хайпожором — напиши статью «фреймворк ХХХ кулл, остальных на кол». Но когда твой выбор влияет на стек всей компании, объясняться все равно приходится — с коллегами, заказчиками, подрядчиками. Чтобы не повторять сто раз одно и то же, запишу аргументы в этой статье. Так что приглашаю к обсуждению самих «пострадавших» и поехали!

Смотреть битву фреймворков

Создаём кастомный маркер в react-yandex-maps через iconLayout: template

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

Всем привет, не так давно ко мне в команду в ПРОФИ пришла задача реализации довольно комплексной в плане верстки и интерактивности карты, на которой бы отображались заказы, оставленные нашими клиентами. Мы решили использовать фреймворк, адаптирующий яндексовый SDK под реакт.

react-yandex-maps + доки к нему

UI маркеров почти полностью приходится настраивать по докам уже Яндекса, тк react-yandex-maps предоставляет нам только внешний интерфейс, позволяющий довольно удобно прокинуть параметры в объект маркера как пропсы.

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

Читать далее

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

История стиля который никто не просил или body margin 8px

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

Все браузеры элементу body добавляют внешний отступ со значением 8px (margin 8px). Это часть таблицы стилей по умолчанию, рекомендованных w3c. Но почему именно 8px? Откуда такая тенденция?

Читать далее

Создаем слайдер с изображением и текстом на React.js с нуля и оптимизируем

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

В этой статье я хочу затронуть задачу, с которой вы можете столкнуться на собеседовании на позицию Front-End — создание Image Slider.

За последние 5 месяцев у меня было 15 онсайт собеседований, а также офферы от Google, Roku, Microsoft и других. (Больше информации можно прочитать в моем Telegram-канале)

Вы должны реализовать этот виджет за ~45–50 минут и рассказать об оптимизации. Эту информацию я постараюсь рассказать здесь. Основная цель состоит не в том, чтобы реализовать Image Slider с большим количеством функционала, а в том, чтобы показать, как реализовать и оптимизировать.

Читать далее

Общий синтаксис для математических выражений

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

О математическом менеджере с единым синтаксисом.

Читать далее

Фронтенд-новости №15. CSS становится сложнее, VITE 3.0, самый высокий сайт в мире

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

Дайджест новостей и полезных статей из мира фронтенд-разработки за неделю 11–17 июля.

Читать далее

Создаем простой gradient background creator на React

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

Disclaimer: Безусловно, эта статья для начинающих кодеров на React. Опытный и не очень react-разработчик не найдет тут ничего полезного. Разве что может указать на ошибки(буду благодарен).

Построение и декомпозиция проекта

Никакой сложной архитектуры и декомпозиции не будет. Цель проекта - показать часто встречаемое применение хука useState и связка javascript кода с html элементами в одном компоненте. Всего будем использовать только три файла: App.js, App.css и Gradient.js.

Читать далее

Проектируем DataGrid на React так, чтобы сэкономить Boilerplate

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

⚛ Проектируем DataGrid на React так, чтобы сэкономить Boilerplate

Хорошо продуманная архитектура позволяет не только избежать legacy, но и отдать часть рутины менее квалифицированным кадрам. Думаю, будет уместно поделиться заметками о проектировании DataGrid, так как скорее всего вы уже сталкивались с копипастой)

Читать далее

Найти вероятность выпадения k (сумма выпавших значений) при бросании n кубиков (часть 1 из 2)

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

Решение задачи и пояснение алгоритма: Есть n стандартных игральных костей (6-ти гранных кубиков) со стандартным обозначением всех граней от 1 до 6. Бросаем все n кубики разом. Нужно найти вероятность выпадения числа k, а именно суммы всех значений, выпавших на этих кубиках

Читать далее

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