Фронтенд Гайд

⚡️ Анимация Пикачу в коробке Анимированный пикачу в коробке отрисован и анимирован с помощью чисто CSS. Отдельные элементы графики сделаны с помощью DIV’ов и затем стилизованы. Чтобы запустить анимацию нужно нажать на верх коробки и потянуть курсов в сторону. Попробуйте сами. Там же вы найдёте код проекта:

🤔 Почему нельзя отправлять в get запросах чувствительную информацию? 🟠URL видны в истории браузера GET-запросы отправляют данные через URL, который сохраняется в истории браузера. Это означает, что любой, кто имеет доступ к истории браузера, может увидеть эти данные. 🟠Логи сервера Многие веб-серверы и прокси-серверы автоматически записывают URL всех запросов в свои логи. Чувствительная информация в URL будет сохранена в этих логах и может быть доступна администраторам серверов или в случае компрометации системы. 🟠Кэширование Браузеры, прокси-серверы и промежуточные серверы могут кэшировать URL-адреса GET-запросов. Это означает, что чувствительная информация может быть сохранена в кэшах и доступна при последующих обращениях. 🟠Ограничения длины URL Большинство браузеров и серверов имеют ограничения на длину URL (обычно около 2000 символов). Если данные слишком длинные, они могут быть обрезаны, что приведет к потере информации или ошибкам при обработке запроса. 🟠Видимость в реферере Когда пользователь переходит по ссылке с одной страницы на другую, URL-адрес исходной страницы часто передается как заголовок Referer в HTTP-запросе. Это означает, что чувствительная информация в URL может быть передана сторонним сайтам. 🟠HTTP-заголовки и GET-запросы Данные в GET-запросах передаются через URL, в то время как данные в POST-запросах передаются в теле запроса. URL более подвержены утечке, так как они часто видны в различных местах (например, в журналах серверов, истории браузера и т.д.). 🚩Использование POST-запросов в качестве альтернативы Для отправки чувствительной информации лучше использовать POST-запросы, так как данные передаются в теле запроса и не сохраняются в URL.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Secure Form</title>
</head>
<body>
  <form action="/submit" method="post">
    <label for="username">Username:</label>
    <input type="text" id="username" name="username">
    <label for="password">Password:</label>
    <input type="password" id="password" name="password">
    <button type="submit">Submit</button>
  </form>
</body>
</html>

🖥 Если навести мышь на изображение, то можно увидеть, что за ним скрывается текст.

Разработай прорывное решение для автоматического Code Review с помощью ИИ на хакатоне ЕВРАЗа 3.0🔥 🦾 Создай будущее Code Review с ИИ!  Участвуйте в нашем уникальном хакатоне по созданию ИИ-чатбота, который станет незаменимым помощником для разработчиков ЕВРАЗа! Выберите одно из направлений — Python, TypeScript или C#, и разработайте решение для анализа кода на соответствие нашим стандартам.  Дата: 29 ноября – 1 декабря 2024. Формат: гибридный (онлайн и офлайн). Призовой фонд: 500.000 рублей. 🧑‍💻 Присоединяйся к хакатону, если ты: – AI-специалист; – Frontend / Backend-разработчик; – Студент или выпускник технического вуза. ⚡️ Зачем участвовать? – Прокачаешь скиллы и получишь обратную связь от ведущих экспертов отрасли. – Прикоснешься к ИТ в ЕВРАЗе. – Получишь возможность стать частью масштабной и амбициозной команды ЕВРАЗа. 🔸 Регистрация уже открыта! Подай заявку до 25 ноября 23:59 МСК по ссылке.

🖥 Material Input Animation Заголовок поля смещается как только начинают вводить данные. Примеры применения: - поиск фамилии в списках; - поиск контакта для денежного перевода.

В новом выпуске подкаста «Времена НаСтали» руководитель отдела frontend-разработки Олег Рогов и руководитель команды дизайна Анна Труфанова рассказали о low-code решениях в веб-дизайне. Технология использования платформ позволяет создавать приложения без глубоких знаний в области программирования. Такой подход полезен, если к разработке веб-интерфейсов нужно привлечь бизнес-аналитиков или экспертов из другой нетехнической области. В подкасте ответили на следующие вопросы. — Как low-code влияет на процесс дизайна? — В чем главные преимущества использования этих инструментов по сравнению с традиционными методами разработки? — Нужно ли иметь базовые знания программирования? — Каковы текущие тенденции и будущее развитие low-code инструментов в контексте дизайна? Слушать подкаст на Яндекс.Музыке!