https://github.com/chen-abudi/countdown-timer-game
This is a mini-game of timer challenges showcasing the estimation countdown of the time that is almost up.
https://github.com/chen-abudi/countdown-timer-game
Last synced: 8 months ago
JSON representation
This is a mini-game of timer challenges showcasing the estimation countdown of the time that is almost up.
- Host: GitHub
- URL: https://github.com/chen-abudi/countdown-timer-game
- Owner: Chen-Abudi
- Created: 2024-02-05T21:40:31.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-02-12T16:43:18.000Z (over 1 year ago)
- Last Synced: 2024-12-30T20:27:44.806Z (9 months ago)
- Language: JavaScript
- Size: 57.6 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# countdown-timer-game
Developed by **`Grace Chen Abudi`** 👩🏽💻
## 📣 Overview:
- Intro
- Tech Stack & Techniques
- How to Get Started
- Additional Link
## 🔎 Intro:
This is a mini-game of timer challenges showcasing the estimation countdown of the time that is almost up.
## 🧰 🛠️ Tech Stack & Techniques:
- React
- JavaScript
- CSS3
- Vite
- Use Ref + Forward Ref
- **React Hooks**: **`useImperativeHandle`** customizes the values exposed by a child component's imperative API, optimizing and controlling its external interface.
---
## State **`VS`** Refs:
| **`State`** | **`Refs`** |
| :--------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------ |
| **`-`** Causes component re-evaluation (re-execution) when changes. | **`-`** Do not cause component re-evaluation when changed. |
| **`-`** Should be used for values that are directly reflected in the UI. | **`-`** Can be used to gain direct access to DOM element access (→ great for reading values or accessing certain browser APIs). |
| **`-`** Should not be used for "behind the scenes" values that have no direct UI impact. | |
# ✨ How to Get Started:
## Clone Project:
```bash
git clone https://github.com/Chen-Abudi/countdown-timer-game.git
```
## Enter the project directory:
```bash
cd countdown-timer-game
```
## Install the Dependencies:
```bash
npm install
```
or in short
```bash
npm i
```
## Launch:
```bash
npm run dev
```
---
## 🔗 Additional Link:
If you want to strengthen your knowledge and skills of **React, Redux, and more...** along **Best Practices**, Feel free to check this course on Udemy by **`Maximilian Schwarzmüller`**:
## Visit the Course [👉🏽 **HERE !**](https://www.udemy.com/course/react-the-complete-guide-incl-redux/)
**_`Shoutout to Maximilian Schwarzmüller for this project design, the lectures, the exercises, and the React course in Udemy. Mahalo, Thank you!`_** 🌺