Code Ready | Frontend

Что ж, теперь итоги 2024 года... Ровно год назад, минуту в минуту, я писал пост про итоги 2023 года, и вот, пришло время для нового года. Хочу искренне поблагодарить каждого из вас за то, что вы читаете этот канал, ставите реакции и делитесь им с другими. В новом году я желаю вам достичь всех поставленных целей, чтобы 2025-й стал для вас лучшим и самым успешным годом! За 2024, я успел сделать многое, думаю все уже видели мои новые каналы, про пайтон, C++ и другие. Надо их тоже развивать и делать ещё больше, до 2026 нужно успеть везде набрать больше 15000 подписчиков, ну и выйти на совсем другой уровень) Спасибо за вашу поддержку, всем желаю удачи, пусть новый год станет самым запоминающим, выполняйте свои цели. ❤️ С наступающим новым годом! 🎄

👩‍💻 Знакомы с shape-outside? Это свойство задает форму, по которой текст обтекает элемент, что позволяет создавать уникальные текстовые обтекания, основанные на различных формах, таких как круги, эллипсы или многоугольники. Ещё покажу основные параметры: • circle (radius at position) — круг с заданным радиусом и позицией. • ellipse (radius-x radius-y at position) — эллипс с заданными радиусами и позицией. • polygon (point1, point2 ...) — многоугольник, где каждая точка указывается координатами. Также, для правильного применения обтекания текста с помощью shape-outside, элемент должен быть плавающим. Поэтому обязательно используем float: left 📣 Code Ready | #свойство

Покажу ещё один хороший сайт, для изучения Git Git How To — предлагает пошаговые руководства и практические примеры для изучения системы контроля версий Git, облегчая процесс освоения её основных команд и функционала. 📌 Как всегда, ссылочка: githowto.com 📣 Code Ready | #ресурсы

👩‍💻 Покажу ещё один необычный атрибут — draggable С помощью него можно создать интерактивные элементы на веб-странице, которые пользователи смогут перетаскивать. Атрибут имеет всего два значения:

• draggable="true" — элемент можно перетаскивать. • draggable="false" — элемент нельзя перетаскивать.

📣 Code Ready | #атрибут

Вот ещё один сайт, для изучения флексбоксов, думаю лишним не будет точно) Flexer — CSS-песочница, в которой можно легко сгенерировать и расположить блоки. Нужно просто задать размеры и отступы элементам, а сайт сгенерирует CSS-код с flexbox. 📌 Куда без ссылочки: flexer.dev 📣 Code Ready | #ресурсы

👩‍💻 Разберем, как максимально просто вставить любую картинку в текст Чтобы добиться такого эффекта, применяется несколько CSS-свойств, все они банальные, но всё же, вот пару свойств, с помощью которых можно создать этот эфффект:

• background-image — добавляет фоновое изображение • background-size: cover — делает так, чтобы изображение полностью покрывало текст • background-clip: text — обрезает фоновое изображение по форме текста. • color: transparent — делает текст прозрачным, чтобы был виден только фон изображения.

📣 Code Ready | #css

🥰 Псс,Нужен облачный сервер для высоких нагрузок? Ищешь идеальный сервер для высоконагруженных проектов? У нас есть то, что вам нужно! — Процессор AMD Ryzen 9950X — мощность для любых задач — Скорость сети до 25 Гбит/с — молниеносная работа без ограничений — Защита от DDOS-атак! — ваши данные под надёжной охраной — Круглосуточная техподдержка — всегда готовы помочь, 24/7 🖥 Попробуйте облачные серверы нового уровня и ускорьте свой бизнес уже сегодня! 🖤 Хотите зарабатывать не только на заказах клиентов? Не проблема! У нас есть реферальная программа, по которой вы сможете зарабатывать аж до 50% с пополнений реферала! Aéza - это не только облачный хостинг, но и надежный товарищ в бизнесе!

Уже были разные сайты, и пришло время быстренько изучить Git learngitbranching — небольшая браузерная игра, которая поможет вам изучить Git. В ней вы познакомитесь с основными командами, которые пригодятся вам в повседневной работе. 📌 Как всегда, ссылочка: learngitbranching.js 📣 Code Ready | #ресурсы

👩‍💻 Шпаргалка по единицам измерения CSS Единицы измерения в веб-разработке — способы указания размеров, расстояний и других параметров для элементов на странице. Давайте подробно рассмотрим их. 📣 Code Ready | #шпора

🟨🟧🟥 ЕВРАЗ внедряет ИИ в ревизию кода — итоги масштабного хакатона 1 декабря завершился хакатон ЕВРАЗа 3.0, который собрал более 600 IT-специалистов со всей страны. Участники в течение 40 часов разрабатывали решение на основе ИИ, которое позволит автоматизировать один из важнейших этапов разработки — code review. Для обучения ИИ участникам были предложены реальные проекты компании по 3-м стекам — TypeScript, C# и Python. Работу команд курировали эксперты ЕВРАЗа, которые делились своими опытом и советами. Это помогло командам погрузиться в реальные проекты компании и предложить идеи решений, которые затем могут быть внедрены в реальные процессы. Топ-3 команды разделили между собой призовой фонд в 500 000 рублей. А победители специальных номинаций получили фирменный мерч компании. Подробнее о событии: 📹 Видео о том, как прошел хакатон 📑 Статья с разбором решений реклама. ООО «ФИЗТЕХ ДЖЕНЕЗИС», ИНН: 7735184156, erid: 2VtzqvfFcve

👩‍💻 HTML для новичков с нуля! В этом видео вы узнаете про популярные теги для создания форм на сайте и атрибуты к ним, вёрстка таблиц, работа с изображением, аудио и видео.

Ссылочка на видео: YouTube 🖤

📣 Code Ready | #ресурсы

👩‍💻 Настраиваемая маска в CSS Cвойство mask устанавливает изображение, которое используется как слой маски для элемента. Принимаемые аргументы:

• mask-clip — определяет область распространения маски • mask-size — размер маски • mask-position — размещает маску относительно элемента • mask-repeat — указывает, должна ли повторяться маска • mask-mode — определяет, будет ли ссылка на маску • mask-origin — задает начало координат маски.

📣 Code Ready | #css

👩‍💻 Программирование — В С Ё В 2024 году на кодинге уже не вывезешь, перспектива года - Информационная Безопасность. Ловите полезные каналы, которые помогут ворваться в новое направление. 👍 ZeroDay — Уроки, эксплуатация уязвимостей с нуля 👍 Белый Хакер — Свежие новости из мира ИБ 😎 Арсенал Безопасника — Все необходимые инструменты 😎 Бункер Хакера — Статьи, книги, шпаргалки и хакинг 👨‍💻 Серверная Админа — Настройка и уроки по компьютерным сетям 📂Вступай и изучай новое направление!

Уже были 2 игры для изучения флексов, но недавно нашел интересную игру уже для JavaScript JSRobot — небольшая игра, в которой вам предстоит управлять роботом с помощью Javascript для преодоления препятствий и решения головоломок. 📌 Ссылочка: lab.reaal.me/jsrobot 📣 Code Ready | #ресурсы

👩‍💻 Анимация бургер-кнопки Всем привет! Сейчас разберем как создать и анимировать бургер-кнопку, которая используется для создания меню на сайтах. Основой для создания такого эффекта является свойство transform, с помощью которого можно смещать элементы в заданном направлении. 📣 Code Ready | #гайд #css

Как создать свой чат-бот и начать зарабатывать уже сегодня? На cайте университета Zerocoder открыли запись на бесплатный онлайн-практикум, где разберут, как создавать востребованные чат-боты — от простых до тех, за которые готовы платить от ₽100.000 за проект! — Не нужен опыт в IT или программировании — всё с нуля! — Расскажем, как выйти на стабильный доход уже через пару месяцев. — Доступ к проверенным вакансиям для разработчиков чат-ботов. Что узнаете на эфире: — Перспективы рынка чат-ботов на 2025 год. — Какие проекты стоят ₽100.000 и как их найти. — Как применять нейросети, чтобы упростить работу. Хотите освоить трендовую IT-профессию и начать зарабатывать от 100K за проект? Нажмите сюда и забронируйте место на эфир. erid: LjN8KXF1Q ООО Зерокодер, ИНН 9715401631

Знал ли ты, что можно не перепечатывать текст из видео вручную? selectext — это расширение для Chrome, с помощью которого можно скопировать текст из видео, выделив область с текстом. ⬆️ Скачать расширение ➡️ Code Ready | #ресурсы

👩‍💻 Простой атрибут — translate Он управляет тем, должно ли содержимое элемента переводиться, если страница переведена с использованием автоматических переводчиков. Имеет два значения:

• translate="yes" (по умолчанию) — Должно быть переведено. • translate="no" — Не должно быть переведено.

Советую использовать его, когда нужно предотвратить перевод специфических текстов, таких как имена собственные, бренды или код, который может быть некорректно переведен. 📣 Code Ready | #html

Питон, жаба, баг, факап, код, кот… 🐈 Все надоело! Каждый день слышишь эти слова и уже начинает подташнивать. А за работу садишься с тем же удовольствием, что в начале карьеры в IT? Если прокрастинация и тревожность стали верными спутниками, то пора срочно выбираться из этого состояния! ⚡️Справиться с выгоранием и вернуться к жизни тебе поможет канал Вадима - Психолог взрослого человека. Он точно знает, как IT-специалисту выйти из застоя и вернуть себе силы и энергию. Рекомендуем начать с его мини-курса, который, кстати, Вадим сейчас проводит бесплатно: 👉🏻 "Как избежать выгорания, даже если вы постоянно вкалываете?". Ты найдешь причины упадка сил и апатии. И поймешь, как из этого выйти. Подписывайся на канал @vadimpetrovpsi и смотри мини-курс - ссылка в закрепе.

CSS Gradient — Этот сайт позволяет легко создавать градиенты с помощью интуитивно понятного интерфейса и генератора кода. Вы можете настроить цвета и сохранить свои градиенты для дальнейшего использования. 📣 Code Ready | #ресурсы