Developed with the software and tools below.

• 📍 Overview
• 📦 Features
• 📂 Repository Structure
• 🧩 Modules
• 🚀 Getting Started
  • ⚙️ Installation
  • 🤖 Running S2ImpactTriviaReactTSRefactor
• 🤝 Contributing
• 📄 License

► this project is related to the start2Impact blockchain master specifically for the React-Typescript course. I will therefore use typescript and react mainly to create an app based on multiple-answer quizzes, the request is: You will create a web app in React to carry out a quiz dedicated to the topic of food and its impact on the environment and on people.

► the app will open with the request to enter a username if not already present on local host. At that point we will start with the first set of multiple answer questions, there are 10 questions . A final screen will give the score obtained, to which a "skill" level will be associated (for example, from 1 to 3 correct answers -> basic, from 4 to 7 correct answers -> intermediate, from 8 to 9 correct answers -> expert /a, 10 correct answers -> teacher) you can share the result on a social network, currently Twitter - X . For each correct or incorrect answer there will be a graphic pop up to provide feedback. the questions will have to be inserted in the quiz.ts file in the src/level1 path and will have to be encrypted before putting the app online. to encrypt them, launch as per the instructions: npm run encrypt-answers, at which point you will find a new file "solutionEncrypted.json" in the same folder which will be decrypted by a custom hook.ovviamente il fie "originalAnswers" si potrebbe cancellare ma per motivi solo di chiarezza e in questa demo lo lascio nel repo. to encrypt and decrypt I use CriptoJS and a key that is in .env. for clarity I left a ".envfake" file to give an example of how to insert the key :all this to avoid giving users the chance to discover the correct answers without creating a backend. non ho usato useReducer perché' il rpop drill non e' mai più di un livello , per organizzare e pulire il codice ho usato un paio di custom hook.

-

└── S2ImpactTriviaReactTSRefactor/
    ├── README.md
    ├── encryptAnswers.js
    ├── favicon.ico
    ├── index.html
    ├── package-lock.json
    ├── package.json
    ├── postcss.config.js
    ├── public
    │   ├── favicon.ico
    │   └── font
    │       ├── ScriptSheep.ttf
    │       ├── ScriptofSheep.eot
    │       ├── ScriptofSheep.ttf
    │       ├── ScriptofSheep.woff
    │       └── ScriptofSheep.woff2
    ├── src
    │   ├── App.tsx
    │   ├── EndGame.tsx
    │   ├── Footer.tsx
    │   ├── Header.tsx
    │   ├── Layout.tsx
    │   ├── Logo.tsx
    │   ├── Modal.tsx
    │   ├── Quiz.tsx
    │   ├── QuizQuestion.tsx
    │   ├── ScorePopup.tsx
    │   ├── Success.tsx
    │   ├── UserInput.tsx
    │   ├── index.css
    │   ├── lib
    │   │   ├── hooks
    │   │   │   ├── useDecryptedAnswers.ts
    │   │   │   ├── useGame.ts
    │   │   │   └── useQuiz.ts
    │   │   └── types
    │   │       └── types.tsx
    │   ├── main.tsx
    │   ├── quiz
    │   │   └── level1
    │   │       ├── originalAnsewer.json
    │   │       ├── quiz.ts
    │   │       └── solutionEncrypted.json
    │   └── vite-env.d.ts
    ├── tailwind.config.js
    ├── tsconfig.json
    ├── tsconfig.node.json
    └── vite.config.ts

Requirements

Ensure you have the following dependencies installed on your system:

• TypeScript: version x.y.z

1. Clone the S2ImpactTriviaReactTSRefactor repository:

git clone https://github.com/boobaGreen/S2ImpactTriviaReactTSRefactor

2. Change to the project directory:

cd S2ImpactTriviaReactTSRefactor

3. Install the dependencies:

npm install

Use the following command to run S2ImpactTriviaReactTSRefactor:

npm run build && node dist/main.js

or in develpoment mode :

npm run dev

Use the following command to decrypt your answer :

npm run encrypt-answers

The file with noy decrypted answer must be on src/quiz/level1 directory and the name must be originalAnswers.json

---

## 🤝 Contributing

Contributions are welcome! Here are several ways you can contribute:

- **[Submit Pull Requests](https://github.com/boobaGreen/S2ImpactTriviaReactTSRefactor/blob/main/CONTRIBUTING.md)**: Review open PRs, and submit your own PRs.
- **[Join the Discussions](https://github.com/boobaGreen/S2ImpactTriviaReactTSRefactor/discussions)**: Share your insights, provide feedback, or ask questions.
- **[Report Issues](https://github.com/boobaGreen/S2ImpactTriviaReactTSRefactor/issues)**: Submit bugs found or log feature requests for S2impacttriviareacttsrefactor.

<details closed>
    <summary>Contributing Guidelines</summary>

1. **Fork the Repository**: Start by forking the project repository to your GitHub account.
2. **Clone Locally**: Clone the forked repository to your local machine using a Git client.
   ```sh
   git clone https://github.com/boobaGreen/S2ImpactTriviaReactTSRefactor

3. Create a New Branch: Always work on a new branch, giving it a descriptive name.

   git checkout -b new-feature-x

4. Make Your Changes: Develop and test your changes locally.
5. Commit Your Changes: Commit with a clear message describing your updates.

   git commit -m 'Implemented new feature x.'

6. Push to GitHub: Push the changes to your forked repository.

   git push origin new-feature-x

7. Submit a Pull Request: Create a PR against the original project repository. Clearly describe the changes and their motivations.

Once your PR is reviewed and approved, it will be merged into the main branch.

This project is protected under the MIT License.