Code Monkey home page Code Monkey logo

goit-js-hw-12-countries's Introduction

Критерии приема

  • Создан репозиторий goit-js-hw-12-countries.
  • При сдаче домашней работы есть две ссылки: на исходные файлы и рабочую страницу на GitHub pages.
  • При посещении рабочей страницы (GitHub pages) задания, в консоли нету ошибок и предупреждений.
  • Имена переменных и функций понятные, описательные.
  • Проект собран с помощью Webpack.
  • Код отформатирован с помощью Prettier.
  • Добавь минимальную стилизацию.
  • Есть файл fetchCountries.js с дефолтным экспортом функции fetchCountries(searchQuery), возвращающей промис с массивом стран, результат запроса к API.

Поиск стран

Создай небольшое приложение поиска данных о стране по ее частичному или полному имени. Используй Rest Countries API, а именно ендпоинт /name, возвращающий массив объектов стран попавших под критерий поиска.

Достаточно чтобы приложение работало для большинства стран. Некоторые страны, такие как Sudan, могут создавать проблемы, поскольку название страны является частью названия другой страны, South Sudan. Не нужно беспокоиться об этих исключениях.

Интерфейс очень простой. Название страны для поиска пользователь вводит в текстовое поле.

⚠️ ВНИМАНИЕ! HTTP-запросы на бекенд происходят не по сабмиту формы, формы нет, а при наборе имени страны в инпуте, то есть по событию input. Но делать HTTP-запрос при каждом нажатии клавиши нельзя, так как одновременно получится много HTTP-запросов которые будут выполняться в непредсказуемом порядке (race conditions). Поэтому на обработчик события необходимо применить подход debounce и делать HTTP-запрос спустя 500мс после того, как пользователь перестал вводить текст. Используй npm-пакет lodash.debounce.

Если бекенд вернул больше чем 10 стран подошедших под критерий введенный пользователем, в интерфейсе отображается нотификация о том, что необходимо сделать запрос более специфичным. Для оповещений используй плагин pnotify.

оповещение

Если бекенд вернул от 2-х до 10-х стран, под инпутом отображается список имен найденных стран.

список стран

Если бекенд вернул массив с одной страной, в интерфейсе рендерится разметка с данными о стране: название, столица, население, языки и флаг.

информация о стране

goit-js-hw-12-countries

goit-js-hw-12-countries's People

Contributors

den-85-ukr avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.