Рубрика «javascript» - 389

На днях меня пропустили на хабр с моей статьёй про небольшую библиотеку PrettyForms для клиент-серверной валидации форм. Большое спасибо за внимание и за пропуск в сообщество. Честно, мне было очень приятно наконец попасть сюда)

Во второй статье, также отчасти посвященной той библиотеке, я бы хотел рассказать всем об одном простом способе разработки динамичных приложений, на основе которого я создал ранее несколько проектов. Сразу прошу проявить терпение всех, кто использует в своих проектах AngularJS и подобные прекрасные библиотеки для написания качественных и современных веб-приложений. Я нисколько не против подобных подходов к разработке и лишь хочу показать один из, так сказать, небольших лайвхаков, с помощью которого можно делать подобные приложения)

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

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

Скринкаст работы приложения

Динамичное веб-приложение на основе Laravel, PrettyForms и Backbone.js - 1

Так каким образом можно всё это сделать? Присаживайтесь поудобнее, мы уже начинаем наш рассказ)
Читать полностью »

Screeps запущена в режиме симуляции + кампания на Indiegogo - 1
Для тех, кто пропустил предыдущий пост, Screeps — это первая стратегическая MMO-песочница для программистов. В ней вы пишете настоящий автономный javascript-код, который управляет игровыми юнитами на сервере в режиме 24/7, независимо от вашего присутствия.

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

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

Это представление документа и есть одна из игрушек, доступных в песочнице JavaScript. Вы можете читать её и изменять. Она изменяется в реальном времени – как только вы её подправляете, страница на экране обновляется, отражая изменения.
Читать полностью »

Espruino Pico: миниатюрная плата разработчика с JavaScript поможет быстро освоиться в мире электроники - 1

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

Вместо этого используется JavaScript, в качестве управляющей «прослойки». Разработчики утверждают, что такое решение позволяет работать с железом напрямую, выставляя необходимые величины напряжения, и настраивая взаимодействие с внешними компонентами. От обычной АА батарейки чип может работать более 10 лет, такое низкое энергопотребления у платы.

Читать полностью »

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

image

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

Ощущая острую нехватку в такой подсветке при просмотре текстов исходников в браузере на различных it-ресурсах. Возникла идея написать расширение для браузера.

Итак, приступим.
Читать полностью »

Flow — это статический анализатор кода и набор синтаксических конструкций, для прямого указания типа переменной. В отличии от TypeScript, есть возможность делать код типизированным постепенно. Фактически можно взять любой проект на js и сразу начать использовать Flow (аналогично LESS для CSS).

Есть 3 режима:

  1. Не проверять ничего, по умолчанию
  2. Проверка без использования аннотаций (с коментарием-аннотацией, как в React)
  3. Строгое указание типа переменной (с внесением изменения непосредственно в код)

Читать полностью »

После выпуска упомянутого выше обновления многие разработчики столкнулись с проблемами. На текущий момент в Chrome проблему хоть как-то попытались исправить, а в IE10 (Document mode=«Standarts») все работает хорошо, но в более старых браузерах и режимах совместимости IE вся работа с датами развалилась.

Так сложилось, что из-за технических ограничений я вынужден поддерживать работу разрабатываемых мной приложений в IE8-9-10 и Chrome. Кроме того, для работы с датами использую библиотеку momentjs.

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

И вот настало время решить эту проблему самостоятельно.
Читать полностью »

Перед разработчикам, которые используют API Яндекс.Карт, довольно часто встаёт задача отобразить много объектов на карте. Действительно много — порядка 10 000. Причем эта задача актуальна и для нас самих — попробуйте поискать аптеки на Яндексе. На первый взгляд кажется: «А в чем собственно проблема? Бери да показывай». Но пока не начнешь этим заниматься, не поймешь, что проблем на самом деле целый вагон.

ObjectManager в API Яндекс.Карт. Как быстро отрисовать 10000 меток на карте и не затормозить всё вокруг - 1

Вопросы по большому количеству меток с завидной регулярностью поступают в наш клуб и техподдержку. Кто все эти люди? Кому может быть интересно показать на карте больше 10 меток? В этом посте я подробно рассмотрю весь вагон проблем и расскажу, как в API появились инструменты, помогающие разработчикам оптимально показать большое количество объектов на карте.
Читать полностью »

Доброго {{timeOfDay}}

Как-то затихла тема canvas-а на хабре…
Давайте вспомним солнечную систему на нём (начало, LibCanvas, Fabric.js) и напишем ещё одну версию? Теперь на graphics2d.js.

Солнечная система на graphics2d.js - 1

Читать полностью »

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

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

Пример работы библиотеки:
image
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js