Skip to content

React-based web application featuring timers, random quotes, authentication, and sharing functionality.

Notifications You must be signed in to change notification settings

rinika-web/GMT-Project

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 

Repository files navigation

GMT-Project

Description

GMT Project is a React-based web application that includes login/authentication, tracking features, and optional API integration for displaying random quotes.

Table of Contents

Features

Screenshots

Installation

Usage

API Integration (Optional)

Evaluation Criteria

Contributing

Features

Screenshot:

Login Page

LoginPageScreenshot

Main Page:

mainPageScreenshot

Register Page:

registerPageScreenshot

Features

Login and Authentication:

1.Users can log in using email and password.

2.Option to log in via Google OAuth.

3.Sign-up form for creating accounts with email/password or Google.

Tracking/Post-Login Screen:

Analog Clock:

1.Clock runs anticlockwise.

2.Counts down from the current time to 120 minutes earlier.

Slider:

  1. Controls the speed of clock hands

  2. Adjusts clock speed visibly.

Share Button:

  1. Generates a unique URL.

  2. Shares the clock and slider state.

Optional API Integration:

  1. Displays random quotes fetched from an external API.

  2. Quotes change every 5 seconds.

Installation

  1. Clone the repository:

git clone https://github.com/your-username/gmt-project.git

  1. Navigate into the project directory:

cd gmt-project

  1. Install dependencies:

npm install

Usage

1. Start the development server:

npm start

2. Open the web app in your browser:

http://localhost:3000

API Integration (Optional)

  1. To enable random quotes API integration:

  2. Obtain an API key from API Provider.

Create a .env file in the project root:

REACT_APP_API_KEY=your_api_key_here

  1. Restart the development server:

npm start

Evaluation Criteria

Accuracy to Figma Design:

1.Ensure UI matches wireframes provided.

2.Maintain consistent style, colors, and overall look and feel.

Functionality:

1.Perform login, signup, clock, slider, and share button tasks seamlessly.

2.Integrate optional API for random quotes effectively.

Code Quality:

  1. Write clean, well-structured React code.

  2. Adhere to best practices and maintain readability.

User Experience:

Design intuitive UI with smooth navigation.

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

LinkedIn

https://www.linkedin.com/in/rinika-koley-802406253

email-id

[email protected]

About

React-based web application featuring timers, random quotes, authentication, and sharing functionality.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published