**مهارتهای لازم:**
- آشنایی با `React` و استفاده از استیت
--------------------------------------------------
ظاهر کلی برنامه بدین صورت است:
![ظاهر برنامه](https://quera.ir/qbox/view/gSWsFPsjPi/converter_ss.gif)
# پروژه اولیه
پروژه اولیه را از
[این لینک](/problemset/assignments/4367/download_problem_initial_project/109568/)
دانلود کنید.
<details class="green">
<summary>
ساختار پروژه
</summary>
```
unit-converter
├── public
│ ├── favicon.ico
│ └── index.html
├── src
│ ├── __tests__
│ │ └── sample.test.js
│ ├── assets
│ │ ├── css
│ │ │ └── index.css
│ │ └── images
│ │ └── cover.png
│ ├── components
│ │ ├── App.js
│ │ ├── Input.js
│ │ └── Select.js
│ ├── index.js
│ └── units.js
├── package-lock.json
└── package.json
```
</details>
<details class="brown">
<summary>
راهاندازی پروژه
</summary>
**برای اجرای پروژه، باید `NodeJS` و `npm` را از قبل نصب کرده باشید.**
- ابتدا پروژهی اولیه را دانلود و از حالت فشرده خارج کنید.
- در پوشهی `unit-converter` ، دستور `npm install` را برای نصب نیازمندیها اجرا کنید.
- در همین پوشه، دستور `npm start` را برای راهاندازی پروژه اجرا کنید.
- پس از انجام موفق این مراحل، با مراجعه به آدرس `http://localhost:3000/`
میتوانید نتیجه را ببینید.
</details>
# جزئیات
در این سوال میخواهیم یک برنامه تبدیل واحد بسازیم.
ابتدا شما باید `input` و `select`هایی که این برنامه نیاز دارد را با استفاده از کامپوننتهای `Input` و `Select` در جای مناسب که کامنت شده است، با `label` (به عنوان *property*) مناسب استفاده کنید. به *items* کامپوننت `Select` باید لیست واحدها را بدهید. مقدار `factor` برای واحدی که تبدیل از آن انجام میشود (*From*) و واحدی که تبدیل به آن انجام میشود (*To*) را میتوانید با استفاده از `onChange` که یک *property* در کامپوننت `Select` است بدست آورید و برای محاسبه نتیجه از آنها استفاده کنید. مقدار را هم میتوانید با استفاده از `onChange` روی کامپوننت `Input` بدست آورید. هرگاه دکمه `Convert` کلیک شد، باید تبدیل خواسته انجام و نتیجه نمایش داده شود.
**توجه:** برای محاسبه `result` باید مقدار را در `factor` واحدی که تبدیل از آن انجام میشود ضرب کنید و بر `factor` واحدی که به تبدیل به آن انجام میشود، تقسیم کنید.
**توجه:** به اعشاری بودن اعداد دقت کنید.
**توجه:** فرض کنیم کاربر مقداری به غیر از عدد وارد نمیکند.
# نکات
- شما تنها مجاز به اعمال تغییرات در فایل `src/components/App.js` هستید.
- برای ارسال پاسخ میتوانید فقط فایل `App.js` را بدون _zip_ کردن ارسال کنید یا کل پروژه را _zip_ کرده و ارسال کنید. دقت کنید که پوشهی
_node_modules_ در فایل ارسالی نباشد.