Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
JavaScript Exercise Countdown Timer
Rating: 4.5 out of 5(100 ratings)
3,848 students

JavaScript Exercise Countdown Timer

Explore how to apply JavaScript to create a countdown timer - Practice exercise for JavaScript
Created byLaurence Svekis
Last updated 11/2024
English

What you'll learn

  • Create interactive JavaScript Countdown timer
  • Use JavaScript Date object and apply Logic

Course content

2 sections21 lectures1h 18m total length
  • Introduction JavaScript Countdown Timer Exercise2:17
  • Setup HTML page elements7:35
  • Some CSS Styling for Countdown5:36
  • Source Code HTML and CSS0:20
  • JavaScript Countdown Variables6:02
  • Source Code JavaScript0:05
  • Event Listeners JavaScript4:10
  • Source Code JavaScript0:07
  • Starting the Clock JavaScript4:21
  • Source Code JavaScript0:11
  • JavaScript Date Get Time Remaining6:38
  • Update HTML elements JavaScript5:09
  • Source Code JavaScript0:17
  • Save Timer to LocalStorage4:04

    Store the countdown timer in local storage so the end date persists after refresh, using get item, set item, and converting to a date object for the input.

  • JavaScript Exercise Code Review6:47

    Review the JavaScript exercise code that builds a countdown timer by selecting DOM inputs, structuring the clock, and updating days, hours, minutes, and seconds. Starts the clock.

  • Project Source Code0:23

Requirements

  • Basic JavaScript knowledge
  • HTML and CSS experience
  • Desire to learn JavaScript

Description

JavaScript Practice Exercise - Learn to apply JavaScript to build a countdown timer from scratch!

Course demonstrates how to use JavaScript within a practice exercise, applying JavaScript to connect to HTML elements and user interactions.  Let the user select a date and JavaScript will return and output the amount of time left until that date is reached.   The countdown is displayed within the HTML elements, using JavaScript to manipulate the element content.  Scope of this course is to help outline the steps in logic to build with JavaScript code.  Planning and where to start to build.

Prefect course for beginners to learn JavaScript!!! Step by step learning with all steps included.  Fun and exciting way to learn and practice JavaScript. by applying what is presented in the lessons and building your own version of the applications.  Make it even better, style it and try out JavaScript.

Beginner JavaScript knowledge is required as the course covers only JavaScript relevant to the building of the countdown timer.  Also HTML and CSS knowledge is essential as scope of this course is all JavaScript focused.  

  • how to setup your HTML elements and CSS basic stlying
  • add event listeners for user interactions to invoke JavaScript functions
  • Use JavaScript Date Method calculate the date difference
  • Manipulate and update HTML elements using JavaScript
  • Store values in the browser local Storage for seamless loading of content

All this is included and a whole lot more.  

Along with friendly support in the Q&A to help you learn and answer any questions you may have.

Try it now you have nothing to lose, comes with a 30 day money back guarantee.  

Start building your own version of the countdown timer today!!!!

Who this course is for:

  • Anyone who wants to learn an practice JavaScript
  • Web developers
  • Beginners to JavaScript
  • Anyone who wants to learn more about using JavaScript