Обновить
256K+

JavaScript *

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

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

Работа с i18n — автоматизация Google Translate и другие полезные советы

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

NPM-пакет для интернационализации i18n используется на фронтэнде для создания мультиязычных вебсайтов очень часто. Перевод текста в нем содержится обычно в json или в js файлах, и требует дальнейшей обработки, чтобы с ним с комфортом могли работать контент-редакторы. В статье описывается как максимально упростить и сделать удобным хранение и внесение изменений в перевод.

Читать далее

Что такое Style Queries?

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели6K

Size container queries и container query units недавно достигли стабильной поддержки во всех современных браузерных движках.

Читать далее

Создание «Google Sheets» через Websockets на Node.js

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

Введение

Всем привет! Меня зовут Герман Панов и в этой статье мы разработаем табличный редактор - аналог Google Sheets (в упрощенном виде), работающий на основе вебсокетов, чтобы познакомиться со способами применения этой технологии в браузерах.

Поскольку цель - ознакомление, код будет не очень «чистым», но для базового примера этого будет достаточно. В качестве серверной платформы будем использовать Node.js, также потребуется пакет ws, предоставляющий API для работы с вебсокетами на сервере.

Читать далее

Отправляем формы в Гугл таблицы

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

Привет, мир!

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

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

Для реализации задачи потребуется google apps script и форма обратной связи.

Перейду сразу к делу.

Читать далее

7 интересных API на JavaScript для создания веб-сайтов, о которых вы (скорее всего) не знали

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

В связи с быстро меняющимися технологиями разработчикам предоставляются невероятные инструменты и технологии.

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

Давайте взглянем на некоторые полезные веб-API, которые могут помочь вам поднять ваш сайт до небес! (ну или около того)

Читать далее

Angular — API композиции директив

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

Поговорим о новом (уже старом) способе управления директивами в Angular

Читать далее

Псалом параноика: мессенджер с максимальной безопасностью

Время на прочтение9 мин
Охват и читатели6.4K
Приветствую.

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

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

Хранение токена доступа в сервис-воркере

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


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


На днях прочитал эту интересную статью, посвященную различным вариантам хранения токена доступа (access token) на клиенте. Мое внимание привлек вариант с использованием сервис-воркера (service worker) (см. "Подход 4. Использование service worker"), поскольку я даже не задумывался о таком способе применения этого интерфейса.


СВ — это посредник между клиентом и сервером (своего рода прокси-сервер), который позволяет перехватывать запросы и ответы и модифицировать их тем или иным образом. Он запускается в отдельном контексте, работает в отдельном потоке и не имеет доступа к DOM. Клиент также не имеет доступа к СВ и хранимым в нем данным. Как правило, СВ используется для обеспечения работы приложения в режиме офлайн посредством кэширования критически важных для работы приложения ресурсов.


В этой статье я покажу, как реализовать простой сервис аутентификации на основе JSONWebToken и HTTP Cookie с хранением токена доступа в сервис-воркере.


Для тех, кого интересует только код, вот ссылка на соответствующий репозиторий.


Интересно? Тогда прошу под кат.

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

Рекомендации по увеличению скорости для Next.js приложения

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели11K

Привет, это Эмиль, тимлид группы frontend‑разработчиков.

Хочу поделиться с вами несколькими рекомендациями, как увеличить производительность приложений на Next.js. Статья будет полезна junior‑ и middle‑ разработчикам. Поехали!

Читать далее

Javascript: базовые вопросы и понятия для самых маленьких

Уровень сложностиПростой
Время на прочтение15 мин
Охват и читатели54K

Javascript ― язык весьма оригинальный. Его можно любить, ненавидеть и даже бояться, но равнодушным он вас вряд ли оставит. Не знать или не понимать, с чем ты работаешь ― самая частая ошибка, допускаемая современными фронтенд‑разработчиками. Вам бы понравилось, если бы дантист, к которому вы пришли, не понимал, какой он инструмент использует и какие у него особенности работы? Очевидно, что нет. И рано или поздно, если вы действительно хотите стать профессионалами, вы разберётесь во всём, но как сделать так, чтоб это случилось раньше?

В этой статье в блоге ЛАНИТ хотелось бы показать, что о сложных вещах можно и нужно говорить просто.

Читать далее

Борьба с современным Web. Создаём расширение для скачивания видео из VK

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

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

Читать далее

XSS атакует! Краткий обзор XSS уязвимостей

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

Всем привет! В данной статья я хочу рассказать про XSS уязвимости, какие они бывают и откуда их можно ждать. Сразу хочу сказать, что статья предназначена скорее для новичков в теме и не претендует на уникальность или очень глубокое погружение в тему.

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

Читать далее

React Spectrum — создание компонентов нового поколения

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

Устали писать логику для компонентов, которая из раза в раз повторяется?

React Spectrum знает как это решить!

Читать далее

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

Что нового завезли в DevTools (Chrome 111)

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели8.3K

Совсем недавно вышел Chrome 111 и принёс не только исправление старых ошибок, но и добавление новых, а также приятные фичи в DevTools, о которых мы с вами сейчас и узнаем.

Читать далее

Solana смарт-контракты на Rust для самых маленьких

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

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

Читать далее

VueEnt — сложные формы на Vue и не только

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

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

Читать далее

Пишем умный поиск по коду с Open AI

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

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

Читать далее

Структуры данных: связный список

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

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

Связный список

Полное руководство по Remix. Часть 1

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


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


В этой серии статей я расскажу вам о Remix — новом фреймворке для создания клиент-серверных веб-приложений на JavaScript (точнее, на React) со встроенной поддержкой TypeScript.


Remix позволяет разрабатывать так называемые PESPA (Progressive Enhancement Single Page Apps — одностраничные приложения с возможностью прогрессивного улучшения). Это означает следующее:


  • почти весь код приложения "живет" на сервере;
  • приложение остается функциональным даже при отсутствии JS;
  • JS используется только для прогрессивного улучшения UX (User Experience — пользовательский опыт).

Подробнее о PESPA и других архитектурах веб-приложений можно почитать здесь.


Очевидно, что разработчики Remix вдохновлялись Next.js и Svelte.


К слову, здесь вы найдете полное руководство по Next.js.


В первой части мы пройдемся по руководствам из официальной документации, во второй — более подробно рассмотрим возможности, предоставляемые Remix.


Это часть номер раз.


Часть номер два.

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

Что нового в Lighthouse 10

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

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

Lighthouse 10 доступен в командной строке через npm и в Chrome Canary. В ближайшие недели он появится в стабильном Chrome в Chrome 112 и в PageSpeed Insights.

Читать далее