Digital Clock Application

A real-time digital clock built with React, Tailwind CSS, and Node.js that displays the current time and updates every second.

Features

• Real-time updating clock showing hours, minutes, and seconds
• Responsive design with Tailwind CSS
• Clean, modern UI with green digits on dark background
• Displays current date along with the time
• Auto-refreshes every second

Tech Stack

• React (via CDN)
• Tailwind CSS (via CDN)
• Node.js with Express.js
• JavaScript (ES6+)

Project Structure

clock/
├── server.js           # Express server entry point
├── package.json        # Project metadata and dependencies
├── public/
│   ├── index.html      # Main HTML file
│   └── js/
│       └── index.js    # React component
└── src/                # Source files (empty, reserved for future use)

Installation & Setup

1. Make sure you have Node.js installed on your system
2. Clone or download this repository
3. Navigate to the project directory
4. Install dependencies: npm install
5. Start the server: npm start
6. Open your browser and go to http://localhost:3000

Scripts

• npm start - Start the production server
• npm dev - Start the development server with nodemon (requires npm install -g nodemon)

How It Works

The application uses React hooks (useState and useEffect) to manage the current time state and update it every second using the setInterval function. The UI is styled with Tailwind CSS classes for a clean, responsive design.

Customization

You can customize the appearance by modifying the Tailwind CSS classes in the React component or by adding custom styles to the HTML file.