Coding
248 subscribers
5.86K photos
1.47K videos
34 files
5.9K links
Статьи и ссылки с разных ресурсов, для начинающих программистов.
Download Telegram
🎨 Цветовая палитра макета "Virtual Reality Landing Page Concept"

HEX | RGB
#FAB9F1 | rgb(250,185,241)
#524686 | rgb(82,70,134)
#270631 | rgb(39,6,49)

⚠️ Цвет копируется одним кликом!

Сайтодел
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Procedural Birb – маленькие птички, параметры для которых генерируются рандомно. Можно создать свою иллюстрацию, задав необходимые черты в окне настроек.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Bokeh Background – объемный многослойный фон, который двигается вслед за курсором и меняет цвет при нажатии на экран.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Hexagon Grid Ripple Effect – контейнер с шестиугольными карточками для иконок. При нажатии создается эффект волны.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Papers – карточки в виде реалистичных, детализированных бумажных листков. Вращать бумажку можно правой кнопкой мыши.

Сайтодел | #сниппет #css
Intersection Observer — отслеживаем появление элементов в области видимости!

Эффективная альтернатива scroll-событиям. Используется для ленивой загрузки, анимаций и инфинит-скролла.

Инициализируем наблюдатель:
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
}
});
});

Подключаем наблюдение:
document.querySelectorAll('.anim').forEach((el) => {
observer.observe(el);
});

Стили для появления:
.anim { opacity: 0; transform: translateY(30px); transition: 0.4s ease; }
.visible { opacity: 1; transform: none; }

🔥 Простая и масштабируемая практика, которую используют в продакшене: YouTube, Medium, e-commerce.

📣 Code Ready | #практика
AI уже умеет писать код. Следующий шаг — поручить ему код-ревью.

Большинство разработчиков используют AI как продвинутый автокомплит. Но агенты уже умеют выполнять полноценные инженерные задачи: проверять pull request, искать баги, следить за стилем и безопасностью кода.

На бесплатном воркшопе покажут, как собрать такого агента своими руками и встроить его в GitHub.

Что будет на практике:

🔹 Настроите AI-ревьюера на Opencode и AGENTS.md;
🔹 Разберётесь, как работают MCP, Tools и Skills;
🔹 Подключите агента к репозиторию;
🔹 Протестируете его на реальном pull request;
🔹 Получите готовый workflow, который можно использовать после воркшопа.

Подойдёт разработчикам, тимлидам, DevOps, QA и всем, кто хочет внедрять AI в реальные процессы разработки, а не просто общаться с чат-ботами.

21 июля, 19:00 (МСК). Участие бесплатное.

Записаться →
#реклама
О рекламодателе
Как создавать независимые компоненты без конфликтов CSS-переменных?

В больших проектах часто используют глобальные переменные:
:root {
--color: blue;
}

Но потом один компонент случайно меняет значение, и стили начинают влиять друг на друга.

CSS позволяет делать локальные токены прямо внутри компонента.
.card {
--color: #222;
color: var(--color);
}

Теперь переменная действует только внутри .card и его потомков.

Можно создавать полностью изолированные темы компонентов.
.dark-card {
--bg: #111;
--text: white;
}

Внутренние элементы автоматически получают эти значения:
.title {
color: var(--text);
}

Без дополнительных классов и дублирования.

Особенно удобно для:
.theme,
.component,
.widget

где каждый блок должен иметь свои настройки.

🔥 Локальные CSS custom properties позволяют строить компонентные дизайн-системы без огромного количества модификаторов и переопределений.

📣 Code Ready | #совет
😂 2️⃣0️⃣2️⃣6️⃣🔣 Разработка софта в России

С добрым утром! 😎
🎨 Цветовая палитра макета "Chat UI Kit"

HEX | RGB
#EFE4C4 | rgb(239,228,196)
#C2EFE8 | rgb(194,239,232)
#B4D5FC | rgb(180,213,252)

⚠️ Цвет копируется одним кликом!

Сайтодел | #палитра
✍️ EB Garamond – классический шрифт с засечками, вдохновленный шрифтами 1500-х годов. Подходит для небольших надписей. Шрифт можно увидеть в заголовках однотонных карточек в макете Colour Palettes/Moodboards

Сайтодел | #шрифт
Сайтодел | GitHub, Верстка, Сайты, FullStack pinned a GIF
✍️ Fjalla One – экранный шрифт без засечек средней контрастности. Имеет хорошую читаемость и приспосабливается к разным размерам экранов. Пример шрифта есть в сниппете Hamburgers

Сайтодел | #шрифт
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Hamburgers – набор анимированных иконок для меню. Анимация сделана за счет вращения, а также расширения иконки вниз и вверх.

Сайтодел | #сниппет #css
🖥 DesignCode UI – дизайн-система для создания мобильных приложений. Она включает в себя полупрозрачные скругленные карточки и элементы с разноцветными градиентами.

Сайтодел | #макет #figma
📰 RSS Daily Digest — 20 июля

За последние 24ч собрал 26 материалов:

───

🤖 AI / Local LLM
Qwen 3.8 on the way — новые модели от Alibaba Reddit
Kimi drama — народ скупает модели на фоне политической напряжённости Reddit
HuggingFace security incident — интересный репортаж о взломе Reddit
When Chinese models surpass US? — дискуссия о будущем Reddit

🔧 Tech
LoRA Speedrun — публичный лидерборд для fine-tuning техник GitHub
Orion Browser — новый браузер от Kagi orionbrowser.com
Claude Code now uses Bun written in Rust — любопытный технический апдейт Simon Willison
Moonshine — стриминг игр через ESP32 GitHub
$120k bowling system → $1600 ESP32s HN

📰 Новости
Netflix заплатила $587M за AI-киностудию Бена Аффлека TechCrunch
Apple судится с OpenAI — чем это грозит hardware-планам? TechCrunch
Нолан назвал AI "троянским конём" TechCrunch
Nonprofit Current AI — строят "World Wide Web of AI" бесплатно TechCrunch

Java
Java Weekly #655 — свежий выпуск от Baeldung

───

Planet Python не ответил (timeout)
This media is not supported in your browser
VIEW IN TELEGRAM
✍️ Frontend Handbook — большая база знаний по frontend-разработке!

Здесь собраны статьи, документация, шпаргалки, инструменты и другие ресурсы по HTML, CSS, JavaScript, TypeScript, React и многим другим технологиям. Особенно удобно, что информация хорошо структурирована, поэтому можно быстро найти нужную тему.

Оставляю ссылочку: GitHub 📱

📣 Code Ready | #репозиторий
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Windows XP – полупрозрачный стеклянный логотип Windows. Отличный пример того, как можно представить графику в 3D-формате.

Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💻 Auto-Py-To-Exe — удобная графическая оболочка, которая помогает собрать готовое Windows-приложение прямо из Python-проекта.

💬 Конвертирует .py в .exe с использованием PyInstaller.
💬 Позволяет выбрать режим сборки:
* однофайловое приложение;
* папка с файлами.
💬 Добавляет иконку, дополнительные файлы и ресурсы без ручного редактирования параметров.
💬 Настраивает параметры сборки через понятный графический интерфейс.
💬 Поддерживает дополнительные аргументы PyInstaller для более тонкой настройки.
💬 После настройки может сгенерировать готовую команду PyInstaller — удобно для автоматизации и CI/CD.

⚙️ Простая установка:
pip install auto-py-to-exe

▶️ Запуск:
auto-py-to-exe

Откроется локальный веб-интерфейс, где можно выбрать скрипт, настроить параметры и собрать готовый .exe буквально за несколько минут.

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

♎️...

Перейти на оригинальный пост
This media is not supported in your browser
VIEW IN TELEGRAM
🌟 Молодость официально продлили с 18 до 45 лет — такую возрастную классификацию представила ВОЗ

По новым правилам людьми молодого возраста считаются все от 18 до 44 лет, а средний возраст длится с 45 до 59 лет.

С добрым утром! Слыш, работать 😕
🎨 Цветовая палитра макета "Virtual Reality Landing Page Concept"

HEX | RGB
#FAB9F1 | rgb(250,185,241)
#524686 | rgb(82,70,134)
#270631 | rgb(39,6,49)

⚠️ Цвет копируется одним кликом!

Сайтодел | #палитра