Triviamania

Demo | Solution

Table of Contents

• Overview
  • Built With
• Features
• How to use
• Contact
• Acknowledgements

Overview

In this screenshot you can see the home page

Here you can see the login, signup and reset password on home page where you can enter in the app.

Here you can set the options like categories, difficulty and limit of questions what you want, also you can see the fields are validated.

Once you set your configurations about the game, you can play. And if your select a difficulty like hard, you can see a countdown on the top. After send the answers, you can see a review.

Here you can see your historial game.

Here you can change your password or delete your account.

Built With

• React
• React router dom
• NES.css
• React Hook Form
• Vite
• TypeScript
• Axios
• Yup

Features

• You can play answering the questions.
• You can change your password.
• You can recover your password sending an email.
• You can delete your account.
• You can login with google.
• You can see your historial about the game.

How To Use

To clone and run this application, you'll need Git and Node.js (which comes with npm) installed on your computer. From your command line:

# Clone this repository
$ git clone git@github.com:gamcode98/triviamania.git
# Install dependencies
$ npm install
# Run the app
$ npm run dev

You will need to clone too the backend repository

Also need the trivia api

Note: Replace your VITE_BACKEND_URL="your_backend_url" in your .env file, the trivia api is included in the file .env.example

Acknowledgements

• trivia api, to let me use their api.

Contact

• Website portfolio-gamcode.netlify.app/
• GitHub @gamcode98