praisonjoseph / photofolio

Photo library

Buy Busy

Full Stack Photo storage application created with React and Firebase.

🖥️ Tech Stack

     

🚀 Features

• Authentication
  • Login User
  • Signup User
• Home Page
  • Create a album structure with multiple child folders for photo storage
  • Preview/slideshow the images using a Carousel
  • Create/Edit/Delete images/album in the photo library

Getting started

1. Clone the repo

$ git clone https://github.com/praisonjoseph/photofolio.git
$ cd photofolio/

2. Set Up Firebase

I. Create a Firebase Project:

• Go to the Firebase Console.
• Click on "Add project" and follow the prompts to create a new Firebase project.

II. Configure Firebase for Web:

• In your Firebase project, click on the "Web" icon (</>) to add a web app to your project.
• Follow the setup instructions to create a Firebase web app. You'll receive a configuration object that includes your Firebase API keys and other settings.

III. Enable Authentication Providers

• In the Firebase Console, navigate to "Authentication" and choose the authentication providers you want to enable, such as Email/Password, and Google.

IV. Create a Firestore Database:

• In the Firebase Console, navigate to "Firestore" and create a new Firestore database for your project. Set up the rules and indexes as needed.

3. Set Up Environmental Variables

• Rename .env.sample to .env.local in the root directory
• Add Firebase configuration to .env.local