You are tasked with building a web application for a photo gallery with integrated Firebase functionality. The application should provide a seamless experience for users to view and interact with a collection of images.
-
Display Images: Create a grid layout displaying thumbnail images sourced from Firebase Storage. Design and implement an eye-catching user interface (UI) for the gallery. Participants are free to choose any framework they prefer for building the UI (React is preferred).
-
Modal Popup: Implement a feature where clicking on a thumbnail opens a modal displaying the full-sized image.
-
Navigation: Enable users to navigate between images within the modal view easily.
-
Firebase Integration: Utilize Firebase to manage and retrieve images. Employ Firebase Realtime Database to store metadata associated with each image (e.g., title, description).
Once participants complete the task, host the app on services like (Netlify or Vercel) and raise a pull request on this repository with your name, branch, and the link of your hosted site in the submissions (as in an example).
- Search/Filter Functionality
- Transitions/Animations
The deadline for completing this task is the end of the day (EOD) on Sept 21st.
- Code quality, organization, and readability.
- Effective utilization of React components, state management, and props.
- Successful integration of Firebase.
- User interface design and overall user experience.
- Implementation of bonus features (if attempted).
-
Participants are free to use any framework of their choice for building the form and UI. They can select from popular options such as React, Angular, Vue.js, or any other framework they are comfortable with.
-
We encourage you to write clean and well-documented code. This will make reviewing your submissions easier and allow for better evaluation of your skills.