/intention-timer

Primary LanguageJavaScript

Intention-timer

Table of Contents

Overview and Project Goals

The goal of this group project that was made for Mod1 at Turing School of Software and Design is to build a Intention Timer from scratch using HTML, CSS, and Vanilla Javascript.

Why was this project created?

To solidify and demonstrate the understanding of:

  1. writing clean and DRY HTML, CSS, and JS
  2. understand the difference between the data model and how the data is displayed on the DOM
  3. the interaction between multiple class files
  4. implementation of client-side data persistence by utilizing JSON and localStorage

Features

  • A website that allows users to set a timer for one of three selected activities. User can input the description of their activity and select a time of duration that they would like to take part in.
  • User can log that activity and add as many activities as they would like.

Back to top

How does this work?

GitHub Page Link: https://mendozalourdes.github.io/intention-timer/

Back to top

Want to contribute?

Instructions for Running Project

  1. Clone this repository.
  2. cd into the repository in your terminal.
  3. Then open index.html in your terminal to view it on your browser.

Technologies Used

javascript html5 CSS3 Github

Project Reflection

Wins
  • We got to iteration 5 and were able to experiment with local storage.
  • Our CSS styling improved.
  • Better understanding of Data Model and the DOM and manipulating HTML elements.
Challenges
  • The timer was the most challenging, and learning to implement users input to the timer accordingly.
  • Retrieving local storage and displaying on DOM.
Overall Impressions
  • We are ROCKSTARS!!!
  • We learned how to work collaboratively
  • Learned that time escape us, and it gets hard to stick to a timeline.

Future Features

  • Display Local storage so user has the ability to come back to their logged activities.
  • Add a user login functionality
  • Animate the Timer animate the border around the timer in a way that communicates how much time is left.
  • Pausing the Timer after the timer begins, a user should be able to pause the timer and resume an activity when they wish

Credits

Authors

Lourdes Mendoza GH
Lourdes GH img
Maria DelSignore GH
Maria GH img
Eva Navarrete GH
Eva GH img

Reviewers

Taryn Martin GH
Heather GH img

Project Manager

Heather Faerber GH
Heather GH img
This project was created for Turing School of Software and Design
2021/04/20

Back to top