Как стать автором
Обновить
377.75
Рейтинг

JavaScript *

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

Сначала показывать
  • Новые
  • Лучшие™
Порог рейтинга
  • Все
  • ≥0
  • ≥10
  • ≥25
  • ≥50
  • ≥100

Тестируем Angular приложение. Часть 2. Тестирование сервиса

JavaScript *Angular *TypeScript *
Tutorial

В прошлой статье™, я описывал как тестировать компонент. Теперь™ же коснемся вопроса тестирования сервиса.

Читать™ далее
Рейтинг 0
Просмотры 191
Комментарии 0

Новости

React. Странные хуки: каррирование функционального компонента

JavaScript *Программирование *Функциональное программирование *ReactJS *
Из песочницы

Добрый™ день! Я начинающий фулстек-разработчик, и это моя первая™ статья™.

Сегодня я хочу рассказать, как сделать функциональные компоненты в реакте™ чуть более функциональными, а именно™ как сделать каррирование функционального компонента.

Предупреждение: в статье™ использованы как функциональные, так и классовые компоненты.

Посмотреть рецепт™ карри!
Всего голосов 5: ↑5 и ↓0 +5
Просмотры 785
Комментарии 10

To Byte or not to Byte

JavaScript *

Добрый™ вечер, Хабр. Немного отвлекусь от расчетов больших и страшных девайсов для выхода™ за пределы гравиколодца. Есть идея запустить небольшой скрипт™, рисующий красивые визуалы (которые потом можно пустить или на пиксел™-арт, или на текстуры к чему-нибудь™ хайтековому).

Читать™ далее
Всего голосов 2: ↑2 и ↓0 +2
Просмотры 1.1K
Комментарии 3

Единая™ система диалоговых окон на vue-cli при помощи™ vuex и vue-router™

JavaScript *VueJS *
Из песочницы

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

Концепция

Вся система будет работать довольно просто™, для отображения нужного нам диалогового окна надо будет всего лишь изменить один query параметр в адресной строке™ браузера, для примера назовем этот параметр ‘dialog™’. Соответственно для закрытия окна надо будет только™ убрать™ параметр ‘dialog™’.

Читать™ далее
Всего голосов 2: ↑1 и ↓1 0
Просмотры 1.6K
Комментарии 8

Телеграф на RxJS

Блог компании TINKOFF Разработка веб-сайтов™ *JavaScript *Angular *TypeScript *

На днях я смотрел кино, где оператор использовал телеграф. Он знал наизусть азбуку™ Морзе и очень быстро™ нажимал свою единственную кнопку™. Я задумался: с RxJS мы способны на большее! Давайте запилим телеграф, используя единственный fromEvent и массу интересных трюков™. Потренируемся с Dependency Injection, директивами и операторами RxJS, чтобы собрать демо, которое выглядит круто и звучит™ аутентично.

Поехали!
Всего голосов 20: ↑17 и ↓3 +14
Просмотры 2.2K
Комментарии 6

Node.js: шаблон™ сервера для аутентификации и авторизации

Блог компании Timeweb Cloud Разработка веб-сайтов™ *JavaScript *Node.JS *


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


На досуге™ разработал шаблон™ Node.js-сервера для аутентификации/авторизации, которым хочу с вами поделиться. Надеюсь, кому-нибудь™ пригодится.


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


Также обратите внимание, что в коде имеется несколько console.log для облегчения процесса разработки приложения. В продакшне они не нужны. В производственном режиме™ также не следует возвращать столь информативные message.


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


  • oidc-client™ — разработчик отказался от дальнейшей поддержки, новый мейнтейнер пока не нашелся
  • oidc-provider — рекомендация моих более опытных коллег™

Если вас интересует полноценная платформа для аутентификации/авторизации "из коробки", рассмотрите возможность использования Auth0.


Репозиторий


Сервер™ реализован с помощью Express.js


В качестве базы данных™ используется MongoDB Atlas

Читать™ дальше™ →
Всего голосов 8: ↑8 и ↓0 +8
Просмотры 4.2K
Комментарии 2

Самые популярные языки программирования 2021 года. Свежий™ хабратоп

Блог компании SkillFactory JavaScript *Программирование *Карьера в IT-индустрии Читальный зал

В прошлом декабре мы подбивали предварительные итоги и выкатили рейтинг популярности языков™ программирования. Пришло™ время для обновлений! В Хабратопе-2021 рассказываем, как менялись позиции  ЯП в рейтингах TIOBE, PyPL и Stack Overflow. А если хочется увидеть выжимку, сразу переходите в раздел™ итогов™. Поехали!

Читать™ далее
Всего голосов 58: ↑36 и ↓22 +14
Просмотры 35K
Комментарии 82

Убираем JavaScript. Как при помощи™ htmx красиво использовать HTML и уменьшить объем кода

Блог компании Хекслет Разработка веб-сайтов™ *CSS *JavaScript *HTML *

htmx — инструмент для создания сложных и интерактивных веб-приложений на HTML, альтернатива клиентскому рендерингу на Javascript. В этой статье™ рассказываем, как библиотека помогает переиспользовать элементы на сервере, сократить объем кода на Javascript и отказаться от сборки™.

Читать™ далее
Всего голосов 15: ↑12 и ↓3 +9
Просмотры 11K
Комментарии 16

Создаем полезное расширение для Хабр Фриланса — Часть первая™

JavaScript *Google™ Chrome™ Расширения для браузеров Фриланс
Из песочницы

Сегодня сделаем расширение для фрилансеров очень хорошей биржи Хабр Фриланс, я там сам работал еще в 2018 году, тогда сайт назывался еще Фрилансим. Расширение будет уведомлять о новых задачах, приглашениях и сообщениях от заказчиков проверяя каждые™ 15 секунд™. Это весьма™ удобно™, когда дорожишь именем™ и репутацией, внимательно относишься к заказам и заказчикам, я был как в роли заказчика так и фрилансера и понимаю о чем говорю™ ужасно™ тяжело™ общаться с фрилансерами и заказчиками которые отвечают по часу. Да и, честно™ сказать, я уже делал это расширение в том же 2018 году, но потом я ушел с фриланса и больше™ там не работал, клевое™ было время. Но речь не об этом, а о том почему™ Хабр сам не сделал™ такое расширение или хотя бы просто™ прикрутил уведомления на сайт?

Читать™ далее
Всего голосов 5: ↑5 и ↓0 +5
Просмотры 858
Комментарии 6

React. Как не стать заложником макета™, или пример™ использования принципа единой™ ответственности

Блог компании Ситимобил JavaScript *ReactJS *

Пожалуй, каждый™ разработчик сталкивается с ситуациями, когда два и более компонентов оказываются тесно связаны логически, но в DOM отображаются раздельно, вперемешку с другими элементами UI. Лобовое решение задачи™ синхронизации таких разрозненных модулей ведёт к просачиванию их состояния и логики™ наружу™ в третьи™ компоненты. Давайте обсудим эту ситуацию и способы её разрешения.

Для наглядного примера из практики рассмотрим приложение «Такси ВКонтакте», а именно™ указание «нитки» маршрута.

Поехали
Всего голосов 11: ↑11 и ↓0 +11
Просмотры 3.2K
Комментарии 6

Рождественские календари для разработчиков

Информационная безопасность *Разработка веб-сайтов™ *JavaScript *Программирование *Java *

Добрый™ день, меня зовут Павел Поляков, я Principal Engineer в каршеринг компании SHARE NOW, в Гамбурге в 🇩🇪 Германии. А еще я автор Telegram-канала™ Хороший разработчик знает, где рассказываю обо всем, что должен™ знать хороший разработчик.

Сегодня я хочу поговорить про Рождественские календари для разработчиков. А именно™ - как провести декабрь с пользой.

Читать™ далее
Всего голосов 13: ↑7 и ↓6 +1
Просмотры 2.4K
Комментарии 6

Как мы визуализировали большие данные™ на картах™: трудности и особенности

Блог компании Lineate Разработка веб-сайтов™ *JavaScript *Maps API *Big Data *

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

В статье™ будет две части:

1. Теоретическая расскажет о визуализации данных™ на картах™ в принципе, о распространенных JS библиотеках для решения этой задачи™ и их основных возможностях. 

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

Наверняка вы видели™ сервисы, показывающие пробки™ на дорогах. Так вот, большинство примеров будет из одного™ похожего проекта, где мы показывали рейтинг опасности на дорогах: уклон, резкий™ поворот, туман, обледенение, аварии™ — всё это отображается на карте в режиме™ реального времени. Хотите™ знать, как? Прошу под кат.

Читать™ далее
Всего голосов 2: ↑2 и ↓0 +2
Просмотры 2K
Комментарии 4

Процедурная генерация бумажных снежинок

JavaScript *Программирование *Алгоритмы *Canvas™ *TypeScript *

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

Читать™ далее
Всего голосов 101: ↑101 и ↓0 +101
Просмотры 10K
Комментарии 29

Создаем CLI-приложение с помощью React.js

Блог компании OTUS Разработка веб-сайтов™ *JavaScript *Программирование *
Перевод

Приложения с интерфейсом в виде командной строки™ (Command-Line Interface — CLI) стали популярными в экосистеме разработчиков по целому™ ряду причин™. Самые банальные из них — это простота использования (CLI) и то, что многие™ важнейшие инструменты разработки представляют из себя терминальные приложения или предоставляют интерфейс командной строки™, и многие™ разработчики уже к ним привыкли.

Читать™ далее
Всего голосов 10: ↑7 и ↓3 +4
Просмотры 3.3K
Комментарии 13

Миграция 17 000 файлов™ JS на TypeScript. Как это было

Блог компании SkillFactory Разработка веб-сайтов™ *JavaScript *Программирование *TypeScript *
Перевод

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

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

Читать™ далее
Всего голосов 7: ↑6 и ↓1 +5
Просмотры 3.6K
Комментарии 0

Уязвимость и баги, стоящие денег клиентам. Разбираем модуль™ от CS Coding™ для CMS CS Cart

CMS *PHP *JavaScript *Администрирование баз данных™ *API *

На написание данной™ статьи™ меня вдохновила уязвимость в модуле™ "Авторизации по телефону", который разрабатывается и поддерживается CS Coding™.

Читать™ далее
Всего голосов 13: ↑13 и ↓0 +13
Просмотры 1.2K
Комментарии 9

Как ваш браузер обрабатывает прикосновения к экрану™ телефона (js touch events™)

JavaScript *ReactJS *

Ссылка™ на github™

Здесь я поделюсь своим опытом™ и постараюсь максимально подробно рассказать все основные фитчи которые есть в вашем javascript для обработки прикосновение к дисплею. touchstart и т.д.

ЧИТАТЬ™
Всего голосов 11: ↑10 и ↓1 +9
Просмотры 3.2K
Комментарии 6

Оценка™ влияния блокировщиков рекламы при работе™ с server™-side GTM

JavaScript *HTML *
Перевод

В конце сентября Симо Ахава поделился материалом, в котором подробно рассказал о влиянии блокировщиков рекламы. Но не стал делать™ акцент™ на способах обхода™, а решил рассказать о технологии, которая помогает понять™, применяется ли блокировка.

Digital Analyst MediaGuru Тимур Леденёв перевел для вас эту статью™.

Многим™ кажется, что server™-side (GTM для сервера) GTM устойчив к блокировщикам рекламы и контента. В конце концов™, благодаря использованию JS-контейнера на собственном домене™ можно избежать многих™ современных технологий блокировки.

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

Однако™ это не очередная статья™, в которой вновь поднимается тема несовпадения интересов жадных™ до инсайтов аналитиков и ничего™ не подозревающих посетителей сайтов™.

Напротив, мне бы хотелось осветить технологию, которая позволяет нам не обходить блокировку, а определять, применяется ли она.

Уверен™, что наряду™ с тем, чтобы позволять блокировщикам рекламы и контента выполнять свою работу™, необходимо также оценивать их влияние. Речь идёт о том, чтобы анализировать, какое число аналитических и рекламных запросов блокируется этими инструментами.

Читать™ далее
Всего голосов 1: ↑1 и ↓0 +1
Просмотры 891
Комментарии 0

Как сегодня делают™ игры в браузере? Часть 2

JavaScript *WebGL *ReactJS *
Tutorial

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

Как вообще™-то передвигать персонажа (который есть набор отдельных 3D-объектов) в пространстве? Я уже рассказывал ранее в 4 шаге о том, об объединении объектов в группу™. Еще раз: вы можете™ перемещать группу™ с линейной скоростью; в сумме с подходящей анимацией это будет выглядеть как ходьба™ или бег, в зависимости от вашей задумки.

Читать™ далее
Всего голосов 6: ↑5 и ↓1 +4
Просмотры 1.6K
Комментарии 0

Дайджест свежих™ материалов из мира фронтенда за последнюю неделю™ №495 (22 — 28 ноября™ 2021)

Разработка веб-сайтов™ *CSS *JavaScript *HTML *
Предлагаем вашему™ вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Читать™ дальше™ →
Всего голосов 27: ↑27 и ↓0 +27
Просмотры 5.7K
Комментарии 1

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

Работа™