Build a DIGITAL CLOCK using React in 15 minutes! 🕒

[@BroCodez]

import DigitalClock from './DigitalClock.jsx'; function App() { return ( ) } export default App body{ background-image: url(assets/background.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; margin: 0; /* OPTIONAL */ display: flex; justify-content: center; min-height: 100vh; align-items: center; } .clock-container{ backdrop-filter: blur(5px); width: 100vw; padding: 10px 0; } .clock{ color: white; font-size: 6rem; font-weight: bold; font-family: monospace; text-align: center; text-shadow: 3px 3px 5px hsla(0, 0%, 0%, 0.75); } import React, {useState, useEffect} from 'react'; function DigitalClock(){ const [time, setTime] = useState(new Date()); useEffect(() => { const intervalId = setInterval(() => { setTime(new Date()); }, 1000); return () => { clearInterval(intervalId); } }, []); function formatTime(){ let hours = time.getHours(); const minutes = time.getMinutes(); const seconds = time.getSeconds(); const meridiem = hours >= 12 ? "PM" : "AM"; hours = hours % 12 || 12; return `${padZero(hours)}:${padZero(minutes)}:${padZero(seconds)} ${meridiem}`; } function padZero(number){ return (number < 10 ? "0" : "") + number; } return( {formatTime()} ); } export default DigitalClock;

[@-ECE-RaviShankar]

First comment.............yeah big fan from india, can you please tell when this series is completed.

[@reiayanami1441]

we need a full course of react, please bro. love your videos from italy

[@BroCodez]

Coming soon!

[@MrBaninations]

Broo@@BroCodez​, It will also include Redux, right? You're the best Teacher out here

[@greengoatsh1t888]

@@BroCodez 🔥🔥🔥

[@salad333]

@@BroCodez please do, i'm still struggling how to install React in Visual Studio code 😑😐

[@tasneemayham974]

Yes!!! PLEASEEE!!! i RUN AWAY WHENEVER I SEE REACT!! WE NEED YOU BRUHHH!!!

[@ITBIENVENU]

thanks bro code, you remind me more css 🤣🤣, i'm your big fan from rwanda

[@BishanTamang-rk5ji]

Make java 2024 plz....Big fan love from Nepal

[@DomingoMateo-e8t]

Im beginner but this is awesome!!! Im learning to much!! Thkssssss

[@Albert_Hall]

Great great Thank you With gratefulness from Caucasus

[@Thaisann-f3l]

I really like your video Bro Code. I try to learn about your video until the end

[@-ECE-RaviShankar]

First comment.............yeah big fan from india, can you please tell when this series is completed.

[@BroCodez]

Early February is my goal

[@-ECE-RaviShankar]

Ok , I am following your JS Full course of 2024 and omg it is just like a wow...@@BroCodez

[@talhakhan4684]

@@BroCodez Hi bro, do you have any plans to make videos on react-router-dom and redux-toolkit?

[@alfaorionis69]

thank you Bro, your tut orial is very instructive

[@alivejack]

0:56 defauly 😂😂❤

[@josea8320]

Genial, saludos desde Perú!

[@KingOfMadnesss]

After you complete your react full course, you should do an SFML full course

[@Aryan-de9jw]

I would really love to see that. 😊

[@Aryan-de9jw]

oh! and maybe a graphics programming tutorial as well.

[@fieryscorpion]

What is SFML?

[@KingOfMadnesss]

@@fieryscorpion A C++ library. You can build 2D and 3D softwares using it. With just C++, you can only build console applications

[@angtran4119]

oh thank you so much

[@yukicheniwla]

please explain for us laravel, ur the best bro, me and my friends we're learning a lot from u thanks for help us , from morocco

[@Nurhussein2023]

great

[@KristiKoroveshi-i9s]

How did you make the css work without importing it on the jsx ?

[@otabekmadaminov-z2i]

Thank you bro

[@mk-vg1mx]

thanks a lot

[@andromilk2634]

Is there a reason you started hours with "let" but for the other units of time you used "const" instead?

[@tharinduminiruwan7842]

❤

[@AbhayRajKarun]

I am surprised it's at 100 views even after 26 minutes Crazy !

[@diamondemerald6271]

Pls do a cmd course

[@millad90s]

could you please share the code in github or ... ? thank you

[@_amonimus_]

how many programing languages do you know

[@hydrogennetwork]

can you teach java spring please?

[@chorkaniitv3386]

Make android studio with java plz ..? I can't wait

[@rawa97775]

Please tutorial for discord bot for python please bro❤

[@diamondemerald6271]

Next full course is CMD

[@stylosuf1394]

Python flet please 2024....

[@hollycow8171]

return (number < 10 ? "0" : "") + number; CAN YOU ALSO REPLACE IT WITH return (number < 10 ? `0${number}` : number);

[@vigneshsainallamothu4117]

bro code for main.jsx file