Frontend Mentor - Pomodoro app solution

This is a solution to the Pomodoro app challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
• Author

Overview

The challenge

Users should be able to:

• Set a pomodoro timer and short & long break timers
• Customize how long each timer runs for
• See a circular progress bar that updates every minute and represents how far through their timer they are
• Customize the appearance of the app with the ability to set preferences for colors and fonts

Screenshot

Links

• Solution URL: https://www.frontendmentor.io/solutions/pomodoro-app-g0czRqYRvU
• Live Site URL: https://pomodoro-lsh.vercel.app/

My process

Built with

• typescript
• react.js
• tailwind css
• headlessui
• react-countdown-circle-timer

What I learned

• headlessui 사용법
• useContext & useReducer

Author

• Frontend Mentor - @SH-Lee2
• Blog - 뚜벅

Note: Delete this note and add/remove/edit lines above based on what links you'd like to share.