beneckimateusz / pomodoro

Manage your time properly with a simple pomodoro technique helper.

pomodoro

Pomodoro technique helper

Manage your time properly with a simple web application

_{Built with ☕ by Mateusz Benecki}

Table of contents

• Tech stack
• Features
• Issues
• Presentation
• Development

Tech stack

• Frontend - React.js, MaterialUI, Apollo Client, Recharts
• Backend - Node.js, Express.js, GraphQL, Apollo Server
• Database - MongoDB, Mongoose

Features

• 🖥️ Dark theme: to reduce eyestrain
• ⏰ Browser notifications + alert sound: notice end of interval when using another app
• ⏳ Interval durations adjustment: whatever works for you
• 📊 Statistics: total and average - for logged-in users
• ⌨️ Keyboard shortcuts: forget about moving your mouse around
• ( ͡° ͜ʖ ͡°) Overall decent

Issues

• Currently only desktop resolutions are fully supported
• Statistics aggregation has a slight problem with date handling that could possibly be fixed with storing information about user's time zone

Presentation

Settings Dialog and Dark theme	Sign Up	Sign In	Notification

Statistics

Last x days

This year

Today

Development

Requirements for both client and server are listed in Tech stack section.

Server

# Clone environment variables template
cp .env.template .env
# Fill out envs
vim .env
# Install dependencies
npm i
# Run the development server
npm run dev

Now you can visit localhost:{port_from_dotenv}/api from your browser for an interactive GraphQL playground.

Client

# Change proxy port so it matches with the backend
vim package.json
# Install dependencies
npm i
# Run the development server
npm start

Now you can visit localhost:3000 from your browser.