https://github.com/y-temp4/worktime-calc

This is a web application to calculate work time with multilingual support (English/Japanese).
https://github.com/y-temp4/worktime-calc

calculator github-pages i18n postcss react tailwindcss typescript vite

Last synced: 2 months ago
JSON representation

This is a web application to calculate work time with multilingual support (English/Japanese).

• Host: GitHub
• URL: https://github.com/y-temp4/worktime-calc
• Owner: y-temp4
• Created: 2024-09-19T11:55:32.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2026-01-17T16:47:43.000Z (5 months ago)
• Last Synced: 2026-01-18T01:15:11.178Z (5 months ago)
• Topics: calculator, github-pages, i18n, postcss, react, tailwindcss, typescript, vite
• Language: TypeScript
• Homepage: https://y-temp4.github.io/worktime-calc/
• Size: 3.13 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# worktime-calc

[日本語](./README_ja.md) | English

![OGP](./public/ogp_en.png)

[![Preact](https://img.shields.io/badge/Preact-10.25.1-673AB8?logo=preact&logoColor=white)](https://preactjs.com/)

[![TypeScript](https://img.shields.io/badge/TypeScript-5.9.3-3178C6?logo=typescript&logoColor=white)](https://www.typescriptlang.org/)

[![Vite](https://img.shields.io/badge/Vite-7.3.1-646CFF?logo=vite&logoColor=white)](https://vitejs.dev/)

[![Tailwind CSS](https://img.shields.io/badge/Tailwind%20CSS-4.1.18-06B6D4?logo=tailwindcss&logoColor=white)](https://tailwindcss.com/)

[![pnpm](https://img.shields.io/badge/pnpm-10.28.0-F69220?logo=pnpm&logoColor=white)](https://pnpm.io/)

This is a web application to calculate work time with multilingual support (English/Japanese).

## Features

- ⏰ Time duration calculation

- ➕ Multiple time pairs with automatic total (supports overnight ranges)

- 🕒 One-click set current time for start/end

- 📋 Copy total hours or individual times (with picker)

- ⌨️ Keyboard shortcuts with help modal

- 🔁 Undo/redo + local persistence

- 🌍 Multilingual support (English/Japanese)

## Tech Stack

- **Frontend**: Preact (React-compatible) with TypeScript

- **Build Tool**: Vite

- **Styling**: Tailwind CSS

- **Routing**: Lightweight History API routing

- **Package Manager**: pnpm

## Getting Started

### Prerequisites

- pnpm

### Installation

```bash

# Clone the repository

git clone https://github.com/y-temp4/worktime-calc.git

cd worktime-calc

# Install dependencies

pnpm install

# Start development server

pnpm dev

# Build for production

pnpm build

# Preview production build

pnpm preview

```

## Development

This project uses:

- Preact (React-compatible) with TypeScript for type safety

- Vite for fast development and building

- Tailwind CSS for utility-first styling

- Lightweight History API routing for language paths

Most of the code in this application was generated by a generative AI.