Демо: https://hacker-news-la.netlify.app/
-
Показывает последние 100 новостей в виде списка, отсортированного по дате, самые свежие сверху. Отрисовываются первые 10 новостей, остальные рисуются по мере прокрутки. Подгрузка реализована при помощи Intersection Observer API.
-
Каждая новость содержит:
- название
- рейтинг
- ник автора
- дату публикации
- По клику на новость происходит переход на страницу новости
- Содержит:
- ссылку на новость
- заголовок новости
- дату
- автора
- счётчик количества комментариев
- список комментариев в виде дерева
- Все комментарии загружаются после входа на страницу и отображаются в виде дерева
- На странице есть кнопка для возврата к списку новостей
- Приложение разработано с использованием React v17 и TypeScript v4.5
- Роутинг реализован с помощью React Router v5
- Использован официальный API Hacker News: https://github.com/HackerNews/API
- В проекте используется линтер от Airbnb для React
Установить Node.js v16.
Установить зависимости командой:
npm i
Запустить проект в режиме разработки:
npm start
Сбилдить проект командой:
npm run build