React JS
16.7K subscribers
657 photos
99 videos
5 files
766 links
React программирование

@haarrp - admin

@itchannels_telegram - 🔥лучшие ит-каналы

@javascriptv - продвинутый javascript

@programming_books_it - бесплатные it книги

@ai_machinelearning_big_data - ml

№ 5037566384
Download Telegram
🔥21😁11👍32
This media is not supported in your browser
VIEW IN TELEGRAM
Pagination - Simple Pagination

Симпатичный эффект при переключении страниц, созданный на чистом CSS.

https://codepen.io/Azametzin/pen/ZEVKJNX
8👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Infinitely drawing icons

Вся сцена - это svg картинка, анимируемая библиотекой anime.js

https://codepen.io/ainalem/pen/dKjgBx
9🔥4
This media is not supported in your browser
VIEW IN TELEGRAM
Experimental Gradient Editor

Приложение для генерации градиента, написанное на Vue.

https://codepen.io/meodai/pen/xyqoEO
👍13
🤣44👍6😁41😢1
This media is not supported in your browser
VIEW IN TELEGRAM
CSS Blossoming Flowers at Magical Night

Анимированная сцена, написанная с помощью SCSS и JavaScript.

Смотреть код
👍138🐳1
This media is not supported in your browser
VIEW IN TELEGRAM
Dashy — это мощная и гибкая панель инструментов для управления и мониторинга ваших сервисов. С ее помощью можно организовать ссылки, отображать виджеты с системной информацией и настраивать интеграции с различными API.

Основные возможности:
Полностью настраиваемый интерфейс
Поддержка тем и кастомных стилей
Встроенные виджеты для мониторинга сервисов
Интеграции с API и сторонними сервисами
Простота развертывания через Docker

https://github.com/Lissy93/dashy
👍71🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Scrubbing, scrolling and splitting

Анимация при скролле, реализованная при помощи библиотеки gsap.

https://codepen.io/BlogFire/pen/NWYRqmv
4👍3🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
Clocktober day 21: Perspective - Стильные часы для вашего сайта

https://codepen.io/jkantner/pen/BaMazpK
👍6🔥32
🌟 DOOM на CSS

Представлен проект cssDOOM, подготовивший реализацию игры DOOM, использующую для отрисовки только CSS, без применения элемента canvas и WebGL.

Всё что выводится на экран, включая спрайты, текстурированные стены, уровни и эффекты, оформлено через стилизованные при помощи CSS элементы <div>, размещаемые в 3D-пространстве при помощи CSS-свойств "transform" и"transform-style: preserve-3d". Игровая логика написана на JavaScript, используя в качестве эталона оригинальный код игры DOOM, открытый компанией id Software. Наработки проекта опубликованы под лицензией GPLv2.

https://cssdoom.wtf/
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥24👍2🕊1
Утечка кода инструментария Claude Code из-за забытого в NPM-пакете map-файла

Компания Anthropic по недосмотру опубликовала в составе выпуска NPM-пакета claude-code 2.1.88 полный необфусцированный исходный код инструментария Claude Code на языке TypeScript. Код попал в релиз в составе map-файла cli.js.map, применявшегося в ходе отладки. Для предотвращения подобных утечек разработчикам рекомендуется не забывать добавлять маску *.map в файл .npmignore.

Подробнее:
https://opennet.ru/65114/
https://opennet.me/65114/
😁11👍72🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
Красивая платежная форма на JS с валидацией правильности заполнения полей.

Если в браузере пользователя сохранены платежные данные, то форма и предложит их автозаполнение.

https://codepen.io/myacode/pen/ExPOdBd
13👍7🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Знаете ли вы, что в CSS можно определить поворот с помощью блока turn? 🤩
👍2515
This media is not supported in your browser
VIEW IN TELEGRAM
Variable Fonts and the Web Audio API

Демонстрация Web Audio API, изменяющая переменные шрифты на основе аудиовхода. Реализована с помощью JavaScript.

https://codepen.io/mandymichael/pen/OYpqdP
👍3😁3
Поддержка с волшебной палочкой!
GoodClaude — это приложение, которое позволяет отправлять слова поддержки с помощью волшебной палочки. Оно создано на основе BadClaude, но вместо наказаний предлагает только добрые слова.

🚀 Основные моменты:
- Визуализация волшебной палочки с блестками
- Звуковые эффекты при отправке сообщений поддержки
- Список вдохновляющих фраз для Claude
- Возможность кастомизации сообщений в будущем

📌 GitHub: https://github.com/ashley-ha/goodclaude

#javascript
4👏3🖕1
This media is not supported in your browser
VIEW IN TELEGRAM
Совет по использованию инструментов Chrome Dev Tools 💡

Знаете ли вы, что с помощью Chrome Dev Tools можно легко отслеживать, какие события срабатывают на элементе, и просматривать свойства этих событий?
19👍7🔥5
JavaScript. Что будет выведено в консоль?

Ответ
😐10👍4😁1
This media is not supported in your browser
VIEW IN TELEGRAM
Range Slider

Стилизованный input type="range" с градиентной светящейся полосой.

https://codepen.io/jkantner/pen/VwxeeVb
4👍4
👣 На Stepik обновили курс «Rust: полный курс разработчика. С нуля до профи»

Представьте: через три месяца вы открываете чужой Rust-код и читаете его как книгу.

Arc<Mutex<T>> не вызывает панику. impl Future не пугает. Вы точно знаете, почему компилятор ругается и как это починить за 10 секунд.

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

Ownership, traits, generics, async, unsafe - всё, что казалось магией, станет рабочим инструментом.

А бонусом - портфолио проектов: от CLI-утилит до REST API и WebAssembly.

Вы и так знаете, что Rust - ваш следующий язык. Этот курс просто сделает это реальностью.

Сегодня - 55% процентов от цены, торопись: https://stepik.org/a/269250/
Please open Telegram to view this post
VIEW IN TELEGRAM
2👍1🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
iPhone 14 w/ Dynamic Island

Верстка реализована с использованием препроцессоров Pug и SCSS. Каждая нажимаемая кнопка - это input с type="radio", при нажатии на который активируются определенные стили.

https://codepen.io/lukemeyrick/pen/poVyEdZ
👍63🔥1