Cloud Cube: Online Storage Platform

Cloud Cube is an online storage platform built using Next.js, providing users with a simple and efficient way to upload, organize, and access files from anywhere. Inspired by services like Dropbox, Cloud Cube offers a range of features to facilitate easy file uploading, management, and securely storing important documents and media, and experience the convenience of easy file management and sharing in one centralized solution.

Features

• Upload All File Types to Firebase Storage: Seamlessly upload various file types to Firebase storage.

• Full CRUD Functionality: Integrate full CRUD (Create, Read, Update, Delete) functionality for files, allowing users to manage their files effectively.

• Beautiful UI & UX: Crafted with the highly popular Shadcn, Cloud Cube boasts a beautiful and intuitive user interface to enhance the user experience.

• NextAuth Middleware: Protect unauthorized access using NextAuth middleware, ensuring secure access to sensitive data.

• Login and Logout Authentication Flow: Implement a seamless login and logout authentication flow using Clerk Authentication, enhancing security and user management.

• Loaders for Data Fetching: Utilize loaders to provide visual feedback to users while data is being fetched, enhancing the user experience.

• File Sorter Feature: Implement a file sorter feature to organize files based on various properties, allowing for efficient file management.

• Table View with File Metadata Display: Present all files in a table view with detailed file metadata display, enhancing file visibility and organization.

• Global State Management with Zustand: Leverage Zustand for global state management, ensuring efficient state handling across components.

• Beautiful UI Design with Tailwind CSS: Utilize Tailwind CSS to create a visually appealing and responsive user interface design.

• File Download Functionality: Enable users to download any uploaded file directly to their device, enhancing accessibility and usability.

• React DnD Library Integration: Implement the React DnD (Drag and Drop) library for seamless file uploads via drag and drop, improving user interaction.

• Dark Mode Toggling: Implement dark mode toggling to update the UI based on user preference, providing a personalized user experience.

• TypeScript Integration: Utilize TypeScript to reduce the overall number of bugs and errors, ensuring code reliability and maintainability.

• Deployment on Vercel: Deploy the final build on Vercel for efficient hosting and deployment, ensuring scalability and reliability.

Technologies Used

• Next.js
• Firebase Storage
• Shadcn
• NextAuth
• Clerk Authentication
• Zustand
• Tailwind CSS
• React DnD
• TypeScript
• Vercel

Getting Started

To get started with Cloud Cube, follow these steps:

1. Clone the repository:

   git clone https://github.com/Sayakdutt/CloudCube.git

2. Install dependencies:

   cd CloudCube
   npm install

3. Set up Firebase:

   • Create a Firebase project and set up Firebase Storage.
   • Add Firebase configuration to your Next.js project.

4. Set up Clerk Authentication:

   • Sign up for Clerk Authentication and configure your authentication settings.
   • Add Clerk Authentication configuration to your Next.js project.

5. Start the development server:

   npm run dev

6. Open your browser and navigate to http://localhost:3000 to access Cloud Cube.

Contributing

Contributions are welcome! Feel free to open issues and pull requests to contribute to the development of Cloud Cube.