Skip to content

Latest commit

 

History

History
136 lines (101 loc) · 7.94 KB

README.md

File metadata and controls

136 lines (101 loc) · 7.94 KB

Cherry Storage – Web-Based Cloud Storage

Demo

Check out the live demo of the Cherry Storage – Web-Based Cloud Storage:

Firebase React Redux Blog App

Table of Contents

  1. Introduction
  2. Features
  3. Tech Stack
  4. Installation
  5. Screenshots
  6. License
  7. Contact

Introduction

Based on this TikTok video, this is the reason why I created this project. This project is a cloud storage platform similar to Google Drive, featuring a "Secured Folder" option. When this feature is enabled, no one can delete the folder except the collaborators assigned to it.

Features

This project includes several key features that enhance user experience and functionality:

  • CRUD Operations for Folders: Users can create, read, update, and delete folders seamlessly for better file organization.
  • CRD Operations for Files: Users can create, read, and delete files within their storage, ensuring smooth file management.
  • Folder Sharing: Allows users to share folders with others, enabling collaboration and easy access to shared content.
  • Add Collaborators to Folders: Users can add collaborators to specific folders, granting them access based on permissions.
  • Folder Visibility (Private/Public): Users can set folder visibility to either private (restricted access) or public (accessible to anyone with the link).
  • Secured Folder: Ensures that only collaborators can modify or delete the folder and download files within it, enhancing data protection.
  • Starred Folder: Users can mark important folders as starred for quick and easy access.
  • Recent Files: Automatically lists recently downloaded files for convenient access to frequently used documents.
  • User Account Management: Users can update their profile details, including name, email, password, and profile picture.
  • Search: A powerful search feature that allows users to find folders and files across different locations, with an overlay focus result for better visibility of search results.

Tech Stack

List the technologies and tools used in this project.

Static Badge Static Badge Static Badge Static Badge Ant Design Badge Static Badge Static Badge Static Badge Static Badge

Installation

Step-by-step guide on how to set up and run the project locally.

Prerequisites

  • Node.js
  • Git

Steps

  1. Clone the repository:

    git clone https://github.com/dillahCodes/cloud-storage-project.git
cd cloud-storage-project

  2. Install dependencies:

    npm install

  3. Set up environment variables by creating a .env file in the root directory (provide an example if needed):

    VITE_FIREBASE_API_KEY=your_firebase_api_key
VITE_FIREBASE_AUTH_DOMAIN=your_firebase_auth_domain
VITE_FIREBASE_PROJECT_ID=your_firebase_project_id
VITE_FIREBASE_STORAGE_BUCKET=your_firebase_storage_bucket
VITE_FIREBASE_MESSAGING_SENDER_ID=your_firebase_messaging_sender_id
VITE_FIREBASE_APP_ID=your_firebase_app_id
VITE_FIREBASE_MEASUREMENT_ID=your_firebase_measurement_id
VITE_USE_FIREBASE_EMULATOR=true # set to true to use firebase emulators or false to use in production
VITE_USE_STORAGE_CAPACITY= 52428800 # user storage capacity in bytes

  4. Start the development FrontEnd server:

    npm run dev

  5. Start the development Database Server:

    npm run db

  6. Local FrontEnd Server http://localhost:5173

  7. Local Firebase Server http://127.0.0.1:4000

  8. Available Script:

    npm run dev
npm run db
npm run build
npm run preview
npm run lint

Screenshots

Home Page Register or Login Page
Home Page Register or Login Page
Collaborator and Secured Folder Edit Profile Page
Collaborator and Secured Folder Edit Profile Page
Search Result Search Result Overlay
Search Result Search Result Overlay

License

This project is licensed under the MIT License

MIT License

Contact