Git Product home page Git Product logo

jtam128 / pomodoro-timer Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 699 KB

Thinkful Software Engineering Bootcamp Project - It is based on Francesco Cirillo's Pomodoro Technique. This application, in particular, allows the user to change and set up focus and break intervals. Audio plays when the focus and break timers expire.

Home Page: https://pomodoro-project-rosy.vercel.app/

HTML 6.36% CSS 1.85% JavaScript 91.79%
css html javascript react bootstrap4

pomodoro-timer's Introduction

Pomodoro-Timer-App

This is a web application I worked on while I attended Thinkful's Software Engineering Bootcamp. It is based on the Pomodoro Technique - described in the next paragraph. While working on it, I was able to practice rendering and state management in React.

The Pomodoro Technique is a time-management method developed by Francesco Cirillo in the late 1980s. The technique uses a timer to break down work into intervals, traditionally 25 minutes in length, separated by short breaks. Each interval is known as a pomodoro, from the Italian word for tomato, after the tomato-shaped kitchen timer that Cirillo used as a university student.

This application allows the user to change and set up focus and break intervals. Audio plays when the focus timer and break timer expires, respectively. All states are updated using callbacks to avoid race conditions. Each component has a single responsibility.

Live Link

Technology & Tools

Built with:

  • React
  • NPM
  • Bootstrap
  • JavaScript

Initial Screen

Alt text

Focus Screen

focusscreen

Break Screen

breakscreen

Pause Screen

pausescreen

Future Goals

Apply more CSS to make it visually appealing.

pomodoro-timer's People

Contributors

jtam128 avatar

Stargazers

Asther Marie Moreno avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.