Это проект, позволяющий людям достичь спортивных целей через подбор подходящего плана тренировок и диеты, начиная
от офисных работяг, заканчивая профессиональными спортсменами.
Посмотреть демо »
Телеграм автора
·
API проекта
·
История коммитов
Концепция проекта заключается в подборе идеальной программы тренировок и диеты для пользователя. Это происходит, благодаря постоянному взаимодействию пользователей между собой.
Выбрав план, они дают "фидбек" по нему, другие пользователи могут посмотреть статистику плана и узнать насколько эффективно будет следовать ему. Планы можно создавать самому или воспользоваться чужим.
Данным сервисом предполагается использование не только простых обывателей, но и профессиональными спортсменами, которые могут "вести" своих клиентов за деньги или бесплатно помогать другим пользователям. Для реализации всего выше перечисленного сервис предоставляет множество возможностей: чат, профиль со "стенкой", комментарии, различные статистики. Концепция сервиса также подразумевает соревновательный интерес. Можно следить как за своими успехами, так и за успехами других пользователей.
Здесь перечисленны технологии, которые использованы для создания клиентского приложения:
- HTML - based
- CSS - И это тоже база, разве есть нормальные альтернативы?)
- Material-UI - UI-библиотека, которая очень помогла с версткой в проекте. Вместо придумывания ненужных "велосипедов", ускорила верстку проекта.
- JavaScript - Поскольку я хорошо знаю JS, стал писать на нём
- React.js - Проще работать с интерфейсом и его состоянием.
- Redux - В большом приложении без стейт менеджера никуда не деться, иначе будет большое спагетти, чтобы достать состояние в любой точке приложения.
- redux-thunk - Если пользователь будет много тык-тык на странице, то будет много вызовов в СТМ, а т.к. редакс работает синхронно, то нужна прослойка, которая будет выполнять операции асинхронно.
- Axios - HTTP-запросы.
- moment.js - Работа с датами.
- node-sass - Поэкспериментировал с SCSS.
- react-chartjs-2 - Графики.
- draft.js - Текстовый редактор. Позволяет пользователям отправлять форматированный текст.
- react-router - Навигация в приложении.
- react-router-config - Эксперименты с роутингом, понравилась концепция роутинга по заданному конфигу.
- react-toastify - Всплывающие уведомления, хоть и в Material-UI есть аналоги, но мне понравился больше этот вариант
- uuid - Генератор уникальных идентификаторов.
- react-perfect-scrollbar - Кастомный скролл, просто красивая декорация.
В принципе в package.json есть много других библиотек, но это либо эксперименты не вошедшие в релиз, либо заготовки на будущее.
Чтобы запустить копию проекта локально на компьютере, следуйте инструкциям ниже.
Установите менеджер пакетов npm
npm install npm@latest -g- Склонируй репозиторий
git clone https://github.com/pavelqq/fat.git
- Установи npm-пакеты
npm install
- В корне проекта запусти с помощью команды
Проект запустится на порту 3000.
npm run dev
Email - pavel.schardakov@gmail.com Telegram - @begerzerverentempmiss
Хочу поблагодарить Сашку за то, что предоставил ноутбук для работы над этим проектом,
без него всего этого бы не было. Появился только один нюанс, я забыл про SHH ключ, и все
коммиты постились с его аккаунта, но думаю это не страшно.
