در این سؤال باید یک مسابقه چند سوالی طراحی کنید؛ به این صورت که کاربر با هر بار پاسخ دادن به یک سوال، به سوال بعدی می‌رود و در نهایت امتیاز نهایی که کسب کرده، به او نشان داده می‌شود.

---

پروژه اولیه

پروژه اولیه را از اینجا دانلود کنید. ساختار فایل‌های این پروژه به صورت زیر است.

quiz
├── public
│   ├── favicon.ico
│   ├── index.html
│   ├── logo192.png
│   ├── logo512.png
│   ├── manifest.json
│   └── robots.txt
├── src
│   ├── __tests__
│   │   └── AppSample.test.js
│   ├── actions
│   │   └── index.js
│   ├── constants
│   │   └── actionTypes.js
│   ├── reducers
│   │   ├── index.js
│   │   ├── level.js
│   │   ├── person.js
│   │   └── quiz.js
│   ├── App.css
│   ├── App.js
│   ├── counter.js
│   ├── index.css
│   ├── index.js
│   ├── logo.svg
│   ├── question.js
│   ├── questionDetails.js
│   ├── scoreDetails.js
│   └── serviceWorker.js
├── package-lock.json
├── package.json
└── pnpm-lock.yaml

راه‌اندازی پروژه

برای اجرای پروژه، باید NodeJS و npm را از قبل نصب کرده باشید.

• ابتدا پروژه‌ی اولیه را دانلود و از حالت فشرده خارج کنید.
• در پوشه‌ی errors-boundary ، دستور npm install را برای نصب نیازمندی‌ها اجرا کنید.
• در همین پوشه، دستور npm start را برای راه‌اندازی پروژه اجرا کنید.
• پس از انجام موفق این مراحل، با مراجعه به آدرس http://localhost:3000/ می‌توانید نتیجه را ببینید.

جزئیات

طراحی Redux به صورت زیر است:

quiz: {
	questions: [
		{
			title: string,
			options: [
			{
				key: number,
				title: string
			},
			...
			],
			answerKey: number,
			score: number
		},
		...
	]
},
level: {
	currentLevel: number,
	isFinished: boolean,
	levels: number
},
person: {
	score: number,
	rightAnswers: number,
	wrongAnswers: number,
	noAnswers: number
}

توضیحات quiz ‍‍

• ویژگی questions: آرایه‌ای از سوالات که شامل موارد زیر است:
• ویژگی options: آرایه‌ای از گزینه‌های یک سوال که دارای یک کلید و متن گزینه می‌باشد.
• ویژگی answerKey: کلید پاسخ صحیح
• ویژگی score: امتیاز سوال

توضیحات level ‍‍

• ویژگی currentLevel: مرحله جاری
• ویژگی isFinished: نشان دهنده اتمام بازی
• ویژگی levels: تعداد مراحل بازی

توضیحات person ‍‍

• ویژگی score: امتیاز بازیکن
• ویژگی rightAnswers: تعداد پاسخ صحیح
• ویژگی wrongAnswers: تعداد پاسخ اشتباه
• ویژگی noAnswers: تعداد سوالات بی‌پاسخ

• بعد از کلیک روی هر گزینه، در صورت درست بودن پاسخ امتیاز سوال به کاربر اضافه و در صورت پاسخ اشتباه ۱۰ امتیاز از او کم می‌شود.
• در صورت پاسخ به یک سوال یا اتمام ۵ ثانیه، بازی به سوال بعدی می‌رود.
• بعد از لود شدن صفحه، کاربر ۵ ثانیه برای پاسخ به هر سوال فرصت دارد. در صورت جواب ندادن به سوال، بدون گرفتن امتیاز به سوال بعد می‌رود.
• بعد از اخرین مرحله، امتیاز نهایی و تعداد پاسخ‌های درست و غلط و تعداد سوالات بدون پاسخ سوالات به کاربر نمایش داده می‌شود.

نکات

• شما تنها مجاز به اعمال تغییر در فایل‌های question.js ،level.js، ‍‍person.js و quiz.js هستید.
• تعدادی تست نمونه در پروژه اولیه وجود دارد که با استفاده از آن‌ها می‌توانید کد خود را تست کنید.
• پس از اعمال تغییرات، پروژه را ZIP کرده و ارسال کنید. دقت کنید که فقط می‌توانید فایل‌های بالا را تغییر دهید.