Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/tejazmali/multi-drive
Manage multiple Google Drive accounts from a single interface with options to edit, delete, create files, and view remaining storage.
https://github.com/tejazmali/multi-drive
cloud-drive css drive-manager google-drive html js multi-google-drive organizer
Last synced: 5 days ago
JSON representation
Manage multiple Google Drive accounts from a single interface with options to edit, delete, create files, and view remaining storage.
- Host: GitHub
- URL: https://github.com/tejazmali/multi-drive
- Owner: tejazmali
- Created: 2025-01-29T21:38:27.000Z (12 days ago)
- Default Branch: main
- Last Pushed: 2025-01-29T22:36:07.000Z (12 days ago)
- Last Synced: 2025-01-29T23:25:42.363Z (12 days ago)
- Topics: cloud-drive, css, drive-manager, google-drive, html, js, multi-google-drive, organizer
- Language: HTML
- Homepage:
- Size: 67.4 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
![]()
# Multi Drive
A simple web application to manage multiple Google Drive accounts, browse files, and view storage usage. Built with HTML, CSS, and JavaScript using the Google Drive API.
![Screenshot](https://github.com/tejazmali/Multi-Drive/blob/4d7a0f4d0cf7aff28bfe4fa6b36945cca6945dd7/img/Screenshot%202025-02-01%20010054.png)
![Screenshot](https://github.com/tejazmali/Multi-Drive/blob/4d7a0f4d0cf7aff28bfe4fa6b36945cca6945dd7/img/Screenshot%202025-02-01%20010116.png)---
## Features
- **Add Multiple Google Accounts**: Sign in with multiple Google accounts and manage them in one place.
- **Browse Files and Folders**: View files and folders in your Google Drive with a hierarchical structure.
- **Storage Usage**: Visualize storage usage with a progress bar.
- **Local Storage**: Save account data locally for quick access.
- **Drag-and-Drop Upload**: Upload files to Google Drive using drag-and-drop (optional).---
## Prerequisites
Before running the project, ensure you have the following:
1. **Google Cloud Project**:
- Create a project in the [Google Cloud Console](https://console.cloud.google.com/).
- Enable the **Google Drive API** and **Google OAuth 2.0 API**.
- Create OAuth 2.0 credentials (Client ID and Client Secret).2. **Node.js**:
- Install [Node.js](https://nodejs.org/) to run a local server.3. **Git**:
- Install [Git](https://git-scm.com/) to clone the repository.---
## Setup Instructions
### 1. Clone the Repository
```bash
git clone https://github.com/tejazmali/Multi-Drive.git
cd Multi-Drive
```### 2. Set Up Google API Credentials
1. Go to the [Google Cloud Console](https://console.cloud.google.com/).
2. Navigate to **APIs & Services → Credentials**.
3. Create an **OAuth 2.0 Client ID**.
4. Add `http://localhost:3000` to **Authorized JavaScript origins** and **Authorized redirect URIs**.
5. Download the `credentials.json` file and rename it to `credentials.js`.
6. Update `credentials.js` with your Client ID and API Key:```javascript
// credentials.js
export const CLIENT_ID = 'your-client-id.apps.googleusercontent.com';
export const API_KEY = 'your-api-key';
```
7. Add `credentials.js` to Multi-Drive Folder:### 3. Install Dependencies
Install the required dependencies to run a local server:
```bash
npm install -g serve
```### 4. Run the Project
Start the local server:
```bash
serve
```Open your browser and navigate to:
```
http://localhost:3000
```---
## Usage
1. **Add Google Account**:
- Click the **Add Google Account** button.
- Sign in with your Google account and grant the required permissions.2. **Browse Files**:
- Click the **Browse** button on an account card to view files and folders.
- Expand folders to view their contents.3. **Disconnect Account**:
- Click the **Disconnect** button to remove an account.---
## Troubleshooting
### 1. "Unverified App" Warning
- Add your email as a **Test User** in the Google Cloud Console under **OAuth consent screen**.### 2. Authentication Errors
- Ensure the **Authorized JavaScript origins** and **Authorized redirect URIs** in the Google Cloud Console match `http://localhost:3000`.### 3. CORS Issues
- Use a local server (e.g., `serve`) instead of opening the files directly (`file://` protocol).---
## Contributing
Contributions are welcome! Follow these steps:
1. Fork the repository.
2. Create a new branch (`git checkout -b feature/your-feature`).
3. Commit your changes (`git commit -m 'Add some feature'`).
4. Push to the branch (`git push origin feature/your-feature`).
5. Open a pull request.---
Enjoy managing your Google Drive accounts locally! 🚀
---