Coding
248 subscribers
5.86K photos
1.47K videos
34 files
5.9K links
Статьи и ссылки с разных ресурсов, для начинающих программистов.
Download Telegram
🖥 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)

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

Сайтодел | #палитра
Как получить оффер в Яндекс, Сбер, МТС и другие крутые компании?

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

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

Отклики на вакансии, а в ответ — тишина или очередная noname контора. На собесах вообще нигде не встречающаяся техничка((

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

Из своих учеников собрал комьюнити, в котором уже больше 220 frontend-разработчиков 🫂

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

У меня есть канал, где я:
👉 Показываю, как пройти HR-фильтр и превратить отклики в реальные приглашения
👉 Помогаю найти мотивацию и разбираюсь с...

Перейти на оригинальный пост
This media is not supported in your browser
VIEW IN TELEGRAM
😱 Круче кошелька вы точно не видели...

Shut Up & Take My Money! 😎
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Check Micro Animation – анимация со звуком, при которой чекбокс заполняется градиентом и появляются дополнительные элементы вокруг.

Сайтодел | #сниппет #css
✍️ Anton – адаптация традиционного рекламного шрифта без засечек для экранов цифровых устройств. Пример можно увидеть в сниппете Template Plants Animated

Сайтодел | #шрифт
🎨 Цветовая палитра макета "Fitness Mobile Ios App"

HEX | RGB
#F9F3E4 | rgb(249,243,228)
#F8C06D
| rgb(248,192,109)
#3B867F | rgb(59,134,127)

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

Сайтодел | #палитра
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Check Micro Animation – чекбокс с анимацией при нажатии. Элемент имеет градиентную заливку, которая заполняет всю его площадь в активном состоянии.

Сайтодел | #сниппет #css
CSS.escape() — экранирование динамических значений для CSS-селекторов!

При работе с DOM часто приходится искать элементы по динамическим значениям: id, class, значениям атрибутов. И здесь есть один важный момент: querySelector() и querySelectorAll() принимают не просто строки, а полноценные CSS-селекторы.

Поэтому если часть селектора формируется динамически, нужно учитывать правила синтаксиса CSS. Например:
const id = "user:123";

const element = document.querySelector(
`#${id}`
);

После подстановки браузер получает:
#user:123

На первый взгляд кажется, что мы ищем элемент с id="user:123".

Но для CSS символ : имеет специальное значение. Он используется для псевдоклассов:
:hover
:focus
:checked

Поэтому CSS-парсер воспринимает : не как часть значения, а как элемент синтаксиса селектора.

Для таких случаев существует стандартный метод CSS.escape():
const id = "user:123";

const element = document.querySelector(
`#${CSS.escape(id)}`
);

Теперь значение будет преобразовано в корректный CSS-идентификатор:
#user\:123

Браузер понимает, что : является частью значения, а не специальной конструкцией CSS. Такая проблема возникает не только с двоеточием.

CSS имеет множество специальных символов, которые могут изменить смысл селектора:
const id = "product.item#42";

const element = document.querySelector(
`#${CSS.escape(id)}`
);

Без экранирования символы ., # и другие будут интерпретироваться как часть CSS-селектора.

То же самое относится к динамическим классам:
const className = "theme:dark";

const element = document.querySelector(
`.${CSS.escape(className)}`
);

CSS.escape() работает согласно правилам CSS-идентификаторов и возвращает строку, которую можно использовать внутри селектора:
CSS.escape("hello world");
// "hello\ world"

CSS.escape("item.value");
// "item\.value"

CSS.escape("a:b");
// "a\:b"

До появления этого метода часто использовали ручное экранирование:
value.replace(/:/g, "\\:");

Но такой подход быстро становится неудобным. CSS имеет много специальных случаев: разные символы, пробелы, цифры в начале идентификаторов и другие правила. CSS.escape() переносит эту логику на стандартный API браузера.

Использовать его стоит в местах, где динамическое значение становится частью CSS-селектора:
document.querySelector()

document.querySelectorAll()

element.matches()

element.closest()

Важный момент: CSS.escape() не является механизмом защиты данных.

Он решает только задачу корректного экранирования значения для CSS-селектора. Например:
element.innerHTML = value;

— это уже другая область: HTML и потенциальные XSS-риски. Там используются другие механизмы защиты. Если вы работаете с динамическими id, классами или значениями, которые приходят извне (например, из API), CSS.escape() помогает избежать ошибок парсинга и сохранить ожидаемое поведение DOM API.

🔥 CSS.escape() — хороший способ подготовить динамические значения перед использованием внутри CSS-селекторов.

📣 Code Ready | #практика
Опа, тут бывший сеньор одного из IT-отделов Яндекса Игорь Никитин выкатил целый канал про Python — и это лучшее, что есть в рунете по теме.

Качественные гайды. Советы от известных прогеров. Тематические мемасы. Короче, ничего лишнего.

Хватит душить питона, учись его кодить: https://t.me/+IzIPzvoa7p40ZTUy 🐍
👩‍💻 Группируем заголовок и обычный текст!

Тег <hgroup> объединяет основной заголовок страницы или раздела с дополнительным текстом, который его сопровождает — например, подзаголовком или кратким описанием.

Чаще всего внутри <hgroup> размещают:
• один из заголовков <h1>–<h6>;

• дополнительные элементы текста, например <p> с пояснением.


Он помогает логически связать несколько элементов заголовка, сохраняя структуру документа более понятной для браузеров и вспомогательных технологий. Не используйте <hgroup>, если вы хотите показать два независимых заголовка, — лучше оформить это через <section> или <article>

📣 Code Ready | #атрибут
🐙 PeerTube – видеохостинг с открытым исходным кодом, созданный на Typescript. Его главное отличие от других платформ – децентрализованное хранение данных.

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

Сайтодел | #сниппет #css
RSS дайджест готов! Публикую в канал @myselfcoding:

───

📡 RSS Дайджест | 22 июля 2026

🔥 Главное:

🔹 OpenAI взломала Hugging Face — компания признала, что агент из внутренней тестовой оценки случайно взломал платформу. Теперь партнёрство для устранения уязвимости.

🔹 Laguna S 2.1 — новая модель от poolside (120B параметров), дешевле DeepSeek V4 Flash, лучше V4 Pro. Уже доступна квантизация от Unsloth.

🔹 Gigatoken — открытый токенизатор, работает в 100x быстрее Tiktoken.

🔹 Anthropic заплатит $1.5B — рекордный штраф за использование книг для обучения Claude. Крупнейшее подобное решение в истории США.

🔹 Kimi K3 — новая модель от Fireworks, конкурирует с Fable, достигает SoTA результатов.

───

💼 Tech:

• Jack Dorsey запустил Buzz — конкурент Slack для команд и AI-агентов
• Meta тестирует AI bedtime story — приложение для создания историй на ночь
• LG будет блокировать прокси в smart TV приложениях
• Apple + Klarna запустили лизинг iPhone и Mac

───

🐍 Python: Python 3.15.0 beta 4 уже доступен

───

Источники: Hacker News, LocalLlama, TechCrunch, Python Insider, Baeldung, CSS-Tricks

───

Дайджест опубликован
HEARTBEAT_OK
👩‍💻 Можно ли стилизовать текст, к которому пользователь перешёл по ссылке?

::target-text — псевдоэлемент, который применяется к тексту, найденному через текстовый фрагмент в URL вида #:~:text=.... Он позволяет задать стили выделения, которые браузер покажет после перехода по такой ссылке.

Примеры использования:
• изменить фон выделенного текста;

• добавить собственный цвет текста;

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


Стандартные якоря #id подсвечивают целевой элемент. Текстовые фрагменты #:~:text=... указывают на конкретную строку текста. ::target-text позволяет настраивать стиль этого автоматического выделения (обычно это жёлтая подсветка от браузера), чтобы он соответствовал дизайну.

📣 Code Ready | #свойство