How To Create Digital Clock Using HTML CSS & JavaScript

No video

How To Create Digital Clock Using HTML CSS & JavaScript | Display Time Using JavaScript

Рет қаралды 150,765

Күн бұрын

Learn How To Create Digital Clock Using HTML CSS and JavaScript | Make Digital Clock with JavaScript step by step tutorial for beginners
❤️ SUBSCRIBE: goo.gl/tTFmPb
Source Code: greatstack.dev...
More JavaScript Projects: greatstack.dev/
In this JavaScript Mini project we will make a Digital clock that will display the current time in Hours, Minutes and second. This JavaScript clock display the time as per Local time zone.
We will use HTML and CSS to design this Clock, and for Updating the current time we will use JavaScript Date Object. You can use this Digital clock tutorial to make your Mini JavaScript Project for college or work portfolio.
#JavaScriptProject #javascript
-----------------------------------------
Suggested Course:
❤️ Complete website Using HTML and CSS
✔️ 8 Complete website step by step
✔️ Source Code Download
✔️ 76 Lectures, 12 Hours Video
✔️ Course Completion certificate
👉 easytutorialsp...
-------------------------------------
Recommended Videos:
Learn Complete HTML and CSS from basics:
► • HTML And CSS Tutorial ...
Make A Complete Website for college using HTML & CSS:
► • How To Make A College ...
How to make a Business website step by step:
► • How To Make Website Us...
How to make personal resume website step by step:
► • How To Make A Website ...
How to make fitness website design using HTML CSS:
► • How To Make A Website ...
How to make an Ecommerce Website Design:
► • How To Make eCommerce ...
How to make a Job Portal website design with HTML & CSS:
► • How To Make Website Us...
How to make travel website design with HTML CSS Bootstrap:
► • How To Make A Website ...
-------------------------------------
Affordable web hosting (coupon- EASYTUTORIALS)
👉 easytutorialsp...
My recommended tools and tutorials
👉 easytutorialsp...
-------------------------------------
◼️ Source code link is shared in community post for all my coding videos exclusively for channel members (only channel members can see)
Join Channel Membership:
► / @greatstackdev
-------------------------------------
Connect with me:
👉 linktr.ee/iama...

Пікірлер: 152

@mihirtechneer4377 4 сағат бұрын

Thank you very much ! I am 54, not from IT but Mechanical Engineer with 30 years experience in Maintenance and Engineering. This is my 8th clock project ! Learned many different ways of making fascinating clocks. ❤❤❤

@leonardigweokolo2813 7 ай бұрын

You're doing this tutorial as if to prove a point that you can do them. Instead of teaching the steps and why you do certain things, like what does "position - absolute mean" when should it be used and why, that will really help beginners immensely. Altogether thank you for sharing.

@Pythongirl_ 6 ай бұрын

bro if you don't know the meaning of position absolute yet, then why you even bother to make this project, learn CSS first

@leonardigweokolo2813 6 ай бұрын

@@Pythongirl_ Are you sure understood the comment? You twerp!!! Understand the comment first, then maybe I'd give you some attention.

@emmanuelsiziba520 6 ай бұрын

I agree with you, you can not learn from these tutotirial without basic fundementals, i do tutorials on freecode camp where they strip everything down to its basic component, and then use these tutorials to apply the knowlegdge from freecode camp and practise coding on VS code @@Pythongirl_

@AyomikunOjetunde 9 күн бұрын

@@Pythongirl_ Actually😅

@zabihibrahimkhil 11 ай бұрын

I followed many online classes for mini projects, but this one by far is one of the best , thank you for sharing knowledge

@boydmutokoma2370 Жыл бұрын

Best teacher ever, I wish my grade school teacher where like u I would have been an engineer.

@rajamannar4861 Жыл бұрын

Finally I find best you tube channel to learn css 😊

@RajKumar_akhariya Жыл бұрын

Best teacher on KZfaq to make beautiful project.

@mhendrasingh7503 Жыл бұрын

Thankyou sir, i am 11 years old and this was my first successful html project❤ jai shree ram.

@user-dc3io9hy8h 11 ай бұрын

I am also bro

@bidyutghosh1983 8 ай бұрын

Joy Shree Ram ❤️🙏🏽

@mianabubakar5987 8 ай бұрын

Allah Huakbar

@allahlesboslu2_9 7 ай бұрын

@lyrics._143😂😂😂 Abey n # llahu f . K Barr usko Jo bolna h bolne de tu kyu Teri a u k @ t dikhaa rha hai

@allahlesboslu2_9 7 ай бұрын

@@mianabubakar5987debate with ex m sahil and Zafar heretic saara olaa uber utarr jaayega tum log ka

@jcchaconjr 5 ай бұрын

Thank you for this simple and easy to understand project. I've been learning and playing around with Blazor using .NET 8, and thought this would be a fun page to refactor into a Blazor component page using C# code instead of JavaScript. Implementing the timer in a manner that would not hang the page rendering was the most challenging part, but thanks to a little help from StackOverflow, I found a good suggestion to implement the necessary override for the page's OnInitializedAsync() method that I was able to refactor to update the clock every second like the JS code.

@nanafreedom2476 Жыл бұрын

This tutorial is one the greatest tutorial I've ever come across!! Thank you very much

@bumblebee_1 5 ай бұрын

thnx! Simple and clear to understand

@subyouwont Жыл бұрын

Great tutorial once again. So glad I found this channel. I would pay for these mini classes. Very easy to follow as a beginner

@Arvindvishwakarma-ff7fu 4 ай бұрын

Smooth Explanation Man! thnx

@YoCode08 3 ай бұрын

Work❤, thanks you sir❤❤

@GreatStackDev 3 ай бұрын

You're welcome. Thank You. 😊

@learnwithnagma 5 ай бұрын

Thank you so much 😊.

@thedinkydreads9351 4 ай бұрын

You, Sir, are my hero

@UtiFavour Жыл бұрын

Awesome video! Biggest fan.... Your tutorial is detailed and insightful.

@preciousonyiocha92 10 ай бұрын

Thank you sir, this tutorial is much more easier than the one I have watched

@lordljb4772 Жыл бұрын

Amazing Tutorial! Thanks for this great looking clock! Im so glad u made a vid :D Greetings from Germany

@sunilkumar_vlogs Жыл бұрын

Sir ji your English talk is so simple and sweet ❤❤❤

@sharooq5842 Жыл бұрын

Thank u your videos are great and ur explanation is also great but it would be great if u explain like these lines of code does these (single individuals) thise will help a lot for beginners like me

@citizen00001 8 ай бұрын

this was a great tutorial to follow, thank you!

@user-dc6ib4mb2v Жыл бұрын

Finaly i got the best channel for Learning coading ❤

@kirthikar148 2 ай бұрын

Simple and clear! 👍🏽

@GreatStackDev 2 ай бұрын

Glad you think so!

@English_604 9 ай бұрын

I love your Chnnel...your videos help me a lot.. ❤.

@aamirmasood010 Жыл бұрын

you made it look so easy man loved it

@bedtimehorrorstoryyoutube Жыл бұрын

This tutorial is awesome easy and very clear!! Thank you!!

@AdiJadhav-ie7zp 2 ай бұрын

great work sir

@GreatStackDev 2 ай бұрын

Thank You. 😊

@saisuba2698 Ай бұрын

Awasome 🎉, crystal clear explanation 🎉🎉..... go-ahead sir, i have one doubt, i need media query i want to use this digital clock in my ph?...i tried it not came

@StriveVoyage 8 ай бұрын

great thank you

@anteoleonardi9413 Жыл бұрын

@GreatStack why don't you use classes's and you call them on JS with querySelector but instead you use 3 ID's and you call them by ID on JS ? Btw love your channel 😃

@GreatStackDev Жыл бұрын

I will consider it for new video, thank you so much for comment

@Anusha_Patel24 8 ай бұрын

Thank you sooo much 😊 And it will be very useful...

@kazikazz1085 Жыл бұрын

love your tutorials

@RishabhShriwas-md2gq Жыл бұрын

Thank you for this tutorial sir 😊

@vijayachandana8485 Жыл бұрын

Your tutorial were helpfull👍keep going.

@sitirobiahhamdan1406 11 ай бұрын

hey , its so awesome , i have try it and its so amazing , thank you

@fuchecomcilyuh1443 10 ай бұрын

God bless you for this video.

@KuirThuch 6 ай бұрын

You were born to teach

@siamnahidul4771 Жыл бұрын

Best Teacher

@pratikshyajena74 9 ай бұрын

Thank you so much sir❤ you are great!

@sonya7009 Жыл бұрын

another great tutorial mate, thank you

@superrobot2960 Жыл бұрын

Can you make a video of javascript full course 😢 🙏 Please

@nayaye1795 Жыл бұрын

Thanks bro! I love it!

@Toonzkidsforkids Ай бұрын

Sir ,why have you used 1000 in the set interval ?? Can we use any other numbers instead of 1000?

@Tani55 2 ай бұрын

Thanks bro

@skylake315 10 ай бұрын

Thanks you for the tutorial sir

@ukaegbugreatjnr 16 күн бұрын

I love the video but Instead of using the teneray operator, why not use the padStart(2,0) method;

@mustafa._.9371 6 ай бұрын

Thank You!

@SmileFNPlug Жыл бұрын

Great video sir 🙏👌👍

@gaming4_16 8 ай бұрын

great bhai

@nguyenangviet1752 10 ай бұрын

Amazing Good Job

@shoaibahsan1822 6 ай бұрын

GREAT BRO

@muhammadharis5389 Жыл бұрын

Thank u sir you are awesome

@yrew2004 Жыл бұрын

Thanks sir

@welkin_shayar Жыл бұрын

Amazing video sir❤❤

@GreatStackDev Жыл бұрын

Thanks a ton

@harshkumarsharma350 Жыл бұрын

Great man

@dancepractice805 Жыл бұрын

Good video and helpful video

@chargeff06 14 күн бұрын

7:24 my z-index is not working, can anyone help me. I've written same code as him but still it is not working

@Themescore Жыл бұрын

Sir ❤can you make a website according to me I'll pay to you for that.😊 In which platform I'll message you reply me

@petermwansa4890 6 ай бұрын

Thank you

@lavkumargahe8174 Жыл бұрын

Best explanation

@GreatStackDev Жыл бұрын

Glad you think so!

@DINNAlk Жыл бұрын

😊 Thank you sir

@savita_369 Жыл бұрын

Thanku sir❤

@MindMatrixx1416 3 ай бұрын

Legends one day before competition 😎😎

@deepikakumaricse7416 8 ай бұрын

Overall it's nice but it would be more better when it is responsive

@herosipet 6 ай бұрын

Hi, This is my first test program. I believed I did everything the way yo did the program but mine will not run the clock. Stays at 00:00:00 only. If you could help I would really appreciate it. Thank you and please reply.

@citymuqdisho2899 Жыл бұрын

Pro l need Car game good Design❤

@_IamHarsh Жыл бұрын

sir ek button lagana ho or button ke press ke baad ye mujhe current real time dikhaye, iske liye kya karna hoga ?

@joeythai1000 Жыл бұрын

How do you can to do an transparence effect without opacity ?

@nusratfatemafamail9037 5 ай бұрын

wow

@vloggingwithmichael7635 5 ай бұрын

You only made a 1container in html but in css you make 3containers (after and before) and when you run, the square and circle doesn't show 😂😂

@user-ym2kp3gn9v 9 ай бұрын

🔥🔥

@dancepractice805 Жыл бұрын

Why do you not make programs in sublime text ?

@Bnymn 27 күн бұрын

Why do you use hero div istead of the body

@sivaganesh96 9 ай бұрын

please make a tutorial on live score web app for cricket

@MyGamingEra Жыл бұрын

One video on merge calendar and time also😅

@thereisnoname2052 Жыл бұрын

Can you do Countdown 😊😊

@Gaming4Ever-pt9li 6 ай бұрын

the css is working and the numbers are showing but it wont update and its giving telling me that getelementbyid is not defined and the time is not working

@adilimran6923 2 күн бұрын

CAN YOU TELL ABOUT 12 HOURS FORMAT

@ironman-29 Жыл бұрын

make video on Tic tac toe game using javascript

@nethiv_surya_prakash8699 10 ай бұрын

can I post these type projects in resume in project section?

@Rits2203 8 ай бұрын

it's a mini project. You can add this with one of your big projects on your resume.

@SarveshKumar-bl9in Жыл бұрын

can you tell me that how to make responsive this website ?

@isidoramoonrose5657 Жыл бұрын

why the rect and the circle are not appearing? i did the same thing...hmm

@RahulSharma-jv7rj Жыл бұрын

hi bro, please help me I am not able to select any class in my CSS file, while adding .hero its being red and throwing an error. please help me. thank you

@whonixgaming Жыл бұрын

link css from html

@epps2021 11 ай бұрын

followed the entire video and did what you did but now how to you change it from military time to regular time? Instead of being 15:00:00 to 3:30:46 or am to pm

@hariharang1191 11 ай бұрын

Use if condition. If (hour

@hariharang1191 11 ай бұрын

Use if for same AM PM or many other options to show AM PM

@vishalmeharban1782 7 ай бұрын

backdrop filter effect is not working on my vscode

@shouravshingha9311 9 ай бұрын

bro this code is not working don't know why.... i can't find any problem

@monalisaswain2524 10 ай бұрын

How can am and pm will show?

@ZaahidEditzzz 11 ай бұрын

How can I make the code show the 12 hour clock

@bibifathima-fq7gk Жыл бұрын

innerhtml is not working for min and sec..pls explain what is the reson.where hours work

@bibifathima-fq7gk Жыл бұрын

in console it show "cannot set property for null steeting(innerHTML)" will you pls explain why ..its shows for min.innerHTML.currentTime.getMInutes();

@bibifathima-fq7gk Жыл бұрын

i got the solution in the place of min i used mint then its works...😀😀,can you explain y its happen like that