Разработка SPA-фронтенда для визуализации данных об аэропортах на React, TypeScript — Владилен Минин

«Разработка SPA-фронтенда для визуализации данных об аэропортах на React, TypeScript» — Владилен Минин (Result School, основатель) Воркшоп с конференции Ural Digital Weekend 2022 (8 июля 2022) В рамках воркшопа Владилен спроектировал и разработал интерфейс для визуализации данных об аэропортах. Для реализации он использовал React JS, TypeScript и Rest API из первого воркшопа на тему «Разработка бэкенда (Rest API) для сервиса работы с открытыми данными об аэропортах. Стек: Python (Django), PostgreSQL». Ссылка на воркшоп: В процессе реализации Владилен затронул следующие стадии разработки: Сборка интерфейса на основе готового шаблона Верстка темплейтов c Tailwind CSS Создание основных компонентов, настройка роутинга Разработка API-слоя, разработка сторы Интеграция сторы с интерфейсом Частичное покрытие функционала тестами В результате у нас получился интерфейс веб-приложения, который использует Rest API из первого воркшопа. Public API: Ссылка на репозиторий: Сайт конференции — Сайт Spectr — Организатор конференции — Spectr () Организационный партнер — Тэглайн () Официальный сайт конференции — Официальный канал конференции — Нанять команду Spectr — #udweek #udw #ural_digital_weekend #digital #tagline #тэглайн #spectr #digitalspectr #мероприятие 00:00 Вступление от Владилена 1:00 Обзор проекта 3:30 Создание и настройка проекта 7:30 Маршрутизация 11:50 Создание навигации 14:50 Верстка главной страницы 19:10 Создание Store 30:05 Загрузка данных с сервера 44:30 Отображение данных в AirportCard 47:35 Обработка состояния загрузки и ошибки 48:45 Стилизация AirportCard 52:20 Обработка клика по AirportCard 54:50 Пагинация 1:10:35 Создание поисковика 1:31:25 Создание фильтров 2:01:10 Создание страницы AirportDetail 2:07:30 Создание авторизации 2:33:50 Вопросы из зала