Coding
247 subscribers
5.88K photos
1.47K videos
34 files
5.95K links
Статьи и ссылки с разных ресурсов, для начинающих программистов.
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
😎 У армян есть свой Boston Dynamics

С добрым утром! ☕️
This media is not supported in your browser
VIEW IN TELEGRAM
👩‍💻 Для удобной работы с .sass-синтаксисом в VS Code!

Sass (.sass only)
добавляет полноценную поддержку indented-синтаксиса Sass: подсветку, автодополнение, навигацию и корректное распознавание .sass-файлов без фигурных скобок и точек с запятой. Помогает комфортно работать со старыми и современными Sass-проектами прямо в редакторе.

📣 Code Ready | #vscode
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Star Rating in Pure CSS – шкала рейтинга в виде сердечек, которые загораются уже при наведении курсора. Выбор сердечка помечается изменением его размера.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
🚀 ScreenCoder — Новый уровень магии для фронтендеров и дизайнеров.

Загружаете скриншот или макет, а нейросеть превращает его в чистый, готовый к продакшену HTML/CSS-код 🤯

Больше не нужно вручную верстать кнопки и блоки — ScreenCoder понимает визуал, сам планирует layout и пишет код, который можно сразу редактировать и использовать.

Что умеет:
🟢Превращает любой дизайн в HTML/CSS;
🟢Генерирует чистую и читаемую верстку;
🟢Позволяет менять стили и структуру под себя;
🟢Подходит и для быстрых прототипов, и для пиксель-перфект интерфейсов.

Просто — загрузил, скопировал, подправил, развернул.

Design → Code за пару секунд.

♎️ GitHub/Инструкция по установке

#python
⌨️ Подгон для вайб-кодеров! Бесплатный сайт, который научит работать с ИИ.

Ресурс, где собраны материалы по вайбкодингу — от основ мышления и правильной работы с нейросетями до практических гайдов по созданию Telegram-ботов, сайтов и собственных AI-проектов.

Без сложной теории и платных курсов.
Всё структурировано, понятно и доступно бесплатно.
На русском.

🔥 Это бесплатно! Сохраняем и пробуем ТУТ

😁 Админ | 📲 Зеркало Max

#нейросеть #cheatsheet
ИИ-ассистенты уже умеют писать код, предлагать исправления и ускорять разработку.

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

На открытом уроке:
• разберём, почему красивые демонстрации не всегда работают в production-задачах и как перейти от случайного использования ИИ к системному подходу
• поговорим о типичных ошибках при работе с ИИ-ассистентами, разберём практики, которые помогают получать предсказуемый результат
• покажем, как использовать шаблоны и подходы, применимые в реальной разработке
• разберём живую демонстрацию на open-source проекте

После занятия вы поймёте, как выстраивать управляемую работу с ИИ-инструментами, где находятся риски и как переносить рабочие подходы в свои проекты.

🗓 Открытый урок пройдёт 16 июня в 20:00 МСК в преддверии старта курса «ИИ для разработчиков».

Подробности и регистрация: https://otus.pw/80CU/

Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Cards – карточки с градиентным зернистым фоном и подсветкой, которая появляется при наведении курсора на элемент.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Interactive Wheel Menu – меню, которое появляется при нажатии на экран. Оно исчезает, если экран перестать удерживать.

Сайтодел | #сниппет #css
День сурка frontend-разработчика

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

Откликаешься на вакансии, а в ответ тишина либо какие-то мутные конторы. На собесах вместо нормальной оценки навыков цирк с алгоритмами на скорость, как будто ты на олимпиаде, а не работу ищешь.

И самое неприятное, пока ты варишься в этом болоте, кто-то спокойно проходит собесы и уходит в Яндекс, VK или на хорошую Валютную удаленку без лишней драмы.

Есть классные проекты и сильные команды, где разработчиков действительно ценят, дают расти, поддерживают развитие и платят достойно и ты можешь туда попасть!


👋 Меня зовут Тихон, привет! Я — действующий Frontend-разработчик и ментор. Я за руку довожу до оффера на хорошую позицию в Big Tech и сопровождаю на испытательном сроке.

Также из учеников я собираю комьюнити, где уже более 220 frontend-разработчиков🫂

А в своем канале:
👉Объясняю,...

Перейти на оригинальный пост
preventDefault(): контроль стандартного поведения браузера!

При работе с DOM-событиями часто нужно отменить действие браузера: переход по ссылке, отправку формы, скролл и т.д. Для этого используется event.preventDefault().

Метод отменяет стандартное поведение браузера, но не останавливает всплытие события. Для этого используется stopPropagation().

Базовый пример:
document.querySelector('a').addEventListener('click', (e) => {
e.preventDefault();

console.log('link click handled manually');
});

После вызова preventDefault() переход по ссылке не произойдёт, и обработка полностью перейдёт под контроль JavaScript.

Это особенно полезно в SPA-приложениях, где навигация управляется роутером без перезагрузки страницы.

Пример — работа с формой:
const form = document.querySelector('form');

form.addEventListener('submit', (e) => {
e.preventDefault();

const data = new FormData(form);
send(data);
});

По умолчанию форма отправляет данные и перезагружает страницу. preventDefault() позволяет перехватить submit и самостоятельно управлять отправкой данных. Так обычно реализуются AJAX-формы, async-запросы и кастомная валидация.

Важно: preventDefault() работает только для событий, которые поддерживают отмену. Проверить это можно через свойство cancelable.

Пример — проверка cancelable:
if (e.cancelable) {
e.preventDefault();
}

Если событие не является cancelable, вызов preventDefault() не даст эффекта. Отдельный нюанс связан с passive listeners.

Пример — passive listeners:
window.addEventListener('touchmove', (e) => {
e.preventDefault(); // будет проигнорирован
}, { passive: true });

При passive: true браузер заранее считает, что обработчик не будет отменять действие события. Это используется для оптимизации scroll/touch-событий.

В таком режиме preventDefault() игнорируется. Иногда отмена зависит от состояния интерфейса или бизнес-логики.

Пример — условная отмена:
button.addEventListener('click', (e) => {
if (!button.matches('.enabled')) {
e.preventDefault();
}
});

Здесь действие отменяется только при определённом условии.

Также важно понимать разницу между preventDefault() и старым подходом через return false. Пример:
el.addEventListener('click', (e) => {
e.preventDefault();
});

В addEventListener конструкция return false не отменяет действие браузера и не останавливает propagation. Такое поведение было характерно для inline-обработчиков и jQuery, поэтому многие разработчики до сих пор путают эти механики.

Ещё момент: у кастомных событий (CustomEvent) обычно нет встроенного browser behavior. Это значит, что preventDefault() не отменяет никаких действий браузера. Но если событие создано с cancelable: true, вызов установит event.defaultPrevented = true.

🔥 preventDefault() — базовый инструмент управления пользовательскими взаимодействиями в js.

📣 Code Ready | #практика
This media is not supported in your browser
VIEW IN TELEGRAM
🤔 Code JavaScript — большой учебник и практикум по JS!

На сайте собрана полноценная база материалов по JavaScript: от базового синтаксиса и работы с DOM до более сложных тем вроде замыканий, событий, async/await и ООП. Материал построен в формате уроков и практических заданий, поэтому подходит не только для чтения, но и для закрепления знаний на практике.

📌 Оставляю ссылочку: code.mu

📣 Code Ready | #сайт
🖥 3D Blobs – набор абстрактных глянцевых 3D-фигур обтекаемой формы. В шаблоне также есть примеры их использования в UI.

Сайтодел | #макет #figma
💪 Кто сейчас вообще получает офферы в IT в 2026?

Я создатель YeaHub — базы IT собеседований.
И я регулярно вижу, как реально выглядит рынок изнутри.

Вакансий стало меньше, а ATS и фильтры просто не пропускают до живого рекрутера.

Собеседования стали жёстче — задают абсурдные вопросы, о которых ты никогда не слышал.

Из-за высокой конкуренции выросли ожидания: задач стало больше и они стали сложнее.

Но при этом каждый день кто-то всё равно получает офферы в крупные компании — даже в текущем рынке. Вопрос в другом: как получить оффер именно тебе?


✊🏻 Меня зовут Руслан.
Я IT-Founder & Tech Lead, строю продукты и руковожу командами из 100+ человек. Занимаюсь подготовкой Frontend-разработчиков к собеседованиям и трудоустройству в Big Tech.


И я просто систематизировал то, что вижу на рынке и в собеседованиях.

💼 На канале:
база реальных IT собеседований (РФ и зарубежные компании)
задачи, которые дают в BigTech и продуктовых компаниях
полный гайд по подготовке к...

Перейти на оригинальный пост
👩‍💻 Эффект цифрового сбоя для текста без JS!

Обычный заголовок можно превратить в полноценный UI-эффект, если разделить его на несколько независимых слоёв.

Как работает:
::before и ::after создают копии текста;

каждый слой анимируется отдельно;

разные цвета формируют chromatic aberration;

небольшие смещения создают эффект glitch-сигнала.


Приём отлично подходит для стартовых экранов, главных секций сайта, экранов загрузки и декоративных интерфейсов.

📣 Code Ready | #фишка
🐙 DevFind – платформа для веб-разработчиков в виде поисковика со ссылками на портфолио и Github-профили. Можно искать разработчиков по имени, навыкам и стране проживания.

Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
💀 Кажется началось... Они лишь притворяются

#cyberpunk
📂 Напоминалка по работе API и прокси!

Например, Forward Proxy скрывает клиента и управляет исходящими запросами, Reverse Proxy принимает трафик на стороне сервера и распределяет его между сервисами, а API Gateway централизует авторизацию, rate limiting и маршрутизацию API.

На картинке — базовые различия между Forward Proxy, Reverse Proxy и API Gateway, которые полезно держать под рукой каждому разработчику.

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

📣 Code Ready | #ресурс
This media is not supported in your browser
VIEW IN TELEGRAM
⚡️ OpenGait — ИИ инструмент, который распознаёт людей по походке.

Проект поддерживает работу с крупнейшими датасетами, включая:
💬 CASIA-B,
💬 OUMVLP,
💬 GREW,
💬 Gait3D и другие.

Внутри уже реализованы:
🖱 современные модели компьютерного зрения,
🖱 поддержка распределённого обучения (DDP),
🖱 AMP для ускорения вычислений,
🖱 удобное логирование через TensorBoard.

🚶‍♀️ Отлично подойдет для тех, кто изучает биометрию, компьютерное зрение и современные методы идентификации людей.

♎️ GitHub/Инструкция по установке

#python #soft #github
40 собесов и оффер за 1 месяц

Алексей разработчик.

Искал работу с декабря - написание сопроводов и отклики занимали очень много времени.

Выхлоп - почти нулевой.

В какой-то момент понял:
так можно искать бесконечно.

И по совету друга попробовал ии-ассистента Софи.

▫️За ~1 месяц прошел около 40 собеседований
▫️Получил оффер с вакансии, на которую, по его словам, не откликнулся бы сам

В описании она выглядела скучно, а по факту - одна из самых интересных компаний, с которыми я общался.


Весь процесс - от первого собеседования до оффера - занял 4 дня.

P.S. Попробовать Софи бесплатно можно будет 16 июня.
Не пропусти анонс здесь.