https://github.com/benasdeveloper/front-ignite-timer

A productivity-focused countdown timer built with React, Vite, and TypeScript to help users stay on track with their tasks. 🚀⏳
https://github.com/benasdeveloper/front-ignite-timer

immer react-hook-form reactjs reducer styled-components typescript vite

Last synced: 11 days ago
JSON representation

A productivity-focused countdown timer built with React, Vite, and TypeScript to help users stay on track with their tasks. 🚀⏳

• Host: GitHub
• URL: https://github.com/benasdeveloper/front-ignite-timer
• Owner: benasdeveloper
• Created: 2025-02-02T15:31:19.000Z (13 days ago)
• Default Branch: main
• Last Pushed: 2025-02-03T21:02:18.000Z (11 days ago)
• Last Synced: 2025-02-03T22:19:14.836Z (11 days ago)
• Topics: immer, react-hook-form, reactjs, reducer, styled-components, typescript, vite
• Language: TypeScript
• Homepage: https://ignite-timer-azure-three.vercel.app
• Size: 78.1 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Ignite Timer ⏳

A productivity-focused timer application built with **React**, **Vite**, and **TypeScript**, designed to help users stay on track with their tasks.

![Screenshot do Ignite Timer](public/assets/cover.jpg)

## 🚀 Features

- 🔥 **Fast and modern UI** powered by Vite and React

- 🎯 **Task-based countdown timer**

- 🎨 **Styled with Styled-Components**

- ⏳ **State management with Immer**

- 📆 **Date management with date-fns**

- 🔍 **Form handling with React Hook Form and Zod validation**

- 🌍 **Navigation with React Router DOM**

## 📦 Tech Stack

- **React 18**

- **TypeScript**

- **Vite**

- **Styled-Components**

- **Immer**

- **React Hook Form + Zod**

- **React Router DOM**

- **Phosphor React Icons**

- **ESLint for code linting**

## 📜 Installation & Setup

1. Clone the repository:

   ```sh

   git clone https://github.com/YOUR_USERNAME/ignite-timer.git

   cd ignite-timer

   ```

2. Install dependencies

   ```sh

   npm install

   ```

3.	Start the development server:

    ```sh

    npm run dev

    ```

4.	Start the development server:

    ```sh

    npm run build

    ```

5.	Preview the production build:

    ```sh

    npm run preview

    ```

## ✅ Linting

Ensure code consistency by running:

```sh

npm run lint

```

## 🤝 Contributing

Contributions are welcome! Feel free to open an issue or submit a pull request.

## 📄 License

This project is licensed under the MIT License.

Made with ❤️ by Bene-Hur Pessoa