Code Ready | Frontend

Как вам новая рубрика? И хотели бы видеть её на канале? Если да, ставь 👍🔥. Потихоньку буду добавлять разнообразие в свой контент. 😁 Также, может у кого-то есть свои идеи? Буду благодарен, если предложите их мне в ЛС - @energy_it

✅ Подборка крутых анимированных hover кнопок Реализовано с помощью HTML, CSS и JS. 👨‍💻 Готовый код: Ссылочка @code_ready | #кодпен

@code_ready | #мем

Разыгрываем среди подписчиков 10 подписок Premium Telegram ⭐️ Друзья,у нас есть для вас очень крутые новости! Мы решили провести розыгрыш, главным призом в котором будет подписка на Premium Telegram ⭐️ 🥇 1️⃣ 🔤🔤🔤🔤 🥈 6️⃣ 🔤🔤🔤🔤🔤🔤🔤 🥉 🔤 🔤🔤🔤🔤🔤🔤 10 призовых мест , в которых - 8 подписок на 3 месяца, и по одной подписке на год и 6 месяцев. Условия участия максимально простые - нужно быть подписанным на наш телеграмм канал и чат Жми на кнопку «Участвовать» внизу поста и следуй инструкции бота.

✅ Как создать кнопку для вырезания текста? Задача простая — вырезать текст из какого-то блока нажатием кнопки. Довольно таки удобно, вместо выделения и копирования просто нажать одну кнопку и нужный текст уже в буфере обмена.

<textarea type="text" class="content"></textarea>
<button type="button" class="cut">Вырезать</button>

// Находим кнопку с классом "cut" и добавляем обработчик события "click"
document.querySelector('.cut').addEventListener('click', () => {
    // Получаем текст из элемента с классом "content"
    const txt = document.querySelector('.content').value;
    // Записываем текст в буфер обмена с помощью Clipboard API
    navigator.clipboard.writeText(txt)
      .then(() => {
        // После успешной записи текста в буфер обмена очищаем поле ввода
        document.querySelector('.content').value = "";
      });
   });

@code_ready | #обучение #html #js

Как соединить компоненты между системами на разных фреймворках? 🤔 Иван и Даниил, ведущие разработчики компании ITFB Group, рассказали о том, как они интегрировали ряд функций распознавания из продукта ITFB EasyDoc в СИМФОНИЮ, несмотря на то, что СИМФОНИЯ — на React, а ITFB EasyDoc — на Vue. Почитать об этом можно по ссылке 🔗 Реклама. ООО "ТСР ТЕХ". ИНН 9729307967.

@code_ready | #консоль

Вам нравятся подобные шпаргалки? Вижу что многие поделились ею, а реакций не поставили 😁 Если хотите, каких-то постов больше, нужно ставить реакций, тогда я понимаю, что вам нравится, а что нет.

✅ Шпаргалка по всем типам данных в JS Шпаргалка по типам данных в JavaScript предоставляет краткое описание каждого типа данных, включая примитивные типы и ссылочные типы. @code_ready | #шпаргалка

✅ Делаем переворачивание слов Word Reverser - это простое веб-приложение, которое позволяет пользователю переворачивать слова. Просто введите слово в текстовое поле, нажмите кнопку "Reverse", и приложение мгновенно перевернет его.

<h1>Word Reverser</h1>
<input type="text" id="input-word" placeholder="Enter a word">
<button id="reverse-btn">Reverse</button>
<p id="reversed-word"></p>

document.getElementById("reverse-btn").addEventListener("click", function () {
  const inputWord = document.getElementById("input-word").value;
  const reversedWord = reverseWord(inputWord);
  document.getElementById("reversed-word").textContent = reversedWord;});

function reverseWord(word) {
  return word.split("").reverse().join("");
}

@code_ready | #обучение #js

Учись облачным технологиям бесплатно и получай подарки от VK Cloud! Применяй эти знания в работе - быстрее пиши сервисы, не читая документации, и говори с клиентом на одном языке. Что входит в Cloud Native DIY ✅ 20+ видеолекций от практикующих экспертов — инженеров и архитекторов облачной платформы. ✅ 3000 бонусных рублей каждому новому пользователю облачной платформы для выполнения практических заданий. ✅ Доступ к чат-боту с дополнительными видео и статьями, которых нет в открытом доступе. ✅ Сертификат о повышении квалификации после выполнения всех практических заданий. Как получить подарок? 1. Зарегистрироваться на платформе VK Cloud 2. Зарегистрироваться в чат-боте тьюториала с 26 по 29 февраля 2024 3. Начать работать с тьюториалом Cloud-Native DIY 4. Описать свой кейс, почему ты решил изучать облака, как они тебе помогли, и отправить сюда @vk_cloudmaster. 5. 7 марта 2024 за лучшие кейсы мы отправим подарки от VK Cloud Зарегистрироваться на курс: https://bit.ly/3Ib06Ay

✅ Вопрос с собеседования Что такое регулярные выражения в JavaScript и зачем они нужны? Ответ: Регулярные выражения (regular expressions) в JavaScript - это мощный инструмент для работы с текстовыми данными. Они представляют собой шаблоны, описывающие набор символов, которые соответствуют определенным правилам или условиям. С их помощью можно осуществлять поиск, замену, извлечение и множество других манипуляций с текстом. В основе регулярных выражений лежат специальные символы и конструкции, которые позволяют задавать различные шаблоны для поиска текста. Например, символы \d соответствуют любой цифре, а \w - любой букве или цифре. Есть также множество других символов для описания специальных условий, таких как начало строки ^ или конец строки $. Когда регулярные выражения могут быть полезны: 1. Поиск слов или фраз в тексте 2. Проверка формата ввода 3. Извлечение информации из текста 4. Замена текста @code_ready | #собеседование

По голосам я определиться не могу 😁 Скорее всего попробую добавить все эти рубрики на канал, увидим что зайдет вам больше всего) 🔥

✅ Просмотр оттенков цвета VSCode Colorize - это плагин для Visual Studio Code, который призван упростить работу с цветами в коде, делая их более узнаваемыми и наглядными. Основные возможности: Автоматическое распознавание цветов, Подсветка цветов, Поддержка различных форматов и Настройка подсветки. @code_ready | #плагин

⚡️В последнем патче Windows 10 появился «Режим бога» Он ускорит процессор, оптимизирует жёсткий диск и удалит скрытый мусор. Браузер, игры, рабочие программы становятся быстрее. Как активировать эту фичу, уже рассказал «Цифровой енот». Там же — инструкция по обходу блокировок без VPN и секретное приложение от «белых хакеров»: ты наконец-то избавишься от слежки приложений. Не поверишь, на что способна твоя техника 👉 @Digital_Racc00n

✅ Меняем размер шрифта с помощью ползунка. Это простое веб-приложение имеет ползунок, который пользователь может использовать для изменения размера шрифта текста. Размер шрифта автоматически обновляется при перемещении ползунка, и текст на странице меняется в соответствии с выбранным размером шрифта.

<input type="range" min="10" max="50" value="16" class="slider" id="fontSlider">
  <div id="output">Размер шрифта: 16px</div>
  <p id="changeText">Пример текста для изменения размера</p>

const fontSlider = document.getElementById("fontSlider");
const output = document.getElementById("output");
const changeText = document.getElementById("changeText");

fontSlider.oninput = function () {
  const fontSize = this.value;
 output.textContent = `Размер шрифта: ${fontSize}px`;
  changeText.style.fontSize = `${fontSize}px`;};

@code_ready | #обучение #js

🔥 Годнота Наткнулся на базу с 1400 вопросов с собеседований на Frontend разработчика. Фишка в том что просчитана вероятность с которой вопрос буден задан и есть примеры ответов. Теперь можно легко получить оффер, подготовившись к самым популярным вопросам 😏