Безопасность в React: защита от XSS и работа с чувствительными данными. Подсветка фрагмента поиска

✏️ Разберём, что такое XSS и как эта уязвимость появляется в браузере. Покажу разницу между выводом текста через JSX и вставкой “сырого” HTML. Объясню, как работает проп dangerouslySetInnerHTML и чем он опасен. На примере To Do List реализуем подсветку текста поиска тегом mark — сначала простым способом, а затем безопасным через экранирование пользовательского ввода. Покажу, как закрыть XSS-дыру своими руками и зачем нужен санитайз. 🔴 Timeline: ▶ 00:00 | Введение ▶ 00:55 | Что такое XSS (и сразу на примере) ▶ 02:46 | Проп dangerouslySetInnerHTML: как мы сами открываем дыру ▶ 05:48 | Почему React безопасен «из коробки» ▶ 06:34 | Подсветка найденного текста через mark без XSS ▶ 18:57 | Заключение 📚 Ссылки из видео: 🧑💻 Основной телеграм-канал: 💬 Коммьюнити-чат в телеграме (помощь новичкам): 🗂️ Бесплатные курсы на канале: 📌 Автор: #reactjs