💡 Полезный совет по 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
🚀 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