https://github.com/shogun486/ui-focused-art-institute-of-chicago-gallery
Dynamic search tool displaying the Institute's artworks
https://github.com/shogun486/ui-focused-art-institute-of-chicago-gallery
reactjs tailwindcss
Last synced: 3 months ago
JSON representation
Dynamic search tool displaying the Institute's artworks
- Host: GitHub
- URL: https://github.com/shogun486/ui-focused-art-institute-of-chicago-gallery
- Owner: Shogun486
- Created: 2024-05-05T00:38:05.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-05-07T18:00:14.000Z (about 1 year ago)
- Last Synced: 2025-03-11T06:59:34.427Z (3 months ago)
- Topics: reactjs, tailwindcss
- Language: JavaScript
- Homepage:
- Size: 117 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Website leveraging the _Art Institute of Chicago_'s API
==========
This website is designed to replicate a visitor's experience at the Art Institute of Chicago (AIC).
When walking inside of the AIC, different artworks of different sizes can be found, therefore you'll
find that all images on this website are of different sizes, too (arranged like a gallery). You can find images based on what
you're looking for . . . do you want to see Picasso's works? Well, simply search 'Picasso' in the
search bar, and you'll find all artifacts where the API's metadata has any mention of him. The frontend
design of this website is simplistic so you can admire all of the museum's public data from the comfort
of your own home.
## Demo
Click [here] to see a demo of this app.
## API Details
The [AIC's REST API] holds the museum's public data. The image files you see are not from this API, but
instead must be acquired through a different URL following [IIIF Image API] standards. Within [ArtCard.jsx],
you'll find that image requests are specifcially made with the URL suffix `/full/843,/0/default.jpg` (IIIF supports
multiple image display options). This particular display option is what's used by AIC's website, therefore
images will load much faster on your end if you stick with this option.
## Tools
This website is supported by React and Tailwind CSS. For installation instructions, please refer to
the [React] and [Tailwind] docs.
[React]: https://react.dev/learn/installation
[Tailwind]: https://tailwindcss.com/docs/installation
[here]: https://drive.google.com/file/d/1A5xGm_-8rjULD2RZ3O8BUB6D6p1UUQA_/view
[AIC's REST API]: https://api.artic.edu/docs/#introduction
[IIIF Image API]: https://iiif.io/api/image/2.0/
[ArtCard.jsx]: https://github.com/Shogun486/Art-Institute-of-Chicago-Public-API/blob/main/src/ArtCard.jsx