Обновить
256K+

JavaScript *

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

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

Хочу поделиться личным проектом, над которым я работал в последнее время. Измерия. Я создал её для нас

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

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

Цель — создать централизованную базу знаний по Минску/СНГ/Миру, которая поможет сэкономить время, нервы, силы и финансы при выборе нового жилья. Минск уже неплохо покрыт — время братьев по СНГ.

Читать далее

Пятёрочка — Интегрируй меня полностью

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

Мы в KTS делаем проект для Пятерочки – новый личный кабинет сотрудника. Продукт объединяет уже существующие сервисы и автоматизирует бизнес-процессы, которые раньше выполнялись вручную.

Над личным кабинетом работает много команд, поэтому нужен удобный механизм параллельной разработки модулей-микрофронтендов. Мы попробовали три способа встраивания: iframe, NPM-пакеты и Webpack Module Federation. В статье анализируем преимущества и недостатки каждого из них и рассказываем, почему переходили от одной технологии к другой.

Поехали!

В JS-функциях «побеждает» последний оператор return

Время на прочтение3 мин
Охват и читатели22K
Вот — JavaScript-функция. Какой из операторов return, имеющихся в ней, «победит» при вызове этой функции?

function test() {
  return 'one';
  return 'two';
  return 'three';
}

Вероятно, вы скажете, что это — первый return. А вот я хочу попытаться убедить вас в том, что «победителем» окажется return последний.



Будьте спокойны: эта функция, определённо, возвращает 'one'. Но в данном случае первый return не даёт выполняться остальным. В результате «последний return» — это и есть return 'one', именно он и «побеждает» другие операторы return. Конечно, это — и самый первый такой оператор, но при этом то, что я заявил выше, остаётся истинным (я, говоря это, с самодовольным видом скрещиваю руки на груди).

Знаю, в вашей голове сейчас проносится примерно такая мысль: «Да заткнись уже!». Но я, всё же, прошу вас ещё немного меня потерпеть…
Читать дальше →

Дайджест свежих материалов из мира фронтенда за последнюю неделю №478 (18 — 25 июля 2021)

Время на прочтение2 мин
Охват и читатели7.5K
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

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

Кажется, мы стали забывать основы фронтенда

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

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

В этой статье я перескажу истории с некоторыми техническими деталями и порассуждаю, что делать дальше.

Читать далее

Как я прототип игры писал и учился генерировать лабиринты

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

Я закончил последнюю миссию в Extreme Landings на своем мобильном телефоне, с чувством глубокого удовлетворения отложил мобилу, выдохнул и закрыл глаза. Адреналин последней успешной посадки с сильным боковым ветром и сломанным рулём направления давал о себе знать.

Захотелось чего-то более медитативного. В голове смутно нарисовалась изометрическая проекция реки, по которой плывёт судно. Возможно даже под парусом. Оно пристаёт к берегу, а затем делает красивый разворот в русле реки… И тут мне вдруг захотелось сделать быстренько и простенько прототип.

Читать далее

Хорошего кода не бывает

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

Серьезно. Кода на который можно посмотреть и сказать "это сделано на отлично" почти не бывает – в основном один фарш из легаси, гвоздей, и иероглифов.

Это не пессимизм. Откройте почти любой коммерческий проект, где люди решают задачи, живут с тем что есть, проект уже прожил сравнительно долгую жизнь, а команда меняется (и это нормально).

Тема пойдет про причину, почему оно происходит, и почему не надо создавать себе иллюзий хорошего кода.

Серьезно

Памятка и туториал по HTTP-заголовкам, связанным с безопасностью веб-приложений

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


Доброго времени суток, друзья!


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


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


В практической части мы реализуем простое Express-приложение, развернем его на Heroku и оценим безопасность с помощью WebPageTest и Security Headers. Также, учитывая большую популярность сервисов для генерации статических сайтов, мы настроим и развернем приложение с аналогичным функционалом на Netlify.


Исходный код приложений находится здесь.


Демо Heroku-приложения можно посмотреть здесь, а Netlify-приложения — здесь.


Основными источниками истины при подготовке настоящей статьи для меня послужили следующие ресурсы:


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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №477 (12 — 18 июля 2021)

Время на прочтение2 мин
Охват и читатели7.8K
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

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

Опыт работы над проектом на базе Vue3 в 2021 году

Время на прочтение7 мин
Охват и читатели11K
Около полугода пришлось поработать над миграцией неработающего проекта на базе Vue 2 на проект Vue v.3.

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

Будет интересно разработчикам и менеджерам, планирующим перевод проектов на Vue3, чтобы оценить трудоёмкость такого перехода. (TLDR — для перехода на Vue 3 сейчас многие фреймворки уже имеют свои версии с поддержкой Vue3. Сам переход особых трудностей не представляет, благодаря поддержке старого Options API и совместимости компонентов на разных API. Но вполне возможно, что время разработки увеличится за счёт ручной доработки отдельных компонентов, для которых авторы не написали версии поддержки. Какая-то значительная часть таких пакетов NPM имеется и останется, но нет проблем основываться на нативных версиях пакетов или написать части своего проекта по-другому, без использования старых пакетов. Активно поддерживаемые пакеты часто уже мигрировали и проблем не создают. Эту неопределённость каждого своего проекта необходимо вначале оценить и уметь писать компоненты.)
Читать дальше →

Альтернативы Redux в 2021 году

Время на прочтение6 мин
Охват и читатели27K
Предположим, вы создаёте или планируете создать React-приложение и вам нужен некий механизм для управления состоянием этого приложения. Если так — это значит, что вам есть из чего выбирать. В сфере инструментов для управления состоянием React-приложений, после её взрывного роста в 2014 году, наблюдается определённое спокойствие. Но в нашем распоряжении, несмотря на это, всё ещё имеется множество решений — от стабильных и проверенных временем, до сверхсовременных.

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



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

Первый доклад на конференции: плюсы, минусы, подводные камни? Интервью с ПК HolyJS

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


Сколько раз ты сам, %username%, задумывался о том, чтобы выступить в качестве спикера? Хотя бы раз такое наверняка было. Но что-то тебя тогда остановило.


Весь процесс подготовки и подачи доклада со стороны выглядит черным ящиком, куда не каждый решится сунуть руку — а вдруг откусит по локоть? Не откусит, уверяем тебя. На каждой нашей конференции выступает много новичков, которые в какой-то момент решились и таки нажали кнопку «отправить заявку».


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

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

Взрослый back-end на node.js возможен?

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

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

Хочу обратить ваше внимание на относительно молодой фреймворк Nest.js. Из коробки он предлагает заранее предопределенную архитектуру, которая заточена под максимально удобную поддержку и масштабируемость вашего приложения. Заложенные архитектурные подходы проверены временем и давно используются в других, более зрелых платформах: Java(Spring), Python(Django), PHP(Laravel) и прочих.

Авторы Nest.js не скрывают, что их вдохновил один из популярных фреймворков для клиентских приложений — Angular.js, а его авторы ориентировались на походы, используемые в Java и C#. Если вы знакомы с Angular.js, то увидите в Nest.js много схожих идей.

Читать далее

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

Делаем собственные курсоры для сайтов

Время на прочтение7 мин
Охват и читатели27K
Существует множество способов обогащения визуальных впечатлений, которые вызывает у пользователей креативный веб-сайт, множество способов перевода существующего статического дизайна на новый уровень. В частности, речь идёт об оснащении сайтов интерактивным функционалом. А здесь мы исследуем один из способов реализации такого функционала через разработку собственного курсора (указателя мыши) для сайта, представляющего собой независимый элемент пользовательского интерфейса. Это — элемент интерфейса, который будет не только интерактивным и визуально привлекательным, но и полезным с практической точки зрения. Мы уделим особое внимание примерам кода, которые дадут всем желающим возможность расширить те базовые вещи, которые мы рассмотрим, и сделать собственный качественный курсор для сайта.


Пользователь взаимодействует со страницей сайта 14islands.com с использованием собственного курсора этого сайта
Читать дальше →

Знакомство фронтендера с WebGL: четкие линии (часть 3)

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

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

Пишем свой парсер и погружаемся в некоторые функции webGL для красивых линий.

Читать далее

Дайджест свежих материалов из мира фронтенда за последнюю неделю №476 (5 — 11 июля 2021)

Время на прочтение2 мин
Охват и читатели8.1K
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

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

Знакомство фронтендера с WebGL: первые наброски (часть 2)

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

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

Тут я приступил к попыткам отрендерить красиво яблоко.

Читать далее

Знакомство фронтендера с WebGL: почему WebGL? (часть 1)

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

Мне и моему коллеге дизайнеру была поставлена задача разработать новую версию сайта-визитки компании. Коллега полгода учился работать с 3D-редакторами (в нерабочее время на Maxon Cinema 4D), поэтому он хотел использовать свои новые навыки при создании новой версии сайта. Его идея заключалась в том, что на каждой странице на первом экране будет крутиться какая-нибудь непонятная фигура с каким-нибудь красивым текстом. Выглядеть это должно было примерно так:

Читать далее

Как я писал тестовое задание на Angular и почему некоторым разработчикам не стоит давать тестовое задание

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

Тестовое задание для junior или middle разработчиков обычно показывает их реальный опыт и понимание предметной области, однако для senior'а тестовое это немного другое. Расскажу свою историю написания маленького тестового задания на Angular с использованием лучших практик.

Читать далее

Discord Slash API + Yandex Cloud Functions = ♡

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

Добрый день. Многие знают, что программисту приходится следить за развитием технологий, даже тех, которые не касаются его текущего стека. Ну, или ему это доставляет удовольствие, которое он оправдывает необходимостью держать руку на пульсе. Так обычно зарождаются разнообразные домашние проекты. Я решил свести в один пост свои наработки по написанию Node.js-бота для Discord Slash API с использованием Serverless-подхода в Yandex Cloud. Использование готовых библиотек сведено к минимуму.

Читать далее