Code Ready | Frontend
20.5K subscribers
705 photos
316 videos
17 files
469 links
Авторский канал по Frontend разработке.
Ресурсы, гайды, задачи, шпаргалки.
Информация ежедневно пополняется!

Автор: @energy_it

РКН: https://clck.ru/3NJCKs

Реклама на бирже: https://telega.in/c/code_ready
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
CSS Flex Generator — онлайн-инструмент, который позволяет визуально настраивать и генерировать код для CSS Flexbox, упрощая создание гибких макетов.

📌 Ссылочка: cssflex-generator.netlify

📣 Code Ready | #ресурс
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥31👍10😁3👎1
👩‍💻 Popup-окно на CSS и JS

Привет! Сегодня мы создадим один из важнейших элементов на любом сайте — popup-окно.

Основополагающим свойством для его создания является свойство display, с помощью которого мы будем управлять видимостью элемента на странице.


🔥 — если было полезно

📣 Code Ready | #гайд #css #js
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥73👍10🤝2
👩‍💻 Деструктуризация объектов

Деструктуризация объектов позволяет извлекать значения из объекта и присваивать их переменным в краткой форме.

Это удобный способ работы с объектами, позволяющий сделать код более понятным и лаконичным.

🔥 — если было полезно

📣 Code Ready | #собеседование
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥42👍14😁3
👩‍💻 Вопрос с собеседования

Как работать с DOM в JavaScript?
Вторая часть, линк на первую

Ответ:


1. Создание и удаление элементов
// Создаем новый элемент div
const newDiv = document.createElement('div');
// Добавляем элемент в DOM
document.body.appendChild(newDiv);
// Удаляем элемент
newDiv.remove();


2. Манипуляция классами
// Добавляем класс
header.classList.add('highlight');
// Удаляем класс
header.classList.remove('highlight');
// Переключаем класс
header.classList.toggle('highlight');


3. Работа с формами
// Получаем значение
const inputValue = document.querySelector('input').value;
// Устанавливаем значение
document.querySelector('input').value = 'Новое значение';


📣 Code Ready | #техсобес
Please open Telegram to view this post
VIEW IN TELEGRAM
👍26🔥11🤝8
👩‍💻 JavaScript курс 2024

Плейлист из 22 уроков охватывает различные аспекты JavaScript, начиная с основ и заканчивая более продвинутыми темами. Курс предназначен для новичков и продвинутых пользователей.

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


📣 Code Ready | #курс
Please open Telegram to view this post
VIEW IN TELEGRAM
👍25🔥14😁9
👍12🔥3👎1😁1
Что будет в консоли?
Anonymous Quiz
20%
A
22%
B
26%
C
33%
D
👍33🔥11👎2😁1🤝1
👩‍💻 Поиск элементов в массиве с помощью методов filter() и find()

filter() — возвращает новый массив с элементами, соответствующими условию.

find() — возвращает первый элемент, который удовлетворяет условию, а не массив.

🔥 — если было полезно
🤝 если уже пользовался

📣 Code Ready | #метод
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥64🤝25👍7
This media is not supported in your browser
VIEW IN TELEGRAM
👩‍💻 Сниппеты для JS, HTML и CSS

Плагин HTML/CSS/JavaScript Snippets для VSCode позволяет ускорить процесс написания кода, предоставляя готовые шаблоны и фрагменты кода

📣 Code Ready | #плагин
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥21👍5👎1
👩‍💻 Выпадающее меню на CSS

Привет! Сегодня мы создадим многоуровневое выпадающее меню с помощью CSS. Это удобный инструмент для структурирования навигации на сайте, особенно если у вас много категорий и подкатегорий.

Основное свойство, которое мы будем использовать, — position, чтобы позиционировать подменю относительно родительского элемента.


🔥 — если было полезно

📣 Code Ready | #гайд #css
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
1🔥64👍14🤝5