JavaScript Countdown Clock Project

Hosted Project

JavaScript Countdown Timer (Hosted on Github Pages)

Source Files

https://github.com/romeojeremiah/countdown-timer-2 (Hosted on Github)

Project Objective

This JavaScript countdown timer project is very similar to the previously coded countdown timer. The biggest differences are the difference in CSS and this project uses two JavaScript functions.

JavaScript Used

• addEventListener()
• removeEventListener()
• DOM manipulation
• JavaScript CSS manipulation
• functions

My Personalize Summary

For this project, I decided to dive deep into the code.

Specifically, I wanted to make sure I calculated the correct number of days, hours, minutes, and seconds for the given date.

This part, the math, was the most difficult thing about this project.

Other than that, it wasn't too bad.

New Things Learned or Refreshed

This project was relatively easy but it did help me draw my attention to the slice() method once again.

I learned that the slice method also takes negative numbers as arguments.

So, if you use the slice methods on a string such as “Hello”.slice(-1), the negative tells the slice method to return the number of string values beginning at the end of the string.

In the case above, “o” will be returned.

Time to Code

This project took me about an hour to complete on my own and uses less than 50 lines of JavaScript code.

Your Turn!

What To Accomplish

1. Download the source code from the github repository above.
2. Delete the contents of the app.js file.
3. Implement the JavaScript code in your own app.js file.
4. If you think you need to see a video solution first, be sure to pick up Bluelime's 27 JavaScript Projects Beginner Course .
5. Add a link to your finished project below!

What You Should See

Visit the hosted github page to see this JavaScript Countdown Timer in action.

Need to see the video solution for this project?

Need to see the video solution for this project? Get Bluelime's JavaScript for Beginners: Create 27 Projects from Scratch Course Now!