A dynamic image gallery utilizing the Flickr API. The project emphasizes responsive design principles to ensure optimal viewing across various devices and screen sizes. The project aims to deliver a visually appealing and user-friendly image gallery experience while prioritizing performance optimization, code reliability, and responsiveness across devices.
- Utilized Flickr API for fetching image data
- Implemented responsive design for optimal viewing across devices
- Enabled infinite scroll for dynamic image loading
- Utilized TypeScript for code maintainability and efficiency
- Implemented lazy-loading for optimized page loading
- Incorporated responsive image solution for bandwidth optimization
I wanted to explain why I chose bugs as the subject matter for our macro gallery app:
Detail: Bugs offer intricate details perfect for macro photography, showcasing nature's beauty up close.
Diversity: Bugs come in a vast array of species, each with its own unique characteristics, allowing us to highlight biodiversity.
Task-specific: Different bugs perform specific roles in ecosystems, from pollination to pest control, showcasing the variety of tasks bugs undertake.
- React
- TypeScript
- Babel
- Jest
- React Testing Library
In the project directory, you can run:
or
After sucesfully runing the project you can see app in the browser.
Runs the app in the development mode. Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits. You will also see any lint errors in the console.
or
Launches the test runner in the interactive watch mode.
- Flickr API Documentation: https://www.flickr.com/services/api/
- Flickr API Garden: https://www.flickr.com/services/api/explore/flickr.galleries.getPhotos
- Tom Johnson Tutorial: https://idratherbewriting.com/learnapidoc/docapis_flickr_example.html