React Challenge For You | React JS Simple Project - Countdown Timer Project in React JS

Опубликовано: 14 Апрель 2026
на канале: Yoshita Jain

10,414

217

Hi People,
In this video we will make countdown Timer Project in React.js.

CSS -

.countdown-timer {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
font-family: Arial, sans-serif;
}

.timer-display {
font-size: 2rem;
margin-bottom: 20px;
display: flex;
flex-direction: column;
align-items: center;
}

.timer-display input {
font-size: 1rem;
padding: 0.5rem;
margin-bottom: 10px;
text-align: center;
border: 1px solid #ddd;
border-radius: 4px;
width: 200px;
}

.timer-controls {
display: flex;
gap: 10px;
}

.timer-controls button {
padding: 10px 20px;
font-size: 1rem;
border: none;
border-radius: 4px;
background-color: #007bff;
color: white;
cursor: pointer;
transition: background-color 0.3s;
}

.timer-controls button:disabled {
background-color: #aaa;
cursor: not-allowed;
}

.timer-controls button:hover:not(:disabled) {
background-color: #0056b3;
}

**********************************************************
#beginners #coding #programming
Follow me on Social Platforms
Instagram - / jainyy.08
LinkedIn- / yoshita-jain-510893148

Thank you guys for your support, subscribe ‪@yoshitajain0812‬
Love,
Yoshita :)