A Google Photos Clone built with ReactJs🚀 and Firebase🔥
Click Here to View the Website
- Google Login
- Upload multiple Photos at once
- Create new Album
- Delete Photos and Albums
- Download Photos
- React (FrontEnd)
- Material-UI
- react-router-dom
- Redux
- Firebase - Baas (Backend as a Service)
- Firestore
- Authentication (Google Authentication)
- Cloud Storage
- Clone the repo, and cd into it
- Install all the dependcies from package.json
- Create a firebase project and enable Google login
- Create a file src/firebase.js and place firebase project Keys inside as shown in src/firebase.example.js
- Run app by typing
npm start
in command line - Make sure to read the Note section below
- All the functions which does the database transactions are created in a custom hook and imported into components. Check
src\hooks\useFirestore.js
- You will have to create Indexes in firestore, as HomePage, AlbumPage uses Nested Queries to fetch data from Firestore. While running the application for first time there will be an error in console stating you to create an Index in Firestore. That Error will provide a link to create an Index in Firestore , you can click on the link and create an Index. (This Error will be solved after that particular Index is created)
- To Download Photo diretly from firebase storage in javacript as a Blob type, you have to change CORS policy in google cloud console, to know more check the below links