https://github.com/yash1hingu/timers

This Timer App is a modern, easy-to-use timer application built with React, TailwindCSS, and Firebase. It features start, stop, and reset functionality with a clean and responsive user interface.
https://github.com/yash1hingu/timers

css firebase html javascript reactjs tailwindcss

Last synced: 3 months ago
JSON representation

This Timer App is a modern, easy-to-use timer application built with React, TailwindCSS, and Firebase. It features start, stop, and reset functionality with a clean and responsive user interface.

• Host: GitHub
• URL: https://github.com/yash1hingu/timers
• Owner: Yash1Hingu
• Created: 2024-09-16T11:35:21.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2024-09-16T12:01:29.000Z (almost 2 years ago)
• Last Synced: 2025-04-05T05:41:56.857Z (over 1 year ago)
• Topics: css, firebase, html, javascript, reactjs, tailwindcss
• Language: JavaScript
• Homepage: https://timers-chi.vercel.app
• Size: 2.88 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# ⏰ Timer App

Welcome to the **Timer App**! This is a simple, clean, and modern timer application built using cutting-edge technologies. The app allows users to start, stop, and reset a timer, with a beautiful UI.

🚀 **Live Demo**: [Timer App on Vercel](https://timers-chi.vercel.app/)

---

## 🌟 Features

- ⏳ Start, Stop, and Reset functionality

- 🎨 Beautiful UI with TailwindCSS

- 📱 Responsive design

- 🔥 Firebase integration for future enhancements

---

## 🛠️ Tech Stack

![React](https://img.shields.io/badge/React-61DAFB?logo=react&logoColor=white) 

![TailwindCSS](https://img.shields.io/badge/TailwindCSS-06B6D4?logo=tailwindcss&logoColor=white) 

![Firebase](https://img.shields.io/badge/Firebase-FFCA28?logo=firebase&logoColor=white) 

![HTML5](https://img.shields.io/badge/HTML5-E34F26?logo=html5&logoColor=white) 

![CSS3](https://img.shields.io/badge/CSS3-1572B6?logo=css3&logoColor=white) 

![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?logo=javascript&logoColor=black)

---

## 📸 Screenshots

![Timer App Screenshot](./src/assets/image.png)

---

## 🚀 Deployment

This app is deployed using **Vercel** for continuous deployment and easy access.

---

## 📂 Project Structure

```bash

├── public

│   ├── oversimplified-alarm-clock.svg

│   ├── timer.svg

│   └── TimerComponent.jsx

├── src

│   ├── assets

│   │   ├── cool-background.png

│   │   ├── oversimplified-alarm-clock.svg

│   │   ├── react.svg

│   │   └── timer.svg

│   ├── components

│   │   └── TimerComponent.jsx

│   ├── db

│   ├── App.css

│   ├── App.jsx

│   ├── index.css

│   └── main.jsx

├── .gitignore

├── eslintrc.config.js

├── index.html

├── package-lock.json

├── package.json

├── postcss.config.js

├── README.md

├── tailwind.config.js

└── vite.config.js

```

---

## 💻 Getting Started

1. Clone the repository:

   ```bash

   git clone https://github.com/your-username/timer-app.git

   cd timer-app

   ```

2. Install dependencies:

   ```bash

   npm install

   ```

3. Start the development server:

   ```bash

   npm run dev

   ```

4. Open your browser and go to `http://localhost:3000`.

---