JS

Аббревиатура XSS расшифровывается как Cross-Site Scripting (межсайтовый скриптинг). Если особо не погружаться в детали, смысл атаки заключается во внедрении вредоносного кода в страницу. Атака не затрагивает серверную часть, но напрямую влияет на клиентскую — на пользователей уязвимого сервиса.

А какой код можно внедрить в страницу? У страницы же нет доступа к базе данных или другому серверному компоненту, где можно получить данные пользователей. Речь идёт о зловредном JavaScript-коде.

Вам хорошо известно: для выполнения JavaScript-кода на странице (в контексте фронтенда) необходимо разместить его между тегами <script></script>. Про этот способ мы рассказывали в первой главе учебника. Атака XSS в этом и заключается. Злоумышленник внедряет в страницу зловредный JavaScript-код. Пользователь переходит на эту страницу, код выполняется и конфиденциальные данные пользователя отправляются злоумышленнику.

Валидация формы — это проверка данных, которые ввёл пользователь. Если на вашем сайте есть форма без валидации, пользователи будут заполнять её как захотят. Кто-то пропустит важное поле, кто-то неправильно введёт телефон или номер банковской карты. В результате обрабатывать такие данные станет сложнее, да и небезопасно.

Если вы работали с ванильным JavaScript или React, то могли видеть в коде три точки — .... Так обозначаются операторы spread и rest. Они используют одинаковый синтаксис, но решают разные задачи.

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

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

Самые популярные редакторы кода — Visual Studio Code, Sublime Text, Atom и WebStorm. Они ускоряют разработку и помогают быстро находить ошибки, работать с Git и получать удовольствие от процесса.

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

TypeScript — это JavaScript с типами, что логично. А вот и они, слева направо:

SVG-графика поддаётся анимированию. В этой статье мы покажем, как анимировать отрисовку контуров.

Сначала мы разберём свойства SVG-анимации и синтаксис библиотеки Anime.js, а затем анимируем отрисовку котов. Если вы уже знакомы с теорией, можете сразу перейти к практике.

Для анимации нам понадобятся:

• элемент path — контур;
• атрибуты обводки: stroke и stroke-dashoffset;
• библиотека Anime.js.

CSS-in-JS — новый подход к стилизации компонентных веб-приложений. Он помогает преодолеть ряд ограничений и проблем традиционных методов работы с CSS.

Посмотрим, какие проблемы есть в традиционном CSS, и как CSS-in-JS их решает.

Вы рекомендовали использовать ключи -DE, в статье просто -D, в документации:

npm install webpack-dev-server --save-dev

Объясните, что делают различные флаги при установке пакетов -D -de -save-dev? Чем они отличаются? Что по факту делает этот флаг? Что будет если его не поставить при установке пакета?

Для обновления пакетов мы используем ключи -DE (их следует писать прописными). Это сокращённая запись.

D— псевдоним для -save-dev. Когда мы используем D, то подразумеваем, что пакет должен быть установлен в devDependencies (зависимости для разработки).

E— псевдоним для -save-exact. С помощью этого параметра фиксируем версию. Если им не воспользоваться, то рядом с версией пакета в package.json появится «крышечка», символ ^.

Вот и получается, что указание -DE равносильно применению --save-dev и --save-exact. Разницы нет никакой. Просто запись короче и проще запомнить, но это вкусовщина. Каждый делает, как нравится.