Прототипно-ориентированный язык программирования
Привет, друзья!
Представляю вашему вниманию перевод этой замечательной статьи.
Данная статья включает в себя:
интерфейса Node.js для работы с файловой системой (далее — ФС);Если вам это интересно, прошу под кат.
В этой статье я хочу затронуть еще одну задачу, с которой вы можете столкнуться на собеседовании на позицию Front-End — создание Star Rating виджета.
За последние пять месяцев у меня было 15 онсайт собеседований, а также офферы от Google, Roku, Microsoft и других компаний.
Вы должны уточнить требования и реализовать этот виджет в течение ~ 45–50 минут.
Сегодня мы рады представить новую версию сервера Centrifugo — Centrifugo v4. Релиз выводит Centrifugo на новый уровень с точки зрения эффективности клиентского протокола, простоты фоллбеков для WebSocket, экосистемы клиентских SDK и модели безопасности каналов. Также релиз включает в себя экспериментальную поддержку HTTP/3 и WebTransport.
Я потерял много времени, пытаясь найти решение — как осуществить обмен данными между vue.js и Phaser. Этот вопрос заинтересовал меня, т.к. все что не касается игровой механики, намного удобнее и быстрее делать вне игрового движка, например: авторизация и вывод игровой статистики.
Поскольку у меня есть некоторый опыт работы с Vue.js, то я решил использовать его для этих целей.
Поскольку Phaser работает как отдельное приложение, то вы не можете передавать или извлекать информацию из него, для этого вам потребуется немного пофантазировать.
Я не мог найти, как передать какую-то переменную в Phaser через процесс инициализации игры или как достучаться из него во Vue. Казалось бы, у обоих инструментов есть большие комьюнити, но я нашел лишь много подобных вопросов на форумах или под видео на YouTube — и все они либо без ответа, либо содержат не рабочие или не полноценные ответы. Я решил написать эту короткую статью, потому что надеюсь помочь другим энтузиастам, которые находятся в самом начале пути.
Продолжение разработки простого проекта про specialty-кофейни на Кипре.
В первой части я рассказал про API микросервис, теперь расскажу про фронтэнд-сайт и в финальной статье - про бота для Telegram.
Вспоминается мем, где человек говорит: «JavaScript — это круто, на нем можно делать роботов и мобильные приложения», а потом его душит собака. Я себя представляю таким человеком, но надеюсь, меня никто не задушит, потому что я делаю на JavaScript вещи, которые в принципе не положено на нем делать. Например, пульт управления машинкой с телефона или любого другого устройства. Прошивка, и вообще всё на JS. Мы разберем подробнее такую машинку, джойстик, часы и другие устройства, и посмотрим как их самостоятельно запрограммировать.
Меня зовут Илья Черторыльский, я Senior Community Lead в Райффайзен банке. Эта статья про WebBluetooth, WebUSB, WebSerial и WebHID. Полную версию выступления можно посмотреть на YouTube.
При работе с несколькими проектами Vue, использующими одну и ту же систему дизайна, эффективнее и быстрее иметь библиотеку компонентов, на которую можно ссылаться для всех ваших компонентов в разных проектах. В этой статье мы рассмотрим шаги, необходимые для создания и развертывания библиотеки компонентов Vue в npm, чтобы мы могли повторно использовать их в различных проектах.
Примечание переводчиков: статья предназначена для начинающих разработчиков и интересующихся разработкой. Здесь нет глубоких технических деталей, хотя, возможно, вы найдете что-то новое для себя.
В прошлой статье мы обсудили навигацию и получение данных. Сегодня поговорим о HTML- и CSS-парсинге и выполнении JavaScript.
Содержание:
1. HTML-парсинг:
— Парсинг
— Браузерные движки
— Токенизация
— Построение DOM
— Предварительные загрузчики и ускорение страницы
2. CSS-парсинг:
— Токенизация и построение CSSOM
3. Выполнение JavaScript:
— Движки JavaScript
— Компиляция
— Интерпретация
— Комплияция Just-In-Time
— Как обрабатывается код JavaScript
Хочешь устроить очередной… кхм… спор о том, какой фреймворк лучше и прослыть хайпожором — напиши статью «фреймворк ХХХ кулл, остальных на кол». Но когда твой выбор влияет на стек всей компании, объясняться все равно приходится — с коллегами, заказчиками, подрядчиками. Чтобы не повторять сто раз одно и то же, запишу аргументы в этой статье. Так что приглашаю к обсуждению самих «пострадавших» и поехали!
Всем привет, не так давно ко мне в команду в ПРОФИ пришла задача реализации довольно комплексной в плане верстки и интерактивности карты, на которой бы отображались заказы, оставленные нашими клиентами. Мы решили использовать фреймворк, адаптирующий яндексовый SDK под реакт.
react-yandex-maps + доки к нему
UI маркеров почти полностью приходится настраивать по докам уже Яндекса, тк react-yandex-maps предоставляет нам только внешний интерфейс, позволяющий довольно удобно прокинуть параметры в объект маркера как пропсы.
По докам яндекса довольно просто понять, как сделать маркер с статичной картинкой вместо дефолтного пина, но как сделать полностью кастомный маркер разобраться не просто.
Все браузеры элементу body добавляют внешний отступ со значением 8px (margin 8px). Это часть таблицы стилей по умолчанию, рекомендованных w3c. Но почему именно 8px? Откуда такая тенденция?
В этой статье я хочу затронуть задачу, с которой вы можете столкнуться на собеседовании на позицию Front-End — создание Image Slider.
За последние 5 месяцев у меня было 15 онсайт собеседований, а также офферы от Google, Roku, Microsoft и других. (Больше информации можно прочитать в моем Telegram-канале)
Вы должны реализовать этот виджет за ~45–50 минут и рассказать об оптимизации. Эту информацию я постараюсь рассказать здесь. Основная цель состоит не в том, чтобы реализовать Image Slider с большим количеством функционала, а в том, чтобы показать, как реализовать и оптимизировать.
Disclaimer: Безусловно, эта статья для начинающих кодеров на React. Опытный и не очень react-разработчик не найдет тут ничего полезного. Разве что может указать на ошибки(буду благодарен).
Построение и декомпозиция проекта
Никакой сложной архитектуры и декомпозиции не будет. Цель проекта - показать часто встречаемое применение хука useState и связка javascript кода с html элементами в одном компоненте. Всего будем использовать только три файла: App.js, App.css и Gradient.js.
⚛ Проектируем DataGrid на React так, чтобы сэкономить Boilerplate
Хорошо продуманная архитектура позволяет не только избежать legacy, но и отдать часть рутины менее квалифицированным кадрам. Думаю, будет уместно поделиться заметками о проектировании DataGrid, так как скорее всего вы уже сталкивались с копипастой)
Решение задачи и пояснение алгоритма: Есть n стандартных игральных костей (6-ти гранных кубиков) со стандартным обозначением всех граней от 1 до 6. Бросаем все n кубики разом. Нужно найти вероятность выпадения числа k, а именно суммы всех значений, выпавших на этих кубиках
Прекратите использовать console.log для всего ?. Я вижу, как многие разработчики регулярно используют console.log метод таким образом, который я считаю неправильным.
Недостатки использование console.log для отладки
Многие разработчики до сих пор используют console.log метод для отладки своего приложения. Например, чтобы убедиться, что код запускается или что переменная имеет правильное значение.
Вы не можете отследить жизненный цикл вашего приложения, лишь отслеживаете значение переменной в данный момент времени.
Часто случается так, что console.log забываются в нескольких местах кода, что кроме гипотетической потери производительности (мизерной, но размер которой варьируется в зависимости от объема данных, вызываемых через метод console.log) загрязняя ваш код.
Решение состоит в том, чтобы использовать инструменты отладки, предоставляемые вашим браузером. Это может потребовать некоторого обучения, но вознаграждение перевешивает усилия ?.
⚛ Джентльменский набор React компонентов FullStack разработчика для управления потоком данных.
В этой статье я рассказываю, как сэкономить время на рутинной загрузке данных с сервера и отображении значений в верстке когда Redux или другой контейнер состояния избыточен.
