Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/prabal-verma/clouddrive

CloudDrive is a modern cloud storage web application built with Next.js and TypeScript 💻. It features secure authentication via Clerk 🔒, a sleek and responsive UI with Shadcn 🎨, and scalable backend services powered by Convex 🚀. Store, access, and manage your files effortlessly in the cloud ☁️, anytime, anywhere 🌍!
https://github.com/prabal-verma/clouddrive

Last synced: about 14 hours ago
JSON representation

Host: GitHub
URL: https://github.com/prabal-verma/clouddrive
Owner: Prabal-verma
License: mit
Created: 2024-07-04T14:58:03.000Z (6 months ago)
Default Branch: main
Last Pushed: 2024-07-09T16:04:16.000Z (6 months ago)
Last Synced: 2024-11-12T03:17:34.442Z (2 months ago)
Language: TypeScript
Homepage:
Size: 142 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

# CloudDrive

CloudDrive is a cloud storage web application built using Next.js and TypeScript. It leverages Clerk for authentication, Shadcn for the UI framework, and Convex for backend services.

![CloudDrive UI](path-to-your-image.png)

## Table of Contents

- [Introduction](#introduction)
- [Features](#features)
- [Tech Stack](#tech-stack)
- [Getting Started](#getting-started)
- [Prerequisites](#prerequisites)
- [Installation](#installation)
- [Running the App](#running-the-app)
- [Project Structure](#project-structure)
- [Usage](#usage)
- [Contributing](#contributing)
- [License](#license)

## Introduction

CloudDrive is a robust and user-friendly cloud storage solution designed to securely store and manage your files. With a sleek UI and powerful backend, it provides an intuitive and efficient user experience.

## Features

- **Secure Authentication**: Integrated with Clerk for secure user authentication.
- **Responsive UI**: Built with Shadcn for a modern and responsive user interface.
- **Scalable Backend**: Powered by Convex for efficient and scalable backend services.
- **File Management**: Upload, download, and organize your files effortlessly.
- **Real-time Updates**: Real-time syncing of files and data.

## Tech Stack

- **Framework**: Next.js
- **Language**: TypeScript
- **Authentication**: Clerk
- **UI Framework**: Shadcn
- **Backend Service**: Convex

## Getting Started

### Prerequisites

Make sure you have the following installed:

- Node.js
- npm or yarn
- Convex account
- Clerk account

### Installation

1. **Clone the repository:**

```bash
git clone https://github.com/Prabal-verma/CloudDrive.git
cd clouddrive
```

2. **Install dependencies:**

```bash
npm install
# or
yarn install
```

3. **Set up environment variables:**

Create a `.env.local` file in the root of the project and add the following variables:

```env
NEXT_PUBLIC_CLERK_FRONTEND_API=
CLERK_API_KEY=
CONVEX_URL=
```

### Running the App

Start the development server:

```bash
npm run dev
# or
yarn dev
```

The app will be available at `http://localhost:3000`.

## Project Structure

```plaintext
.
├── public
│ └── images
│ └── ui.png
├── src
│ ├── components
│ ├── pages
│ │ ├── api
│ │ ├── _app.tsx
│ │ └── index.tsx
│ ├── styles
│ ├── utils
│ └── hooks
├── .env.local
├── next.config.js
├── package.json
├── tsconfig.json
└── README.md
```

## Usage

1. **Sign Up / Sign In**: Use Clerk for authentication.
2. **Upload Files**: Upload files to your CloudDrive storage.
3. **Manage Files**: Create folders, move files, and organize your storage.
4. **Download Files**: Download files from your storage.

## Contributing

Contributions are welcome! Please create a pull request or open an issue to discuss any changes.

## License

This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.
```