This media is not supported in your browser
VIEW IN TELEGRAM
🚀Claudable!
Claudable — это мощный конструктор веб-приложений на базе Next.js, который позволяет создавать и развертывать приложения, просто описывая их идею. Используя возможности AI-агента Claude Code, вы мгновенно получаете рабочий код и живой превью вашего приложения.
🚀 Основные моменты:
- Генерация кода на основе естественного языка
- Мгновенный просмотр изменений с функцией горячей перезагрузки
- Легкое развертывание на Vercel с одним кликом
- Интеграция с Supabase для работы с базами данных
- Автоматическое обнаружение и исправление ошибок
📌 GitHub: https://github.com/opactorai/Claudable
Claudable — это мощный конструктор веб-приложений на базе Next.js, который позволяет создавать и развертывать приложения, просто описывая их идею. Используя возможности AI-агента Claude Code, вы мгновенно получаете рабочий код и живой превью вашего приложения.
🚀 Основные моменты:
- Генерация кода на основе естественного языка
- Мгновенный просмотр изменений с функцией горячей перезагрузки
- Легкое развертывание на Vercel с одним кликом
- Интеграция с Supabase для работы с базами данных
- Автоматическое обнаружение и исправление ошибок
📌 GitHub: https://github.com/opactorai/Claudable
👍6🥴4❤2
💡 Полезный совет по React + CSS
Когда стили в компоненте начинают разрастаться, используйте CSS Modules или styled-components, чтобы избежать конфликтов классов.
Пример с CSS Modules
✅ Все стили изолированы, классы автоматически получают уникальные имена.
Это особенно удобно в больших проектах, где легко возникает путаница с CSS.
@react_tg
Когда стили в компоненте начинают разрастаться, используйте CSS Modules или styled-components, чтобы избежать конфликтов классов.
Пример с CSS Modules
import styles from "./Button.module.css";
export default function Button() {
return <button className={styles.primary}>Нажми меня</button>;
}
/* Button.module.css */
.primary {
background: #007bff;
color: white;
border: none;
padding: 10px 15px;
border-radius: 8px;
cursor: pointer;
}
.primary:hover {
background: #0056b3;
}
✅ Все стили изолированы, классы автоматически получают уникальные имена.
Это особенно удобно в больших проектах, где легко возникает путаница с CSS.
@react_tg
👍16🔥5❤2🕊2😁1
🎮 Освой Vim с VIM Master!
VIM Master — это легкая браузерная игра, которая обучает основным командам и движениям Vim через короткие уровни. Просто откройте
🚀 Основные моменты:
- Интерактивные уровни для изучения команд Vim.
- Поддержка нормального и вставного режимов.
- Лог команд для отслеживания нажатий клавиш.
- Режим вызова задач для проверки навыков под давлением времени.
📌 GitHub: https://github.com/renzorlive/vimmaster
#html
VIM Master — это легкая браузерная игра, которая обучает основным командам и движениям Vim через короткие уровни. Просто откройте
index.html и начните практиковаться без установки.🚀 Основные моменты:
- Интерактивные уровни для изучения команд Vim.
- Поддержка нормального и вставного режимов.
- Лог команд для отслеживания нажатий клавиш.
- Режим вызова задач для проверки навыков под давлением времени.
📌 GitHub: https://github.com/renzorlive/vimmaster
#html
👍9😁4🔥2❤1
🚀 Promises-Training — практикуй промисы в JavaScript
Promises-Training — это коллекция упражнений по промисам с автоматическими тестами, где можно прокачать работу с
⏩ Почему полезно:
- Пошаговый рост сложности: от простых примеров до нетривиальных сценариев.
- Автотесты сразу показывают, правильно ли решена задача.
- Хорошо подходит, чтобы глубже понять асинхронность и промисы.
- Есть упражнения по реальным случаям:
📦 Как начать:
Запуск проверки конкретного упражнения:
npm run check <category>/<exercise>
🔥 Итог: отличный способ на практике закрепить работу с промисами и уверенно освоить асинхронность в JS.
Лежит тут: https://github.com/henriqueinonhe/promises-training
#javascript #тренажер #js
@react_tg
Promises-Training — это коллекция упражнений по промисам с автоматическими тестами, где можно прокачать работу с
async/await, .then/.catch, конкурентным выполнением и ограничением параллельности. ⏩ Почему полезно:
- Пошаговый рост сложности: от простых примеров до нетривиальных сценариев.
- Автотесты сразу показывают, правильно ли решена задача.
- Хорошо подходит, чтобы глубже понять асинхронность и промисы.
- Есть упражнения по реальным случаям:
parallelMaxConcurrency, concurrencyOverride, extractingResolvers и др. 📦 Как начать:
npm create promises-training@latest
Запуск проверки конкретного упражнения:
npm run check <category>/<exercise>
🔥 Итог: отличный способ на практике закрепить работу с промисами и уверенно освоить асинхронность в JS.
Лежит тут: https://github.com/henriqueinonhe/promises-training
#javascript #тренажер #js
@react_tg
👍15❤7🔥4
@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡2❤1
@react_tg
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2❤1🐳1
This media is not supported in your browser
VIEW IN TELEGRAM
@react_tg
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥11❤🔥1❤1👍1
🔥 Успех в IT = скорость + знания + окружение
Здесь ты найдёшь всё это — коротко, по делу и без воды.
Пока другие ищут, где “подглядеть решение”, ты уже используешь самые свежие инструменты!
AI: t.iss.one/ai_machinelearning_big_data
Python: t.iss.one/pythonl
Linux: t.iss.one/linuxacademiya
Собеседования DS: t.iss.one/machinelearning_interview
C++ t.iss.one/cpluspluc
Docker: t.iss.one/DevopsDocker
Хакинг: t.iss.one/linuxkalii
Devops: t.iss.one/DevOPSitsec
Data Science: t.iss.one/data_analysis_ml
Javascript: t.iss.one/javascriptv
C#: t.iss.one/csharp_1001_notes
Java: t.iss.one/java_library
Базы данных: t.iss.one/sqlhub
Python собеседования: t.iss.one/python_job_interview
Мобильная разработка: t.iss.one/mobdevelop
Golang: t.iss.one/Golang_google
React: t.iss.one/react_tg
Rust: t.iss.one/rust_code
ИИ: t.iss.one/vistehno
PHP: t.iss.one/phpshka
Android: t.iss.one/android_its
Frontend: t.iss.one/front
Big Data: t.iss.one/bigdatai
МАТЕМАТИКА: t.iss.one/data_math
Kubernets: t.iss.one/kubernetc
Разработка игр: https://t.iss.one/gamedev
Haskell: t.iss.one/haskell_tg
Физика: t.iss.one/fizmat
💼 Папка с вакансиями: t.iss.one/addlist/_zyy_jQ_QUsyM2Vi
Папка Go разработчика: t.iss.one/addlist/MUtJEeJSxeY2YTFi
Папка Python разработчика: t.iss.one/addlist/eEPya-HF6mkxMGIy
Папка ML: https://t.iss.one/addlist/2Ls-snqEeytkMDgy
Папка FRONTEND: https://t.iss.one/addlist/mzMMG3RPZhY2M2Iy
😆ИТ-Мемы: t.iss.one/memes_prog
🇬🇧Английский: t.iss.one/english_forprogrammers
🧠ИИ: t.iss.one/vistehno
🎓954ГБ ОПЕНСОРС КУРСОВ: @courses
📕Ит-книги бесплатно: https://t.iss.one/addlist/BkskQciUW_FhNjEy
Подпишись, если хочешь быть в числе тех, кого зовут в топовые проекты!
Здесь ты найдёшь всё это — коротко, по делу и без воды.
Пока другие ищут, где “подглядеть решение”, ты уже используешь самые свежие инструменты!
AI: t.iss.one/ai_machinelearning_big_data
Python: t.iss.one/pythonl
Linux: t.iss.one/linuxacademiya
Собеседования DS: t.iss.one/machinelearning_interview
C++ t.iss.one/cpluspluc
Docker: t.iss.one/DevopsDocker
Хакинг: t.iss.one/linuxkalii
Devops: t.iss.one/DevOPSitsec
Data Science: t.iss.one/data_analysis_ml
Javascript: t.iss.one/javascriptv
C#: t.iss.one/csharp_1001_notes
Java: t.iss.one/java_library
Базы данных: t.iss.one/sqlhub
Python собеседования: t.iss.one/python_job_interview
Мобильная разработка: t.iss.one/mobdevelop
Golang: t.iss.one/Golang_google
React: t.iss.one/react_tg
Rust: t.iss.one/rust_code
ИИ: t.iss.one/vistehno
PHP: t.iss.one/phpshka
Android: t.iss.one/android_its
Frontend: t.iss.one/front
Big Data: t.iss.one/bigdatai
МАТЕМАТИКА: t.iss.one/data_math
Kubernets: t.iss.one/kubernetc
Разработка игр: https://t.iss.one/gamedev
Haskell: t.iss.one/haskell_tg
Физика: t.iss.one/fizmat
💼 Папка с вакансиями: t.iss.one/addlist/_zyy_jQ_QUsyM2Vi
Папка Go разработчика: t.iss.one/addlist/MUtJEeJSxeY2YTFi
Папка Python разработчика: t.iss.one/addlist/eEPya-HF6mkxMGIy
Папка ML: https://t.iss.one/addlist/2Ls-snqEeytkMDgy
Папка FRONTEND: https://t.iss.one/addlist/mzMMG3RPZhY2M2Iy
😆ИТ-Мемы: t.iss.one/memes_prog
🇬🇧Английский: t.iss.one/english_forprogrammers
🧠ИИ: t.iss.one/vistehno
🎓954ГБ ОПЕНСОРС КУРСОВ: @courses
📕Ит-книги бесплатно: https://t.iss.one/addlist/BkskQciUW_FhNjEy
Подпишись, если хочешь быть в числе тех, кого зовут в топовые проекты!
❤2
🌊 Эффект жидкого стекла для React Native
Liquid Glass добавляет эффект жидкого стекла iOS 26 в приложения React Native. Позволяет настраивать цвета и использовать два режима эффекта: прозрачный и обычный. Идеально подходит для создания стильных интерфейсов.
🚀 Основные моменты:
- Эффект жидкого стекла для iOS 26
- Настраиваемые цвета и режимы
- Поддержка взаимодействия с элементами
📌 GitHub: https://github.com/callstack/liquid-glass
#javascript
Liquid Glass добавляет эффект жидкого стекла iOS 26 в приложения React Native. Позволяет настраивать цвета и использовать два режима эффекта: прозрачный и обычный. Идеально подходит для создания стильных интерфейсов.
🚀 Основные моменты:
- Эффект жидкого стекла для iOS 26
- Настраиваемые цвета и режимы
- Поддержка взаимодействия с элементами
📌 GitHub: https://github.com/callstack/liquid-glass
#javascript
❤3🥱1🥴1
This media is not supported in your browser
VIEW IN TELEGRAM
✨ Craft.js — React-фреймворк от prevwong для создания drag-and-drop редакторов страниц с полным контролем над UI и логикой.
● Построй свой редактор с нуля: компоненты, состояние, перетаскивание, JSON-экспорт/импорт
● Абсолютно гибкий
● Уже 8k+ ⭐ на GitHub и ~800 форков
● В разработке новая система Reka — позволит создавать компоненты с props и state как в настоящем React
👉 https://github.com/prevwong/craft.js
@react_tg
● Построй свой редактор с нуля: компоненты, состояние, перетаскивание, JSON-экспорт/импорт
● Абсолютно гибкий
● Уже 8k+ ⭐ на GitHub и ~800 форков
● В разработке новая система Reka — позволит создавать компоненты с props и state как в настоящем React
👉 https://github.com/prevwong/craft.js
@react_tg
❤🔥9