Разработали портал машинок Hot Wheels на фрейморке Symfony

Авторский проект студии - портал для коллекционеров машинок Hot Wheels. Создание структурированного каталога моделей и функционала для демонстрации собственной коллекции.

Портал для коллекционеров Hot Wheels должен был решить следующие задачи:

1. сделать удобный архив/каталог всех моделей:

2. дать возможность собрать и показать свою коллекцию;

3. дать по возможности полную информацию о каждой модели.

Кроме чисто мальчишеского азарта, этой идеей мы бросали себе вызов как веб-студии, так как это наш первый проект на фрэймворке Symfony. 

Итак, основной функционал сайта заключается в возможности собрать и показать свою коллекцию машинок, а также создать вокруг портала комьюнити, где участники клуба смогут оценивать коллекции друг друга, обмениваться моделями, участвовать в рейтингах и составлять свои wish-листы.

Структура коллекций

Чтобы структурировать все модели, нам нужна была система, позволяющая четко разделить коллекции и серии машинок. Изучив опыт коллекционеров и информацию производителей, мы создали свою авторскую иерархию серий и коллекций.

Отталкивались от базовых признаков модели: блистер, колеса, детальность и один особенно характерный признак (например, id или character). В итоге получилось 5 категорий:

- Mainline (пластиковые колеса);

- ID (встроенный чип);

- Character (по мотивам мультипликационных персонажей);

- Premium (резиновые колеса);

- Exclusive (высокая детализация).

Основная идея создания портала - возможность поделиться своей коллекцией моделей Hot Wheels с другими коллекционерами. Не разложенной на ковре и сфотканной с табуретки, где ничего нельзя увидеть. А в достойном виде, где все модели можно сортировать, фильтровать и про каждую можно узнать дополнительную информацию. А самые желанные модели из чужой коллекции добавить в свой wishlist.

С помощью фильтра, поиска по коду или названию можно найти любую модель. Далее есть два варианта: добавить машинку в избранное - wish-лист или добавить в коллекцию, как уже имеющуюся.

По мере пополнения личной коллекции каждому пользователю присваиваются достижения: за собранную коллекцию и за общее количество тачек. Все пользователи участвуют в общем рейтинге ТОП-100.

Коллекция пользователя

А что внутри кода?

Со стороны технической части:

- 90% проекта работает на ajax (подгрузка контента и взаимодействие пользователя с сайтом);

для сбора и загрузки данных написана система на node.js с использованием puppeteer;

- frontend на JS фреймворке Stimulus;

- backend на PHP фрэймворке Simfony:

-- twig шаблонизатор (генерация верстки),

-- webpack (сборщик проекта).

Главная страница сайта