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

Автор: @energy_it

Заявления РКН: № 5383712961
Download Telegram
📱 Таймер обратного отсчёта!

Привет! Сегодня разберем, как сделать таймер, который отсчитывает время до указанного события (например, до конца распродажи), и по завершении показывает сообщение.

Результат:
На странице будет таймер вроде 00:00:10, который уменьшает время каждую секунду и завершает обратный отсчёт.

🔥 — если хочешь побольше такого
🤝 — если уже делал подобное

📣 Code Ready | #гайд
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥53👍16🤝11😁2
👩‍💻 Front-End Development Masterclass

Практико-ориентированный курс по фронтенд-разработке, в котором вы создадите полноценные проекты с нуля. Курс охватывает HTML, CSS, JavaScript, работу с препроцессором Sass, а также подключение внешних библиотек и современные подходы к вёрстке и дизайну.

Ссылочка на плейлист: YouTube 🖤


📣 Code Ready | #курс
Please open Telegram to view this post
VIEW IN TELEGRAM
👍13🤝6🔥5
👍16🔥10🤝8
Что же выведет консоль?
Anonymous Quiz
18%
A
24%
B
42%
C
17%
D
🔥21👍10
This media is not supported in your browser
VIEW IN TELEGRAM
JSRobot — небольшая игра, в которой вам предстоит управлять роботом с помощью Javascript для преодоления препятствий и решения головоломок.

📌 Ссылочка: antemalkah.jsrobot

📣 Code Ready | #ресурсы
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥23👍8🤝5
👩‍💻 Мини-трюк с HTML + CSS: защищаем кнопку от повторного клика!

В этом посте — простой, но полезный приём, который можно внедрить в любой сайт или форму без JavaScript-файлов.

Как работает:
При первом клике кнопка становится неактивной.

Больше её нажать нельзя — предотвращает повторную отправку формы.

Работает без JS-файлов, просто onclick.


Полезно при отправке форм и заказов — меньше багов, меньше повторов, больше контроля!

📣 Code Ready | #фишка
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥46👍21🤝83😁1
This media is not supported in your browser
VIEW IN TELEGRAM
CodeRun — платформа для решения задач от Яндекса. Все задачи распределены по таким направлениям как фронтенд, бэкенд, машинное обучение, аналитика данных и мобильная разработка. Каждая задача имеет свой уровень сложности.

📌 Ссылочка: coderun.yandex.ru

📣 Code Ready | #ресурсы
Please open Telegram to view this post
VIEW IN TELEGRAM
14🔥7
📱 Изучаем Proxy — скрытое оружие JavaScript-разработчика!

Proxy позволяет перехватывать базовые операции с объектами и функциями: чтение, запись, удаление, вызов и многое другое. Это инструмент, с которым можно гибко управлять логикой доступа и поведения объектов без изменения их структуры.

👉 Code Ready | #шпора
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥49👍158🤝5
📂 Напоминалка для работы с HTTP-запросами!

Например, GET используется для получения данных, POST — для создания новых записей, а DELETE — для удаления.

На картинке — 9 самых популярных методов HTTP-запросов, которые стоит держать под рукой каждому разработчику.

Сохрани, чтобы не забыть!

📣 Code Ready | #ресурсы
Please open Telegram to view this post
VIEW IN TELEGRAM
27👍12🔥6
👩‍💻 Идеальные заголовки без лишних усилий!

Свойство text-wrap: balance — это настоящий подарок для тех, кто заботится о визуальной гармонии текста.

Где полезно:
В адаптивной вёрстке — когда ширина контейнера меняется, а ты хочешь, чтобы заголовок всегда выглядел опрятно.

В заголовках из 2–3 строк, где важно правильное распределение слов.

Чтобы не писать костыльный JS или не подставлять <br> вручную.


Оно автоматически балансирует перенос строк в заголовках, чтобы текст выглядел оптически красиво — без "висячих" слов и перекошенных блоков.

📣 Code Ready | #свойство
Please open Telegram to view this post
VIEW IN TELEGRAM
👍46🔥159🤝3
😎 Отличная статья попалась мне на Хабре — если тебе интересно, как работают нейросети и хочется написать свою прямо в браузере, обязательно читай дальше.

В этой статье:
• Что такое сеть Хопфилда и как она запоминает изображения.
• Подробный разбор работы алгоритма шаг за шагом.
• Реализация нейросети на JavaScript с примерами кода.


🔊 Продолжай читать на Habr!


📣 Code Ready | #статья
Please open Telegram to view this post
VIEW IN TELEGRAM
15🤝8🔥7
📱 Кнопка “Наверх” с прогресс-баром прокрутки!

Всем привет! Сегодня покажу, как сделать современную кнопку "Scroll to Top", которая не просто возвращает наверх, а ещё и показывает, насколько вы проскроллили страницу — прямо внутри себя, в виде кругового прогресс-бара.

Ключевые моменты:
• HTML: минимальный, только кнопка.

• CSS: фиксированное позиционирование, conic-gradient, плавные эффекты.

• JavaScript: расчёт процента прокрутки и плавный скролл к началу.


🔥 — если хочешь побольше подобного
🤝 — если попробуешь
сделать

📣 Code Ready | #гайд
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥48🤝118😁2