To check exhibition information from various countries, one usually has to visit each country's page individually, which can be inconvenient for those who want to explore information from multiple countries. To address this, we gathered exhibition information from each country, added visual elements through animations, and implemented filtering features to allow users to selectively view the information they are interested in.

We collected exhibition data within the allowed scope of the Robot Exclusion Protocol using Python Selenium. This data is designed in card format and loaded onto the page. The project focuses on user interaction, animation implementation, and publishing. When a user requests a page, the controller loads shuffled MongoDB data and transmits it as an object. Pug renders the received data on the page.

Scroll animation, card sorting animation, exhibition name/museum/country search filtering, museum/art gallery filtering, card click animation, responsive web screen

There was a need to implement a solution for the issue of the card slowly expanding and centering from its position when clicked and adjusting to the original position when closed. This was addressed by calculating the user's browser viewport size, subtracting the coordinates (X, Y) of the clicked card, and adjusting accordingly.

JavaScript, JQuery, Pug, SCSS

Express, MongoDB, Python

Flyio