**مهارت‌های لازم:** - آشنایی با `map`، `filter` و `reduce` -------------------------------------------------- ظاهر کلی برنامه بدین صورت است:  # پروژه اولیه پروژه اولیه را از [اینجا](https://quera.ir/qbox/download/jt6U7GlfAK/read-json.zip) دانلود کنید. ساختار فایل‌های این پروژه به صورت زیر است. ``` read-json ├── public │ ├── favicon.ico │ └── index.html ├── src │ ├── __tests__ │ │ └── sample.test.js │ ├── AverageAge.js │ ├── UserItem.js │ ├── UserList.js │ ├── index.css │ ├── index.js │ └── users.json ├── package.json └── yarn.lock ``` <details class="brown"> <summary> راه‌اندازی پروژه </summary> **برای اجرای پروژه، باید `NodeJS` و `npm` را از قبل نصب کرده باشید.** - ابتدا پروژه‌ی اولیه را دانلود و از حالت فشرده خارج کنید. - در پوشه‌ی `read-json` ، دستور `npm install` را برای نصب نیازمندی‌ها اجرا کنید. - در همین پوشه، دستور `npm start` را برای راه‌اندازی پروژه اجرا کنید. - پس از انجام موفق این مراحل، با مراجعه به آدرس `http://localhost:3000/` می‌توانید نتیجه را ببینید. </details> # جزئیات داده‌های کاربر در فایل `users.json` به این صورت هستند: ```js [ { "name": string, "age": number, "role": string } ] ``` - `name`: اسم کاربر - `age`: سن کاربر - `role`: نقش کاربر که می‌تواند `user` یا `admin` باشد. در این سوال شما باید ابتدا لیست کاربران را از فایل `users.json` بخوانید و سپس کاربرانی که دارای نقش `user` هستند را با استفاده از کامپوننت `UserItem` نمایش دهید و میانگین سنی کاربرانی که دارای نقش `admin` هستند را بدست آورید و با استفاده از کامپوننت `AverageAge` نشان دهید. # نکات - شما تنها مجاز به اعمال تغییرات در فایل `UserList.js` هستید. - تعدادی تست نمونه در پروژه اولیه وجود دارد که با استفاده از آن‌ها می‌توانید کد خود را تست کنید. - پس از اعمال تغییرات، پروژه را _ZIP_ کرده و ارسال کنید. دقت کنید که پوشه‌ی `node_modules` در فایل ارسالی نباشد.

حل سؤال در بانک سؤالات