⬇️ In this video, I 'll show you how to create a Pomodoro clock using javascript, jquery and bootstrap!
The inspiration for this project is coming from FreeCodeCamp.
In FreeCodeCamp you can find all the user stories. I'm going to implement only a few of them.
-User Story: I can start a 25 minute pomodoro, and the timer will go off once 25 minutes has elapsed.
-User Story: I can reset the clock for my next pomodoro.
-User Story: I can customize the length of each pomodoro.
-User Story: After 'break' or 'work' is done you'll hear a sound.
If you watched the video you know in the end I messed up.
Here is the correct code:
I misspelled the function 'onclick'
I capitalized the 'C'... it should have been 'onclick'
That was the only problem :)
Useful links
- Codepen: https://codepen.io/EleftheriaBatsou
- Background sound: http://soundbible.com/grab.php?id=1377&type=mp3
- Working project: https://codepen.io/EleftheriaBatsou/pen/ZEbXJLV?editors=0010
- Instructions on FCC: https://www.freecodecamp.org/learn/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock
- External Library for Animation: https://www.jqueryscript.net/demo/Customizable-Liquid-Bubble-Chart-With-jQuery-Canvas/ and https://www.jqueryscript.net/demo/Customizable-Liquid-Bubble-Chart-With-jQuery-Canvas/waterbubble.js
If you guys recreate this project send me a link to check it.
👋Hello, I' m Eleftheria, an app developer, master student, public speaker, and chocolate lover.
🍩Would you care about buying me a coffee? You can do it here: paypal.me/eleftheriabatsou but If you can't that's ok too!
🙏It would be nice to subscribe to my Youtube channel. It’s free and it helps to create more content.