Создать приложение на React, сподключением криптокашелька и выводом информации с бэкэнда.
Дизайн:
- Сверстать 2 страницы в соответствии с дизайном страницы:
- Главная страница
- Страница участника
-
Подключить функционал к страницам: При открытии страницы, уведомить пользователя о том, что потребуется расширение Metamask для браузера. Выполнить подключение криптокошелька Metamask при нажатии на кнопку CONNECT METAMASK в шапке. После подключения необходимо отображать адрес подключенного кошелька вместо кнопки.
При заполнении формы, BETA TEST REGISTRATION загрузить данные для таблицы PARTICIPATION LISTING и отобразить ее, введенные данные добавить в начало таблицы. Новая запись должна содержать введенные name, email и адрес подключенного криптокошелька. Сделать удаление созданной записи из таблицы (другие не должны удаляться).
При клике на запись таблицы должна открываться страница участника. Запись, добавленная пользователем должна быть некликабельной. Отображать на странице участника данные, полученные с бэкенда.
- Использование TypeScript.
- Должен подключаться кошелек Metamask. Для подключения рекомендуется использовать библиотеку wagmi.
- Использовать роутер для перехода между страницами.
- Будет преимуществом:
- Сделать бесконечный список для таблицы (новые данные должны подгружаться с бэкенда).
- Спроектировать приложение согласно FSD.
- Использовать библиотеку для управления запросами (TanStack Query, RTK Query, SWR или подобную).
- Развернуть приложение на одной из бесплатных платформ (Netlify, Github Pages или подобные).
- Использование Tailwind для стилизации.
Стянуть проект:
$ git clone https://github.com/Vostafi69/unistory.git
Перейти в директорию проекта:
$ cd unistory
Установить зависимости:
$ npm i
Запустить проект:
$ npm run dev
Главная страница
Главная страница