Code Ready | Frontend

📱 Как работает Array.prototype.reduce() Array.prototype.reduce() — это метод массивов в JavaScript, который выполняет функцию редукции на каждом элементе массива, преобразуя его в одно значение. Он принимает два аргумента: функцию обратного вызова и необязательное начальное значение аккумулятора.

Редукция в JavaScript — это процесс преобразования массива в одно значение с использованием метода `reduce()`, который применяет заданную функцию к каждому элементу массива, аккумулируя результаты в одно итоговое значение, например, сумму, произведение или объект.

📣 Code Ready | #метод

📱 Меняем px в rem px to rem — плагин, который позволяет с лёгкостью изменить единицы измерения px в rem. Нужно просто выделить нужный участок кода и нажать Alt + Z. 📣 Code Ready | #плагин

Хакатон «Код Согласия» – масштабное соревнование для опытных и начинающих ИТ-специалистов. Реши реальную бизнес-задачу и поборись за призовой фонд в 1 000 000 рублей! Регистрируйся до 27 сентября: https://cnrlink.com/soglasiecodecodeready Приглашаем frontend и backend разработчиков, аналитиков, product менеджеров, дизайнеров, тестировщиков, студентов и выпускников технических вузов.  Организатор хакатона – страховая компания «Согласие». Компания существует на рынке более 30 лет и входит в топ-10 страховщиков России. 🚀На выбор участников хакатона — одна из задач, основанных на реальных бизнес-кейсах СК «Согласие»: 1️⃣Web-сервис для проверки гипотез: разработайте инструмент для быстрого создания и тестирования новых страховых продуктов. 2️⃣Сервис для ведения проектов: разработайте систему для централизованного хранения, удобного отображения и мониторинга крупных проектов внутри компании. Ключевые этапы хакатона «Код Согласия»: 🔹до 27 сентября — окончание регистрации 🔹28 сентября — старт хакатона 🔹 30 сентября, 3 октября, 5 октября — чек-поинты с экспертами 🔹 6 октября — оглашение победителей Не пропусти масштабное соревнование — присоединяйся к хакатону «Код Согласия»: https://cnrlink.com/soglasiecodecodeready Реклама. ООО "СК"Согласие". ИНН: 7706196090. erid: LjN8KQWgZ

👩‍💻 Шпаргалка Flexbox позиционирования Flexbox -  позволяет контролировать размер, порядок и выравнивание элементов по нескольким осям, распределение свободного места между элементами и многое другое. 📣 Code Ready | #css

Flexer — это CSS-песочница, в которой можно легко сгенерировать и расположить блоки. Нужно просто задать размеры и отступы элементам, а сайт сгенерирует CSS-код с flexbox. ⛓ Ссылочка: https://www.flexer.dev/ 📣 Code Ready | #ресурсы

Когда ментор Слёрма Николай Марков решил стать Data-инженером, он не представлял, какие сюрпризы его ждут в профессии. А участники первого реалити-шоу про Data-инженеров уже успели прочувствовать эту атмосферу. От неожиданных сбоев в коде до неуловимых багов — они испытали на себе вызовы, которые стоят за работой с большими данными. Кто смог раскрыть потенциал в нашей гонке, а кто слился после первых заданий? 👉🏻 Переходите, чтобы узнать, кто готов идти до конца и как стать Data-инженером Внутри — гайд «Инструменты Data-специалиста», Roadmap для начинающего Data-инженера и ещё много полезного — статьи, ссылки, рекомендации и бесплатные вебинары 👉🏻 @gdedata Реклама. ИП Аердинов Н.В. ИНН 638103515932 erid: LjN8K97oM

👩‍💻 Тег details Он используется для создания интерактивного раскрывающегося элемента, который позволяет пользователям скрывать или отображать дополнительную информацию.

Для корректной работы интерактивного элемента его заголовок помещается в тег summary. Он обеспечивает визуальную подсказку о наличии скрытого контента и служит удобным способом организации информации на веб-страницах.

➡️ @code_ready | #html

👩‍💻 Программирование теперь в Telegram! Вот 7 обучающих каналов по самым востребованным направлениям в IT. Выбирай своё направление: 👩‍💻 Java: @java_ready 📖 Общее IT: @roadmap_ready 👩‍💻 Python: @python_ready 👩‍💻 C#: @csharp_ready 👩‍💻 C/C++: @cpp_ready 🖥 Базы Данных & SQL: @sql_ready 🖥 Design: @time_design 📌 Ресурсы, гайды, шпаргалки, книги, задачи и статьи для каждого языка программирования.

👩‍💻 Свойство mix-blend-mode Это свойство отвечает за режим наложения между элементом и его родительским элементом, а также между элементом и фоном. У него есть следующие параметры:

• multiply — умножает цвет элемента на цвет фона, создавая темный эффект. • screen — уменьшает темноту цвета, создавая свечение. • darken — выбирает самый тёмный цвет из двух (цвет элемента и цвет под ним). • lighten — выбирает самый светлый цвет из двух. • hue — устанавливает цвет элемента на цвет фона, сохраняя его яркость и насыщенность. • luminosity — устанавливает яркость цвета элемента на уровень яркости фона, сохраняя его оттенок и насыщенность. • exclusion — создает эффект смешивания, который уменьшает контраст между цветами, производя более мягкий вид, в отличие от других режимов наложения.

➡️ @code_ready | #свойство #css

learngitbranching — небольшая браузерная игра, которая поможет вам изучить Git. В ней вы познакомитесь с основными командами, которые пригодятся вам в повседневной работе. ⛓ Ссылочка: https://learngitbranching.js.org/?locale=ru_RU ➡️ @code_ready | #ресурсы

📱 Работа с Fetch API для выполнения HTTP-запросов Fetch API — это современный интерфейс для выполнения HTTP-запросов GET и POST. Он предоставляет простой и удобный способ взаимодействия с веб-сервисами и получения данных с серверов, что особенно важно для создания динамичных веб-приложений. Fetch API отличается простотой использования, поддержкой промисов, возможностью настройки HTTP-запросов и обработкой различных форматов ответов (JSON, текст и др.) ➡️ @code_ready | #гайд #js

😒 Пишешь сайты, но не знаешь компьютерные сети? Твой сайт - дерьмо! Лови канал, в котором научишься понимать компьютерные сети от и до 👨‍💻 Серверная Админа - канал опытного сетевого инженера, который обучит тебя компьютерным сетям. Ты узнать все: OSI, TCP/IP, DNS. OSPF и многие другие непонятные слова. Уникальный канал в данной теме

📱 Красивые иконки файлов Vscode icons — плагин, который добавляет красивую и наглядную систему иконок для файлов и папок, улучшая визуальную навигацию по проектам и облегчая идентификацию типов файлов. ➡️ @code_ready | #плагин

Я айтишник и я устал! Рутина, прокрастинация, куча задач и 0 желания их выполнять. Еще и в семье конфликты. Че делать? Хватит грызть самого себя и заставлять через силу - сделаешь только хуже! Лучше подпишись на того, кто уже не первый год работает с IT-специалистами и помогает им справиться с апатией и прокрастинацией - Психолог с научным подходом. ✔️ Как оторваться от ленты соцсетей и сесть за работу с удовольствием? ✔️ Как перестать работать по выходным и при этом все успевать? ✔️ Как избавиться от постоянной тревожности? ✔️ Как успокоить конфликты в семье и перестать срываться на всех, а вместо этого получить поддержку и понимание со стороны близких? Подписывайся на канал @remizov_changes - начни работать и жить в кайф, не скатываясь в кризисы и выгорание! А в закрепе тебя уже ждут бонусы - переходи и забирай: https://t.me/+T7GnmrWzlzA5ODEy

📱 Вопрос с собеседования Что такое WeakMap в JavaScript? Ответ: WeakMap — это коллекция пар "ключ-значение", где ключи являются объектами, а значения могут быть любого типа. Ключи в WeakMap являются слабыми ссылками, что позволяет им быть собранными сборщиком мусора, если на них больше нет сильных ссылок. Методы WeakMap: • set(key, value) — Добавляет пару ключ-значение в WeakMap. • get(key) — Возвращает значение, связанное с указанным ключом. Если ключ не найден, возвращает undefined. • has(key) — Проверяет наличие ключа в WeakMap. • delete(key) — Удаляет элемент по указанному ключу. ➡️ @code_ready | #собеседование #js

👩‍💻 Анимация загрузки страницы В этом посте вы узнаете, как создать простую анимацию загрузки страницы, используя чистый CSS.

Основой для создания этой анимации является правило @keyframes — оно устанавливает ключевые кадры при анимации элементов.

➡️ @code_ready | #гайд #css

Джентельменский набор трушного фронтендера Опытные Frontend-разработчики собрали самые востребованные и бесплатные каналы, без которых не обойдется ни один настоящий фронтендер. Макеты для верстки — самый крупный канал с макетами для верстки. Первоисточник всех макетов в Telegram. Полезная вËрстка — канал с готовыми решениями повседневных задач: слайдеры, анимация, навигация и т.д. JavaScript заметки — образовательный канал с ежедневными практическими заметками по языку. codepen.js — готовые коды: реализованные на css и js анимации, скрипты и интерфейсы. Оживи статичные макеты Figma Start — каждый день выпускаем крутые макеты для верстки. Выбери самый интересный и удиви рекрутеров! Развивайся с нами, ведь так проще!

flexboxfroggy — игра, которая поможет вам выучить CSS-flexbox. Тут нужно писать нужные свойства во встроенном редакторе для решения головоломок. ⛓ Ссылочка: https://flexboxfroggy.com/ ➡️ @code_ready | #ресурсы

👩‍💻 Прилипший заголовок Свойство position управляет тем, как элемент размещается на странице. Параметры свойства:

• static (по умолчанию) — Элементы располагаются на странице в обычном потоке документа. • relative — Элементы могут быть смещены относительно их исходного положения с помощью свойств top, right, bottom и left. • absolute — Относительно ближайшего предка, который имеет значение position отличное от static. • fixed — Относительно окна браузера и остаются на месте при прокрутке страницы. • sticky — комбинируют поведение relative и fixed. В начале они ведут себя как статические элементы, но как только они достигают заданной позиции при прокрутке они становятся фиксированными.

➡️ @code_ready | #свойство #css

Cамый простой способ изучить Java — залезть в голову профи Один из лучших айтишников России учит базе кодинга в Telegram. Даже гуманитарий поймёт, как создавать приложения, сайты, игры и чат-боты. Достаточно подписаться на «Секреты Java», где каждый день появляются гайды, готовые примеры кода и лучших практик. И всё это бесплатно — вместо сотен тысяч рублей за курсы. Стартовать в прибыльной профессии с нуля вы сможете гораздо проще! Теперь обучиться Java может каждый: @java_secrets