🚀 Креативные подсказки для Nano Banana Pro

Собрание уникальных и креативных подсказок для работы с Google Nano Banana Pro. Идеально подходит для вдохновения и генерации идей, этот репозиторий предлагает разнообразные варианты для создания визуального контента.

🚀 Основные моменты:
- Более 500 тщательно отобранных подсказок
- Поддержка динамических аргументов для Raycast
- Разнообразные стили генерации: от фотореалистичных до художественных
- Регулярные обновления и возможность участия в сообществе

📌 GitHub: https://github.com/YouMind-OpenLab/awesome-nano-banana-pro-prompts

#javascript

Будьте осторожны и предупредите коллег

⚡️ Отличный гайд по тому, как прокачать навык работы с дейтпикерами в JavaScript.

В нём есть примеры, ясные объяснения и наглядный формат, который помогает быстро разобраться во всех нюансах создания собственных дейтпикеров на чистом JS.

Читать здесь (https://pikaday.dbushell.com/)👍

🎨 Инструменты для создания и редактирования изображений

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

🚀 Основные моменты:
- Поддержка различных форматов изображений
- Интуитивно понятный пользовательский интерфейс
- Множество инструментов для редактирования и фильтров
- Возможность создания графики с нуля
- Активное сообщество и регулярные обновления

📌 GitHub: https://github.com/kimkulling/kims

#javascript

🌍 Twitter Location Flags Extension

Расширение для Chrome, которое добавляет флаги стран к именам пользователей на Twitter/X, основываясь на их местоположении. Оно автоматически определяет пользователей и запрашивает информацию о местоположении через GraphQL API Twitter.

🚀Основные моменты:
- Отображает флаги стран рядом с именами пользователей
- Работает с динамически загружаемым контентом
- Кэширует данные о местоположении для снижения нагрузки на API
- Не требует передачи данных третьим лицам

📌 GitHub: https://github.com/RhysSullivan/twitter-account-location-in-username

#javascript

https://github.com/RhysSullivan/twitter-account-location-in-username/

⚡️ Крупное обновление легендарной библиотеки иконок для фронтенда

Для фронтенд-разработчиков вышло масштабное обновление одной из самых известных библиотек иконок. Экосистема заметно выросла и теперь включает:

- 63 119 иконок и 30 стилей — от минимализма до детальной графики;
- полноценную SVG-библиотеку и шрифтовые лигатуры, которые работают как обычный текст;
- обновлённый дизайн и новые тематические наборы;
- официальные NPM-пакеты для React и других фреймворков;
- удобные варианты поставки: CDN, SVG-пакеты, шрифты;
- полностью переработанную архитектуру без legacy-зависимостей.

Инструмент стал универсальным решением: подходит для интерфейсов, дизайн-систем, прототипов и продакшн-приложений.


https://github.com/FortAwesome/Font-Awesome

Совет по CSS! ✨

Вы можете сделать стили компонентов портативными с помощью контейнерных запросов 😎

Изменение макета карты в зависимости от размера 🔥
Удаление текста кнопки, если она маленькая 🤏

.card {container-type: inline-size;}
@ container (min-width: 50ch) {.info { grid-column: 2; }}

https://codepen.io/jh3y/pen/JjZavRJ

📋 Копирование в буфер обмена в 2025

Clipboard API - это уже стандарт для работы с буфером обмена.
А старый document.execCommand('copy') официально deprecated ещё с 2020 года.

Поддержка Clipboard API:
✔ Chrome 66+
✔ Firefox 63+
✔ Safari 13.1+
✔ Opera 53+

⚠️ Важные различия между браузерами:

Chrome / Edge
— Не требует user gesture
— Работает только в активной вкладке

Firefox / Safari
— Требуется пользовательское действие (клик/тап)
— Вызов должен быть внутри обработчика этого события

🔐 Общие требования
— Только HTTPS или localhost
— Для readText() нужно явное разрешение пользователя

Где применять Clipboard API
— Кнопки «Скопировать код»
— Промокоды
— Токены доступа
— Быстрое копирование ссылок

💡 Совет
Всегда вызывайте navigator.clipboard.writeText() внутри обработчика клика — это гарантированно работает во всех современных браузерах.

🚀 Умный инструмент для тестирования HTTP-запросов

rep+ — это легкое расширение для Chrome, вдохновленное Burp Suite, с поддержкой ИИ. Оно позволяет быстро захватывать и повторять HTTP-запросы, не требуя настройки прокси. Идеально подходит для исследователей безопасности и охотников за уязвимостями.

🚀 Основные моменты:
- Захват и повтор запросов без настройки прокси
- Интеграция с ИИ для объяснения запросов и предложений по уязвимостям
- Мощные фильтры и поддержка регулярных выражений
- Экспорт/импорт запросов в формате JSON
- Встроенный инструмент для скриншотов и анализа JavaScript

📌 GitHub: https://github.com/bscript/rep

#javascript

⚡️ Используйте сгенерированный CSS clip-path, чтобы получить более тонкую форму


.squircle {
clip-path: polygon(
100.00% 50.00%, 99.95% 62.53%, 99.80% 67.70%, ...
);
}

📱 Orion Store: Serverless App Store for Android 🚀

Orion Store - это современный прогрессивный Android-приложение, работающее без серверной части. Полностью функционирует на GitHub и может быть скомпилировано в нативный APK с помощью Capacitor. Имеет адаптивный дизайн и поддерживает автоматическое обновление приложений.

🚀 Основные моменты:
- 🎨 Яркий дизайн с темами Light, Dusk и Dark.
- 🤖 Поддержка нативных Android-устройств.
- ☁️ Полностью серверная архитектура на базе GitHub.
- ⚡ Умное кэширование для мгновенной загрузки.
- 🔄 Автоматическая система обновлений приложений.

📌 GitHub: https://github.com/RookieEnough/Orion-Store

#typescript

🚀 Вышел мощный сжиматель видео - сжимает ролики в десятки раз без заметной потери качества и битрейта.

На примере: файл ужался в 17 раз, при этом можно самому выбрать итоговое качество (низкое/среднее/высокое).

Встроен простой редактор: обрезка, поворот, отражение - всё за секунды.
Главное, что работает локально, без интернета, никакой передачи на серверы.

https://github.com/codeforreal1/compressO/releases/tag/1.4.0

Пишете на JavaScript, но всё ещё завязаны на фреймворки и готовые компоненты? Хотите понимать, как работает браузер, и создавать свои элементы, а не только использовать чужие?

На открытом уроке разберём, как JavaScript взаимодействует с DOM, как с помощью классов и ООП собирать структурированные компоненты и что такое Web Components на практике. Шаг за шагом создадим кастомный HTML-тег с нуля и подключим его к странице так, чтобы элемент можно было переиспользовать.

Урок будет полезен начинающим фронтенд-разработчикам и тем, кто хочет уйти от фреймворков к осознанному пониманию браузерного API. Вебинар проходит в преддверие старта курса «JavaScript Developer. Basic».

Встречаемся 22 декабря в 20:00 МСК.

Регистрация открыта: https://clck.ru/3QrWbt

Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576

🎮 Server Survival - браузерная игра, которая обучает облачной архитектуре через механику tower-defense.

Что это:
Server Survival - это 3D-симулятор, где вы строите устойчивую инфраструктуру, выдерживаете растущий трафик и отбиваетесь от атак, следя при этом за бюджетом и репутацией.

Ключевые особенности:
- Реалистичные концепции облачных систем: балансировщики нагрузки, кэш, очереди, базы данных, WAF, хранилище.
- Нужно одновременно обрабатывать легитимный трафик и защищаться от DDoS-подобных атак.
- Каждый компонент имеет стоимость, пропускную способность и расход на обслуживание — всё как в настоящей архитектуре.
- Два режима: Survival (рост нагрузки) и Sandbox (свободная настройка параметров).

Технологии:
- Игра работает прямо в браузере.
- Сделана на JavaScript + Three.js.
- Не требует сборки — достаточно открыть index.html.

Кому подойдёт:
- Начинающим DevOps/Backend разработчикам,
- Всем, кто хочет наглядно понять, как масштабируются реальные сервисы,
- Тем, кто любит игры, но хочет попутно изучать архитектуру.

Репозиторий: github.com/pshenok/server-survival

Hamburger Menu Animations

4 вида плавной анимации для гамбургер-меню, реализованные на чистом CSS.

https://codepen.io/Zaku/pen/ejLNJL

#css