https://al3xsus.github.io/React-SPA-IP-checker/
Простое SPA для получения информации по IP адресу. Использован стек технологий React (create-react-app), Semantic UI React, SPA, localStorage. Для получения информации об IP было использовано API https://2ip.ua/ru/api/our-api. Внимание, количество ежедневных запросов ограниченно.
SPA состоит из трёх секций - формы ввода IP адреса, секции текущего результата запроса и секции истории запросов.
В форме пользователь вводит IP адрес в строку ввода и нажимает кнопку Get Info
. Если строка ввода пуста или адрес не
соответствует IP адресу (т.е. будет чем-то иным, нежели запись в виде четырёх десятичных чисел значением от 0 до 255,
разделённых точками) то строка ввода будет подсвечена красным цветом, а кнопка Get Info
будет неактивна.
В случае успеха результат запроса будет добавлен в историю и показан на секциях текущего результата и истории
соответственно. В случае ввода нового адреса текущий результат будет обнулён.
Секция текущего результата представляет собой информационную панель разделенную на три поля - IP адрес, его географическая информация и информация о провайдере.
Секция истории запросов представляет собой множество информационных панелей по каждому предыдущему запросу.
При старте приложения, если существует не пустое localStorage хранилище, данные будут получены из него. При закрытии приложения (перезагрузка страницы или перезаход на неё) данные будут записаны в localStorage.
Передвигаться по SPA можно с помощью небольшой навигационной панели слева.
Запускать из папки с проектом:
Для установки модулей
Запускает приложение в режиме разработки по адресу http://localhost:3000.
Для сборки в папку build
.
Для установки локального сервера.
Для запуска собранного на локальном сервере.
Форма ввода IP
Текущий результат
История запросов