CodeRoll | Frontend

Вопрос с собеседования: ❓Чистые и нечистые функции, что это и какие отличия между ними? Чистая функция - Возвращает результат, основанный только на своих аргументах, без зависимости от внешних переменных или состояния программы. Не имеет побочных эффектов, то есть не изменяет состояние программы или какие-либо внешние переменные Нечистая функция - Изменяет состояние программы или какие-либо внешние переменные. Может иметь побочные эффекты, такие как вывод в консоль, изменение DOM, отправка HTTP-запросов и т. д. Ставь ❤️если знаешь ответ Если нет — ставь 💅 Coderoll | Frontend

✅️ GitHub теперь в Telegram! Подписывайтесь: @GitHub

SVGOMG — онлайн-инструмент для оптимизации SVG Уменьшает размер файлов без потери качества, удаляет лишние атрибуты, упрощает пути и сжимает данные. Превью в реальном времени показывает изменения, а удобный интерфейс ускоряет работу. Улучшает производительность и ускоряет загрузку сайтов. 👀 Посмотреть Coderoll | Frontend

Запустите рекламу в телеграм-каналах с Яндекс Директом Перфоманс-реклама теперь в телеграм-каналах ⚡ Яндекс Директ знает, как привлечь целевую аудиторию 💰👌 Попробовать #реклама yandex.ru О рекламодателе

Вопрос с собеседования: ❓Какие элементы в HTML5 могут иметь aria атрибут? Любой элемент Ставь ❤️если знаешь ответ Если нет — ставь 💅 Coderoll | Frontend

TsParticles Мощная библиотека для создания интерактивных анимаций частиц, которая легко настраивается и поддерживает интеграцию с популярными фреймворками. 👀 Посмотреть Coderoll | Frontend

Вопрос с собеседования: ❓Какое будет поведение ```<script async defer>```? При одновременном указании async и defer в современных браузерах будет использован только async, в IE9- – только defer (не понимает async). Подробнее Ставь ❤️если знаешь ответ Если нет — ставь 💅 #web

Современный JavaScript. От новичка до профи [2024] Курс. По мере прохождения вы погрузитесь в интереснейший мир JavaScript. Обучение начинается с основных концепций языка и продолжается передовыми техниками программирования. Вне зависимости от уровня подготовки, курс обеспечит вас всей самой необходимой информацией для успешного освоения JS. 👀 Посмотреть курс #js

Как масштабировать изменения в UI без лишних затрат? Узнайте 18 декабря на бесплатном вебинаре СберТеха. Эксперты поделятся опытом собственных проектов и расскажут, как создали решение, которое в разы ускоряет разработку и масштабирование изменений UI. Platform V One UI — библиотека UI-компонентов с трехуровневой дизайн-токен системой, а также low-code инструментами стилизации и генерации UI-форм и сценариев. Также на вебинаре узнаете, какие инструменты Platform V One UI доступны в open source, и увидите демо продукта. Регистрируйтесь и приходите! Зарегистрироваться #реклама 16+ platformv.sbertech.ru О рекламодателе

Вопрос с собеседования: ❓Чем полезны data- атрибуты? HTML5 спроектирован с возможностью расширения данных ассоциированных с каким-либо элементом, но в то же время не обязательно имеющих определённое значение. data-* атрибуты позволяют хранить дополнительную информацию в стандартных элементах HTML, без хаков вроде нестандартных атрибутов, лишних DOM-свойств или Node.setUserData(). Синтаксис HTML

<article id="electriccars" data-columns="3" data-index-number="12314" data-parent="cars"> </article>

Доступ в JavaScript

var article = document.getElementById('electriccars'); article.dataset.columns // "3" article.dataset.indexNumber // "12314" article.dataset.parent // "cars"

Доступ в CSS

article::before { content: attr(data-parent); }

Ставь ❤️если знаешь ответ Если нет — ставь 💅 #web

📶 С 1 декабря для граждан РФ открыт доступ к платным материалам по программированию Вот отсортированные базы с тонной материала(книги, курсы, ресурсы и гайды). Выбирай своё направление:: 👩‍💻 Frontend 👩‍💻 PHP ⚙️ Backend 👩‍💻 Моб. Dev 📱 GitHub 👩‍💻 GameDev 🤓 Всё айти 👩‍💻 DevOps 👩‍💻 Python 🖥 Data Science 👩‍💻 Java 🐞 Тестирование 👩‍💻 C# 🤔 Хакинг & ИБ 👩‍💻 С/С++ 📱 Маркетинг 🖥 SQL 🖥 Дизайн 👩‍💻 Golang 👣 Rust Скачивать ничего не нужно — все выложили в Telegram с доступом по ссылке

Codepip Сборник мини-игр для изучения веб-технологий: Flexbox, Grid, CSS-анимации и многое другое. 👀 Потыкать игры #тренажёры

⚡️ Бесплатное обучение фронтенд-разработке с нуля с поддержкой от наставника Опыт в программировании не нужен. На канале Интенсивный JavaScript действующий тимлид и опытный разработчик помогает изучить фронтенд на практических задачах, которые интересно кодить С 3 декабря стартует бесплтаное обучение, где он на практике поможет разобраться в основах — HTML/CSS и JavaScript, а также попробовать три фреймворка — Vue, Angular и React Вот план обучения: 💡 с 3 декабря напишете фронтенд для сервиса доставки 💡 с 10 декабря свой киносайт 💡 а с 17 по 21 декабря свою доску объявлений Обучение подойдёт, даже если у вас нет опыта в программировании — всё объясняют так, чтобы поняла даже ваша бабуля 🔖Ещё этот парень регулярно набирает новичков в свою команду и знает, как трудоустроиться и джуну, и разрабу поопытнее Помимо работы с кодом он даст пошаговый план изучения всего, что нужно современному фронтенду. Поделится способом трудоустройства с помощью ИИ. Расскажет, как взять свой первый заказ на фрилансе без фриланс-бирж с огромной конкуренцией Подписывайтесь, чтобы участвовать бесплатно Учиться самостоятельно можно бесконечно, если не знать, куда копать. На интенсиве сократите время на поиск информации и получите пошаговый план от разработчика, который нанимает новичков в команду 👉Участвовать бесплатно Первые уроки уже доступны

Вопрос с собеседования: ❓В чем разница между HTML и XHTML? — XHTML - это приложение XML, которое является довольно строгим языком с угловыми скобками. — HTML - это приложение SGML, которое является гораздо менее строгим языком с угловой скобкой. — (XML также является применением SGML.) При написании кода XHTML придерживаются того же синтаксиса, который характерен для HTML. При этом разница между HTML и XHTML состоит в наборе некоторых обязательных правил. Правила XHTML следующие. // Все теги и их атрибуты должны быть набраны в нижнем регистре (строчными символами). // Значения любых атрибутов необходимо заключать в кавычки. // Требуется закрывать все теги, даже такие, которым не сопоставлен закрывающий тег. // Должна соблюдаться правильная вложенность тегов. // Нельзя использовать сокращенные атрибуты тегов. // Вместо атрибута name следует указывать id. // Следует определять DTD (document type definition, описание типа документа) с помощью элемента DOCTYPE. Подробнее с примерами: http://htmlbook.ru/xhtml/sintaksis-xhtml Ставь ❤️если знаешь ответ Если нет — ставь 💅

Тренируем регулярки на Regex101 На Regex101 вы сможете тестировать регулярные выражения в реальном времени, разбирать их структуру с подробными объяснениями каждой части, а также находить и исправлять ошибки благодаря встроенным подсказкам. Ресурс поддерживает синтаксисы для популярных языков программирования, таких как JavaScript, Python и PHP, и позволяет легко проверять ваши регулярки на примерах. Это идеальный инструмент как для новичков, так и для опытных разработчиков, желающих упростить работу с текстовыми шаблонами. 👀 Перейти к сервису #тренажёр

Recharts: простая визуализация данных для React 👩‍💻 Recharts — библиотека, которая поможет добавить графики и диаграммы в ваш проект. Легко подключается, настраивается и отлично работает с React. Хотите показать тренды, сравнить показатели или сделать крутой аналитический дашборд? С этой библиотекой всё это можно сделать за пару строк кода. Выбирайте линейные графики, круговые диаграммы, гистограммы или что-то своё. 👀 Посмотреть библиотеку #инструменты

Запустите рекламу в телеграм-каналах с Яндекс Директом Перфоманс-реклама теперь в телеграм-каналах ⚡ Яндекс Директ знает, как привлечь целевую аудиторию 💰👌 Попробовать #реклама yandex.ru О рекламодателе

Вопрос с собеседования: ❓Что такое Secure ("безопасные") и HttpOnly cookies? "Безопасные" (secure) cookie отсылаются на сервер только если запрос выполняется по протоколу SSL и HTTPS. Однако важные данные никогда не следует передавать или хранить в cookies, поскольку сам их механизм весьма уязвим в отношении безопасности, а флаг secure никакого дополнительного шифрования или средств защиты не обеспечивает. Начиная с Chrome 52 and Firefox 52, незащищенные сайты (http:) не могут создавать куки с флагом secure. Куки HTTPonly не доступны из JavaScript через свойства Document.cookie, и через XMLHttpRequest и Request API, что помогает избежать межсайтового скриптинга (XSS). Устанавливайте этот флаг для тех cookie, к которым не требуется обращаться через JavaScript. В частности, если куки используются только для поддержки сеанса, то в JavaScript они не нужны, так что в этом случае следует устанавливать флаг HttpOnly.

Set-Cookie: id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT; Secure; HttpOnly

➡️Подробнее Ставь ❤️если знаешь ответ Если нет — ставь 💅 #web

Что такое атрибут key? Для чего он нужен? Key помогает React определять, какие элементы были изменены, добавлены или удалены. Key нужен для лучшего определения порядка элементов в списке. Key всегда должен присваивается на верхнем уровне: Правильно:

const howUseKey = () => {
  const array = [1, 2, 3];
  return (
    <div>
      {array.map((item) => (
        <div key={item}>{item}</div>
      ))}
    </div>
  );
};

Неправильно (Приглядитесь к its a trap):

const howNotUseKey = () => { 
 const array = [1, 2, 3];
  return (
    <div>
      {array.map((item) => (
        <div className="its a trap">
          <div key={item}>{item}</div>
        </div>
      ))}
    </div>
  );
};

Если использовать индекс массива или другие значения которые могут меняться, то мы можем получить неприятные баги. Лучше всего использовать уникальный id объекта. Более подробно про key можете прочитать здесь

Как юридически защитить продукт своей компании или стартапа? Если вы: ✔️ разрабатываете ПО, базы данных; ✔️ Работаете сами на себя; ✔️ Учавствуете в госзакупках ✔️ выходите на зарубежные рынки ✔️ привлекаете инвестиции ✔️ Изобретаете, продаете, покупаете. Неважно… То рано или поздно вашу идею и разработки могут просто украсть 🏴‍☠️ пираты или конкуренты! Поэтому так важно: ✅регистрировать товарный знак; ✅регистрировать фирменный стиль; ✅депонировать свои продукты и разработки. ☝🏻Как все это сделать? 🫠 Подписаться на канал БРРРЕНДЫ и быть в безопасности 👉 https://t.me/brrrands