Необходимо разработать мини-SPA по показу текущей погоды в городах.
На экране должен быть список из 3-х городов на ваш выбор.
При клике на Город должен показываться прогноз погоды для выбранного города.
Открытое API для получения прогноза: https://openweathermap.org/current
Для элементов дизайна предпочтительно использовать фреймворк semantic-ui-react
В реализации должны быть использованы модули react-router, fetch. Архитектура Redux
Результат необходимо опубликовать на github
npm install
npm startДля запуска тестов необходимо выполнить следующую команду
npm test- Использовал доменную архитектуру - очень удобна и масштабируемая в будущем. Для каждого функционала - создается своя папка (домен) с actions, reducer и saga. Это приложение простое - поэтому домен всего один.
- Для отображения погоды написан переиспользуемый компонент City. Из-за этого рутовый компонент App получился излишне загроможден кодом.
- Компоненты City и WeatherInfo - это простые функциональные компоненты, не имеющие своего состояния. Компонент NavBar - классовый компонент, можно было так же реализовать с помощью функционального компонента. Но я показал - что можно и так и так.
- Использовал современный синтаксис декораторов.
- Параметры api вынесены в отдельный файл.
- Вызов api происходит через action в redux-saga. Если статус ответа сервера не 200, то обрабатываю ошибку и вывожу ее в консоль.
- Написал один запрос на сервер для всех городов с сохранением в store, а не на каждый город свой запрос. Мне кажется - так лучше.
- Написал функцию-хелпер для фильтрации данных о погоде. В случае большого приложения таких функций может быть больше.
- Для получения временной зоны и местного времени использовал библиотеки tz-lookup и moment-timezone соответственно.
- Подключил иконочные шрифты для отображения иконки погоды.
- Написал тесты для redux составляющей и функции хелпера.
- Для написания стилей использовал css-модули. Для каждого компонента свой файл стилей, можно легко и быстро находить нужный элемент.